Ensure Nunjucks {{ variables }} are padded with spaces

packages/govuk-frontend/src/govuk/components/accordion/template.njk

@@ -35,7 +35,7 @@
   }) -}}
 
   {%- if params.rememberExpanded !== undefined %} data-remember-expanded="{{ params.rememberExpanded | escape }}"{% endif %}
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   {% for item in params.items %}
     {% if item %}
       <div class="govuk-accordion__section {%- if item.expanded %} govuk-accordion__section--expanded{% endif %}">

packages/govuk-frontend/src/govuk/components/back-link/template.njk

@@ -1,2 +1,2 @@
 <a href="{% if params.href %}{{ params.href }}{% else %}#{% endif %}" class="govuk-back-link {%- if params.classes %} {{ params.classes }}{% endif %}"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ (params.html | safe if params.html else (params.text if params.text else 'Back')) }}</a>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ (params.html | safe if params.html else (params.text if params.text else 'Back')) }}</a>

packages/govuk-frontend/src/govuk/components/breadcrumbs/template.njk

@@ -9,12 +9,12 @@
   {% set classNames = classNames + " govuk-breadcrumbs--collapse-on-mobile" %}
 {% endif -%}
 
-<div class="{{classNames}}" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+<div class="{{ classNames }}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   <ol class="govuk-breadcrumbs__list">
   {% for item in params.items %}
     {% if item.href %}
     <li class="govuk-breadcrumbs__list-item">
-      <a class="govuk-breadcrumbs__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
+      <a class="govuk-breadcrumbs__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
     </li>
     {% else %}
     <li class="govuk-breadcrumbs__list-item" aria-current="page">{{ item.html | safe if item.html else item.text }}</li>

packages/govuk-frontend/src/govuk/components/button/template.njk

@@ -30,11 +30,11 @@ treat it as an interactive element - without this it will be
 
 {#- Define common attributes that we can use across all element types #}
 
-{%- set commonAttributes %} class="{{ classNames }}" data-module="govuk-button" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}{% if params.id %} id="{{ params.id }}"{% endif %}{% endset %}
+{%- set commonAttributes %} class="{{ classNames }}" data-module="govuk-button" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}{% if params.id %} id="{{ params.id }}"{% endif %}{% endset %}
 
 {#- Define common attributes we can use for both button and input types #}
 
-{%- set buttonAttributes %}{% if params.name %} name="{{ params.name }}"{% endif %}{% if params.disabled %} disabled aria-disabled="true"{% endif %}{% if params.preventDoubleClick !== undefined %} data-prevent-double-click="{{params.preventDoubleClick}}"{% endif %}{% endset %}
+{%- set buttonAttributes %}{% if params.name %} name="{{ params.name }}"{% endif %}{% if params.disabled %} disabled aria-disabled="true"{% endif %}{% if params.preventDoubleClick !== undefined %} data-prevent-double-click="{{ params.preventDoubleClick }}"{% endif %}{% endset %}
 
 {#- Actually create a button... or a link! #}
 

packages/govuk-frontend/src/govuk/components/cookie-banner/template.njk

@@ -2,16 +2,16 @@
 
 <div class="govuk-cookie-banner {%- if params.classes %} {{ params.classes }}{% endif %}" data-nosnippet role="region" aria-label="{{ params.ariaLabel | default("Cookie banner", true) }}"
   {%- if params.hidden %} hidden{% endif %}
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
 
   {%- for message in params.messages %}
     {% set classNames = "govuk-cookie-banner__message govuk-width-container" %}
     {% if message.classes %}
       {% set classNames = classNames + " " + message.classes %}
     {% endif %}
 
-    <div class="{{classNames}}" {%- if message.role %} role="{{message.role}}"{% endif %}
-    {%- for attribute, value in message.attributes %} {{attribute}}="{{value}}"{% endfor %}
+    <div class="{{ classNames }}" {%- if message.role %} role="{{ message.role }}"{% endif %}
+    {%- for attribute, value in message.attributes %} {{ attribute }}="{{ value }}"{% endfor %}
     {%- if message.hidden %} hidden{% endif %}>
 
     <div class="govuk-grid-row">
@@ -53,7 +53,7 @@
               {% if action.classes %}
                 {% set linkClasses = linkClasses + " " + action.classes %}
               {% endif %}
-              <a class="{{ linkClasses }}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ action.text }}</a>
+              <a class="{{ linkClasses }}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ action.text }}</a>
             {% endif %}
           {% else %}
             {{ govukButton({

packages/govuk-frontend/src/govuk/components/date-input/template.njk

@@ -52,7 +52,7 @@
   }) | indent(2) | trim }}
 {% endif %}
   <div class="govuk-date-input {%- if params.classes %} {{ params.classes }}{% endif %}"
-    {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}
+    {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}
     {%- if params.id %} id="{{ params.id }}"{% endif %}>
     {% for item in dateInputItems %}
     <div class="govuk-date-input__item">

packages/govuk-frontend/src/govuk/components/details/template.njk

@@ -1,4 +1,4 @@
-<details {%- if params.id %} id="{{params.id}}"{% endif %} class="govuk-details {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %} {{- " open" if params.open }}>
+<details {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-details {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} {{- " open" if params.open }}>
   <summary class="govuk-details__summary">
     <span class="govuk-details__summary-text">
       {{ params.summaryHtml | safe if params.summaryHtml else params.summaryText }}

packages/govuk-frontend/src/govuk/components/error-summary/template.njk

@@ -18,7 +18,7 @@
         {% for item in params.errorList %}
           <li>
           {% if item.href %}
-            <a href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
+            <a href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>{{ item.html | safe if item.html else item.text }}</a>
           {% else %}
             {{ item.html | safe if item.html else item.text }}
           {% endif %}

packages/govuk-frontend/src/govuk/components/exit-this-page/template.njk

@@ -5,7 +5,7 @@
 {%- endset -%}
 
 <div
-  {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-exit-this-page {%- if params.classes %} {{ params.classes }}{% endif %}" data-module="govuk-exit-this-page" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}
+  {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-exit-this-page {%- if params.classes %} {{ params.classes }}{% endif %}" data-module="govuk-exit-this-page" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}
   {%- if params.activatedText %} data-i18n.activated="{{ params.activatedText | escape }}"{% endif %}
   {%- if params.timedOutText %} data-i18n.timed-out="{{ params.timedOutText | escape }}"{% endif %}
   {%- if params.pressTwoMoreTimesText %} data-i18n.press-two-more-times="{{ params.pressTwoMoreTimesText | escape }}"{% endif %}

packages/govuk-frontend/src/govuk/components/file-upload/template.njk

@@ -41,5 +41,5 @@
   {%- if params.value %} value="{{ params.value }}"{% endif %}
   {%- if params.disabled %} disabled{% endif %}
   {%- if describedBy %} aria-describedby="{{ describedBy }}"{% endif %}
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
 </div>

packages/govuk-frontend/src/govuk/components/footer/template.njk

@@ -1,5 +1,5 @@
 <footer class="govuk-footer {%- if params.classes %} {{ params.classes }}{% endif %}" role="contentinfo"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   <div class="govuk-width-container {%- if params.containerClasses %} {{ params.containerClasses }}{% endif %}">
     {% if params.navigation | length %}
       <div class="govuk-footer__navigation">
@@ -12,7 +12,7 @@
                 {% for item in nav.items %}
                   {% if item.href and item.text %}
                     <li class="govuk-footer__list-item">
-                      <a class="govuk-footer__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+                      <a class="govuk-footer__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
                         {{ item.text }}
                       </a>
                     </li>
@@ -33,7 +33,7 @@
             <ul class="govuk-footer__inline-list">
               {% for item in params.meta.items %}
                 <li class="govuk-footer__inline-list-item">
-                  <a class="govuk-footer__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+                  <a class="govuk-footer__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
                     {{ item.text }}
                   </a>
                 </li>

packages/govuk-frontend/src/govuk/components/header/template.njk

@@ -1,7 +1,7 @@
 {% set menuButtonText = params.menuButtonText if params.menuButtonText else 'Menu' %}
 
 <header class="govuk-header {%- if params.classes %} {{ params.classes }}{% endif %}" role="banner" data-module="govuk-header"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   <div class="govuk-header__container {{ params.containerClasses | default("govuk-width-container", true) }}">
     <div class="govuk-header__logo">
       <a href="{{ params.homepageUrl | default("/", true) }}" class="govuk-header__link govuk-header__link--homepage">
@@ -65,7 +65,7 @@
           {% if item.text or item.html %}
             <li class="govuk-header__navigation-item {%- if item.active %} govuk-header__navigation-item--active{% endif %}">
               {% if item.href %}
-                <a class="govuk-header__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+                <a class="govuk-header__link" href="{{ item.href }}" {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
               {% endif %}
                 {{ item.html | safe if item.html else item.text }}
               {% if item.href %}

packages/govuk-frontend/src/govuk/components/hint/template.njk

@@ -1,4 +1,4 @@
 <div {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-hint {%- if params.classes %} {{ params.classes }}{% endif %}"
-{%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   {{ params.html | safe if params.html else params.text }}
 </div>

packages/govuk-frontend/src/govuk/components/input/template.njk

@@ -41,23 +41,23 @@
   {%- if params.prefix or params.suffix %}<div class="govuk-input__wrapper">{% endif -%}
 
   {%- if params.prefix.text or params.prefix.html -%}
-    <div class="govuk-input__prefix {%- if params.prefix.classes %} {{ params.prefix.classes }}{% endif %}" aria-hidden="true" {%- for attribute, value in params.prefix.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+    <div class="govuk-input__prefix {%- if params.prefix.classes %} {{ params.prefix.classes }}{% endif %}" aria-hidden="true" {%- for attribute, value in params.prefix.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
       {{- params.prefix.html | safe if params.prefix.html else params.prefix.text -}}
     </div>
   {% endif -%}
 
   <input class="govuk-input {%- if params.classes %} {{ params.classes }}{% endif %} {%- if params.errorMessage %} govuk-input--error{% endif %}" id="{{ params.id }}" name="{{ params.name }}" type="{{ params.type | default("text", true) }}"
   {%- if (params.spellcheck === false) or (params.spellcheck === true) %} spellcheck="{{ params.spellcheck }}"{% endif %}
-  {%- if params.value %} value="{{ params.value}}"{% endif %}
+  {%- if params.value %} value="{{ params.value }}"{% endif %}
   {%- if params.disabled %} disabled{% endif %}
   {%- if describedBy %} aria-describedby="{{ describedBy }}"{% endif %}
-  {%- if params.autocomplete %} autocomplete="{{ params.autocomplete}}"{% endif %}
+  {%- if params.autocomplete %} autocomplete="{{ params.autocomplete }}"{% endif %}
   {%- if params.pattern %} pattern="{{ params.pattern }}"{% endif %}
   {%- if params.inputmode %} inputmode="{{ params.inputmode }}"{% endif %}
   {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}>
 
   {%- if params.suffix.text or params.suffix.html -%}
-    <div class="govuk-input__suffix {%- if params.suffix.classes %} {{ params.suffix.classes }}{% endif %}" aria-hidden="true" {%- for attribute, value in params.suffix.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+    <div class="govuk-input__suffix {%- if params.suffix.classes %} {{ params.suffix.classes }}{% endif %}" aria-hidden="true" {%- for attribute, value in params.suffix.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
       {{- params.suffix.html | safe if params.suffix.html else params.suffix.text -}}
     </div>
   {% endif -%}

packages/govuk-frontend/src/govuk/components/inset-text/template.njk

@@ -1,4 +1,4 @@
 <div {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-inset-text {%- if params.classes %} {{ params.classes }}{% endif %}"
-{%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   {{ caller() if caller else (params.html | safe if params.html else params.text) }}
 </div>

packages/govuk-frontend/src/govuk/components/label/template.njk

@@ -1,7 +1,7 @@
 {% if params.html or params.text %}
 {% set labelHtml %}
 <label class="govuk-label {%- if params.classes %} {{ params.classes }}{% endif %}"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}
   {%- if params.for %} for="{{ params.for }}"{% endif %}>
   {{ params.html | safe if params.html else params.text }}
 </label>

packages/govuk-frontend/src/govuk/components/notification-banner/template.njk

@@ -30,7 +30,7 @@
   aria-labelledby="{{ params.titleId | default("govuk-notification-banner-title", true) }}"
   data-module="govuk-notification-banner"
   {%- if params.disableAutoFocus !== undefined %} data-disable-auto-focus="{{ params.disableAutoFocus }}"{% endif %}
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   <div class="govuk-notification-banner__header">
     <h{{ params.titleHeadingLevel | default(2, true) }} class="govuk-notification-banner__title" id="{{ params.titleId | default("govuk-notification-banner-title", true) }}">
       {{ title }}

packages/govuk-frontend/src/govuk/components/panel/template.njk

@@ -1,7 +1,7 @@
 {% set headingLevel = params.headingLevel if params.headingLevel else 1 %}
 <div class="govuk-panel govuk-panel--confirmation
   {%- if params.classes %} {{ params.classes }}{% endif %}"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   <h{{ headingLevel }} class="govuk-panel__title">
     {{ params.titleHtml | safe if params.titleHtml else params.titleText }}
   </h{{ headingLevel }}>

packages/govuk-frontend/src/govuk/components/summary-list/template.njk

@@ -1,5 +1,5 @@
 {%- macro _actionLink(action, cardTitle) %}
-  <a class="govuk-link {%- if action.classes %} {{ action.classes }}{% endif %}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  <a class="govuk-link {%- if action.classes %} {{ action.classes }}{% endif %}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
     {{- action.html | safe if action.html else action.text -}}
     {%- if action.visuallyHiddenText or cardTitle -%}
       <span class="govuk-visually-hidden">
@@ -13,7 +13,7 @@
 {%- macro _summaryCard(params) %}
   {%- set headingLevel = params.title.headingLevel if params.title.headingLevel else 2 -%}
 
-  <div class="govuk-summary-card {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  <div class="govuk-summary-card {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
     <div class="govuk-summary-card__title-wrapper">
       {%- if params.title -%}
         <h{{ headingLevel }} class="govuk-summary-card__title {%- if params.title.classes %} {{ params.title.classes }}{% endif %}">
@@ -51,7 +51,7 @@
 {% endfor -%}
 
 {%- set summaryList -%}
-  <dl class="govuk-summary-list {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+  <dl class="govuk-summary-list {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
     {% for row in params.rows %}
       {% if row %}
         <div class="govuk-summary-list__row {%- if anyRowHasActions and not row.actions.items %} govuk-summary-list__row--no-actions{% endif %} {%- if row.classes %} {{ row.classes }}{% endif %}">

packages/govuk-frontend/src/govuk/components/tabs/template.njk

@@ -2,7 +2,7 @@
   instead. We need this for error messages and hints as well -#}
 {% set idPrefix = params.idPrefix if params.idPrefix -%}
 
-<div {%- if params.id %} id="{{params.id}}"{% endif %} class="govuk-tabs {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %} data-module="govuk-tabs">
+<div {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-tabs {%- if params.classes %} {{ params.classes }}{% endif %}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} data-module="govuk-tabs">
   <h2 class="govuk-tabs__title">
     {{ params.title | default ("Contents") }}
   </h2>
@@ -13,7 +13,7 @@
         {% set id = item.id if item.id else idPrefix + "-" + loop.index %}
         <li class="govuk-tabs__list-item {%- if loop.index == 1 %} govuk-tabs__list-item--selected{% endif %}">
           <a class="govuk-tabs__tab" href="#{{ id }}"
-            {%- for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+            {%- for attribute, value in item.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
             {{ item.label }}
           </a>
         </li>
@@ -24,7 +24,7 @@
   {% for item in params.items %}
     {% if item %}
       {% set id = item.id if item.id else idPrefix + "-" + loop.index %}
-      <div class="govuk-tabs__panel {%- if loop.index > 1 %} govuk-tabs__panel--hidden{% endif %}" id="{{ id }}" {%- for attribute, value in item.panel.attributes %} {{attribute}}="{{value}}"{% endfor %}>
+      <div class="govuk-tabs__panel {%- if loop.index > 1 %} govuk-tabs__panel--hidden{% endif %}" id="{{ id }}" {%- for attribute, value in item.panel.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
         {% if item.panel.html %}
           {{ item.panel.html | safe }}
         {% elif item.panel.text %}