govuk_publishing_components 27.20.0 → 28.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: abe5f80412062a42d0581b1137f85d3c6932cb23e20d840d08a345b642133e65
-  data.tar.gz: 6b46ff356ab253ec47fb4ed7d67f4cd8b40c0024bedf4511e03e4416b2ee519d
+  metadata.gz: 52ec5aa91a7d5060c6b29671f2206a967ab5af8a3891cb800c95d6b28eb09d15
+  data.tar.gz: 0bbf50f1bb6f0cd64af2986e72a612fe28a65df3987caf523939fcf87e3341ad
 SHA512:
-  metadata.gz: 92c367ffdd7fc084e3b68fac798c1e1e51f3c37b361e6003c877b4c8839c40eaecb98ecbf20e5d65de3fe1aa8926167c557d6ef767516d3d9deacc64f32113c4
-  data.tar.gz: 971c347b11fdb3d12302e44deaa3bb77406b6b76d15c78e4af44c415b950aabfa688a1e9708de04eea09bf274b0484c30c27c2917392d862a1af10b013549380
+  metadata.gz: a144e7583969b1767bb25e64f64772d4c4e632814ba3863f6335570a3a83936eea4aa76daeb1b006f39910b5b6086f1f9f65ea63b3068f929bc167f2f5237ea2
+  data.tar.gz: 78e13b419fba7b1eac89947ca9891e87f4939ed27456e093c474fbeca3afb291c6c86b002fbed478630b78671bd061637a208cf5f043656631b5d12e7b5af72c

data/app/assets/javascripts/govuk_publishing_components/analytics/download-link-tracker.js

@@ -1,23 +1,38 @@
 ;(function (global) {
   'use strict'
 
-  var $ = global.jQuery
   var GOVUK = global.GOVUK || {}
 
   GOVUK.analyticsPlugins = GOVUK.analyticsPlugins || {}
   GOVUK.analyticsPlugins.downloadLinkTracker = function (options) {
     options = options || {}
     var downloadLinkSelector = options.selector
+    var selectors = downloadLinkSelector.split(',')
 
     if (downloadLinkSelector) {
-      $('body').on('click', downloadLinkSelector, trackDownload)
+      document.querySelector('body').addEventListener('click', function (event) {
+        var element = event.target
+        if (element.tagName !== 'A') {
+          element = element.closest('a')
+        }
+
+        if (!element) {
+          return
+        }
+
+        for (var i = 0; i < selectors.length; i++) {
+          if (element.matches(selectors[i].trim())) {
+            trackDownload(element)
+            break
+          }
+        }
+      })
     }
 
-    function trackDownload (evt) {
-      var $link = getLinkFromEvent(evt)
-      var href = $link.attr('href')
+    function trackDownload (element) {
+      var href = element.getAttribute('href')
       var evtOptions = { transport: 'beacon' }
-      var linkText = $.trim($link.text())
+      var linkText = element.textContent.trim()
 
       if (linkText) {
         evtOptions.label = linkText
@@ -25,16 +40,6 @@
 
       GOVUK.analytics.trackEvent('Download Link Clicked', href, evtOptions)
     }
-
-    function getLinkFromEvent (evt) {
-      var $target = $(evt.target)
-
-      if (!$target.is('a')) {
-        $target = $target.parents('a')
-      }
-
-      return $target
-    }
   }
 
   global.GOVUK = GOVUK

data/app/assets/javascripts/govuk_publishing_components/analytics/external-link-tracker.js

@@ -1,49 +1,63 @@
+// = require govuk/vendor/polyfills/Element/prototype/closest.js
 ;(function (global) {
   'use strict'
 
-  var $ = global.jQuery
   var GOVUK = global.GOVUK || {}
 
   GOVUK.analyticsPlugins = GOVUK.analyticsPlugins || {}
   GOVUK.analyticsPlugins.externalLinkTracker = function (options) {
     options = options || {}
-    var externalLinkUploadCustomDimension = options.externalLinkUploadCustomDimension
+    GOVUK.analyticsPlugins.externalLinkTracker.options = options
+    document.querySelector('body').addEventListener('click', GOVUK.analyticsPlugins.externalLinkTracker.handleClick)
+  }
+
+  GOVUK.analyticsPlugins.externalLinkTracker.handleClick = function (event) {
+    var element = event.target
+    if (element.tagName !== 'A') {
+      element = element.closest('a')
+    }
+
+    if (!element) {
+      return
+    }
+
+    if (GOVUK.analyticsPlugins.externalLinkTracker.isExternalLink(element.getAttribute('href'))) {
+      GOVUK.analyticsPlugins.externalLinkTracker.trackClickEvent(element)
+    }
+  }
+
+  GOVUK.analyticsPlugins.externalLinkTracker.isExternalLink = function (href) {
+    if (!href) {
+      return false
+    }
+
     var currentHost = GOVUK.analyticsPlugins.externalLinkTracker.getHostname()
-    var externalLinkSelector = 'a[href^="http"]:not(a[href*="' + currentHost + '"])'
-    $('body').on('click', externalLinkSelector, trackClickEvent)
-
-    function trackClickEvent (evt) {
-      var $link = getLinkFromEvent(evt)
-      var options = { transport: 'beacon' }
-      var href = $link.attr('href')
-      var linkText = $.trim($link.text())
-
-      if (linkText) {
-        options.label = linkText
-      }
-
-      if (externalLinkUploadCustomDimension !== undefined) {
-        // This custom dimension will be used to duplicate the url information
-        // that we normally send in an "event action". This will be used to join
-        // up with a scheduled custom upload called "External Link Status".
-        // We can only join uploads on custom dimensions, not on `event actions`
-        // where we normally add the url info.
-        var externalLinkToJoinUploadOn = href
-
-        GOVUK.analytics.setDimension(externalLinkUploadCustomDimension, externalLinkToJoinUploadOn)
-      }
-      GOVUK.analytics.trackEvent('External Link Clicked', href, options)
+    if (href.substring(0, 4) === 'http' && href.indexOf(currentHost) === -1) {
+      return true
     }
+  }
+
+  GOVUK.analyticsPlugins.externalLinkTracker.trackClickEvent = function (element) {
+    var options = { transport: 'beacon' }
+    var href = element.getAttribute('href')
+    var linkText = element.textContent.trim()
 
-    function getLinkFromEvent (evt) {
-      var $target = $(evt.target)
+    if (linkText) {
+      options.label = linkText
+    }
 
-      if (!$target.is('a')) {
-        $target = $target.parents('a')
-      }
+    var externalLinkUploadCustomDimension = GOVUK.analyticsPlugins.externalLinkTracker.options.externalLinkUploadCustomDimension
+    if (externalLinkUploadCustomDimension !== undefined) {
+      // This custom dimension will be used to duplicate the url information
+      // that we normally send in an "event action". This will be used to join
+      // up with a scheduled custom upload called "External Link Status".
+      // We can only join uploads on custom dimensions, not on `event actions`
+      // where we normally add the url info.
+      var externalLinkToJoinUploadOn = href
 
-      return $target
+      GOVUK.analytics.setDimension(externalLinkUploadCustomDimension, externalLinkToJoinUploadOn)
     }
+    GOVUK.analytics.trackEvent('External Link Clicked', href, options)
   }
 
   GOVUK.analyticsPlugins.externalLinkTracker.getHostname = function () {

data/app/assets/javascripts/govuk_publishing_components/analytics/google-analytics-universal-tracker.js

@@ -1,7 +1,6 @@
 ;(function (global) {
   'use strict'
 
-  var $ = global.jQuery
   var GOVUK = global.GOVUK || {}
   var pii
 
@@ -78,7 +77,7 @@
     // Set an options object for the pageview (e.g. transport, sessionControl)
     // https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#transport
     if (typeof options === 'object') {
-      pageviewObject = $.extend(pageviewObject || {}, options)
+      pageviewObject = GOVUK.extendObject(pageviewObject || {}, options)
 
       // trackerName is optional
       if (typeof options.trackerName === 'string') {
@@ -87,10 +86,24 @@
       }
     }
 
-    if (!$.isEmptyObject(pageviewObject)) {
-      sendToGa(trackerName + 'send', 'pageview', pageviewObject)
-    } else {
+    function isEmptyObject (obj) {
+      if (typeof obj === 'undefined') {
+        return true
+      }
+
+      for (var prop in obj) {
+        if (Object.prototype.hasOwnProperty.call(obj, prop)) {
+          return false
+        }
+      }
+
+      return JSON.stringify(obj) === JSON.stringify({})
+    }
+
+    if (isEmptyObject(pageviewObject)) {
       sendToGa(trackerName + 'send', 'pageview')
+    } else {
+      sendToGa(trackerName + 'send', 'pageview', pageviewObject)
     }
   }
 
@@ -135,7 +148,7 @@
     }
 
     if (typeof options === 'object') {
-      $.extend(evt, options)
+      evt = GOVUK.extendObject(evt, options)
     }
 
     sendToGa(trackerName + 'send', evt)
@@ -156,7 +169,7 @@
       socialTarget: target
     }
 
-    $.extend(trackingOptions, options)
+    trackingOptions = GOVUK.extendObject(trackingOptions, options)
 
     sendToGa('send', trackingOptions)
   }

data/app/assets/javascripts/govuk_publishing_components/analytics/scroll-tracker.js

@@ -5,132 +5,7 @@
 
   window.GOVUK = window.GOVUK || {}
 
-  var percentages = [
-    ['Percent', 20],
-    ['Percent', 40],
-    ['Percent', 60],
-    ['Percent', 80],
-    ['Percent', 100]
-  ]
-
-  var CONFIG = {
-    '/brexit': percentages,
-    '/government/publications/the-essential-trustee-what-you-need-to-know-cc3/the-essential-trustee-what-you-need-to-know-what-you-need-to-do': [
-      ['Heading', '1. About this guidance'],
-      ['Heading', '2. Trustees’ duties at a glance'],
-      ['Heading', '3. Who can be a trustee and how trustees are appointed'],
-      ['Heading', '4. Ensure your charity is carrying out its purposes for the public benefit'],
-      ['Heading', '5. Comply with your charity’s governing document and the law'],
-      ['Heading', '6. Act in your charity’s best interests'],
-      ['Heading', '7. Manage your charity’s resources responsibly'],
-      ['Heading', '8. Act with reasonable care and skill'],
-      ['Heading', '9. Ensure your charity is accountable'],
-      ['Heading', '10. Reduce the risk of liability'],
-      ['Heading', '11. Your charity’s legal structure and what it means'],
-      ['Heading', '12. Charity officers - the chair and treasurer'],
-      ['Heading', '13. Technical terms used in this guidance']
-    ],
-    '/guidance/universal-credit-how-it-helps-you-into-work': [
-      ['Heading', 'Support from your work coach'],
-      ['Heading', 'Help available for parents'],
-      ['Heading', 'When you can claim Universal Credit'],
-      ['Heading', 'More detailed advice']
-    ],
-    '/government/publications/spring-budget-2017-documents/spring-budget-2017': [
-      ['Heading', '1. Executive summary'],
-      ['Heading', '2. Economic context and public finances'],
-      ['Heading', '3. Policy decisions'],
-      ['Heading', '4. Tax'],
-      ['Heading', '5. Productivity'],
-      ['Heading', '6. Public services and markets'],
-      ['Heading', '7. Annex A: Financing'],
-      ['Heading', '8. Annex B: Office for Budget Responsibility\'s Economic and fiscal outlook']
-    ],
-    '/settled-status-eu-citizens-families': [
-      ['Heading', 'When you can apply']
-    ],
-    '/guidance/returning-to-the-uk': [
-      ['Heading', 'Ending your time living abroad']
-    ],
-    '/council-housing': [
-      ['Heading', 'Choice-based lettings']
-    ],
-    '/guidance/foreign-travel-insurance': [
-      ['Heading', 'What your travel insurance policy should cover']
-    ],
-    '/guidance/living-in-france': [
-      ['Heading', 'Passports and travel']
-    ],
-    '/family-permit': [
-      ['Heading', 'EEA family permit']
-    ],
-    '/guidance/healthcare-for-eu-and-efta-citizens-visiting-the-uk': [
-      ['Heading', 'Travel insurance']
-    ],
-    '/driving-abroad': [
-      ['Heading', 'Check your insurance if you’re taking your own vehicle']
-    ],
-    '/get-a-passport-urgently': [
-      ['Heading', 'Ways to apply']
-    ],
-    '/driving-abroad/international-driving-permit': [
-      ['Heading', 'Check which IDP you need']
-    ],
-    '/guidance/guidance-for-suppliers-of-cattle-sheep-and-goat-ear-tags': [
-      ['Heading', 'Tagging information for livestock keepers']
-    ],
-    '/guidance/how-to-move-goods-between-or-through-common-transit-countries-including-the-eu': [
-      ['Heading', 'Start moving your goods']
-    ],
-    '/guidance/ecmt-international-road-haulage-permits': [
-      ['Heading', 'Apply for permits']
-    ],
-    '/taking-goods-out-uk-temporarily/get-an-ata-carnet': [
-      ['Heading', 'Using an ATA Carnet']
-    ],
-    '/wood-packaging-import-export': [
-      ['Heading', 'Export solid wood packaging']
-    ],
-    '/coronavirus': percentages,
-    '/coronavirus/education-and-childcare': percentages,
-    '/coronavirus/worker-support': percentages,
-    '/coronavirus/business-support': percentages,
-    '/get-coronavirus-test': percentages,
-    '/next-steps-for-your-business/results': [
-      ['Heading', 'Things you need to do next'],
-      ['Heading', 'Rules to follow'],
-      ['Heading', 'Good to know'],
-      ['Heading', 'Change your answers']
-    ],
-    '/guidance/brexit-guidance-for-businesses': percentages,
-    '/guidance/brexit-guidance-for-businesses.cy': percentages,
-    '/guidance/brexit-guidance-for-individuals-and-families': percentages,
-    '/guidance/brexit-guidance-for-individuals-and-families.cy': percentages,
-    '/guidance/import-and-export-goods-using-preference-agreements': percentages,
-    '/guidance/travel-abroad-from-england-during-coronavirus-covid-19': [
-      ['Heading', 'Before you travel abroad'],
-      ['Heading', '1. Check the rules for the country you’re going to'],
-      ['Heading', '2. Find out what you need to do when you return'],
-      ['Heading', '3. Book any COVID-19 tests or quarantine hotel packages you need for your return'],
-      ['Heading', 'Before you return'],
-      ['Heading', 'After you return'],
-      ['Heading', 'Travelling with children'],
-      ['Heading', 'Ireland, the UK, the Channel Islands and the Isle of Man'],
-      ['Heading', 'Exemptions for work, medical or compassionate reasons']
-    ],
-    '/guidance/travel-to-england-from-another-country-during-coronavirus-covid-19': [
-      ['Heading', 'Before you travel'],
-      ['Heading', '1. Check the rules for the country you’re coming from or have travelled through'],
-      ['Heading', '2. Book any COVID-19 tests or quarantine hotel packages you need for your arrival'],
-      ['Heading', '3. Get tested and complete documents'],
-      ['Heading', 'When you arrive in England'],
-      ['Heading', 'Leaving England'],
-      ['Heading', 'Travelling with children'],
-      ['Heading', 'Ireland, the UK, the Channel Islands and the Isle of Man'],
-      ['Heading', 'Exemptions for work, medical or compassionate reasons']
-    ],
-    '/find-travel-test-provider': percentages
-  }
+  var CONFIG = {}
 
   function ScrollTracker (sitewideConfig) {
     this.config = this.getConfigForCurrentPath(sitewideConfig)

data/app/assets/javascripts/govuk_publishing_components/components/feedback.js

@@ -25,10 +25,16 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     this.setInitialAriaAttributes()
     this.setHiddenValues()
 
+    this.prompt.hidden = false
+    for (var k = 0; k < this.promptQuestions.length; k++) {
+      this.promptQuestions[k].hidden = false
+    }
+    this.surveyForm.hidden = true
+
     for (var j = 0; j < this.toggleForms.length; j++) {
       this.toggleForms[j].addEventListener('click', function (e) {
         e.preventDefault()
-        var el = e.target
+        var el = e.target.closest('button')
         this.toggleForm(el.getAttribute('aria-controls'))
         this.trackEvent(this.getTrackEventParams(el))
         this.updateAriaAttributes(el)
@@ -36,6 +42,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     }
 
     for (var i = 0; i < this.closeForms.length; i++) {
+      this.closeForms[i].hidden = false
       this.closeForms[i].addEventListener('click', function (e) {
         e.preventDefault()
         var el = e.target
@@ -89,7 +96,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
               this.showFormSuccess(xhr.message)
               this.revealInitialPrompt()
               this.setInitialAriaAttributes()
-              this.activeForm.classList.toggle(this.jshiddenClass)
+              this.activeForm.hidden ? this.activeForm.hidden = false : this.activeForm.hidden = true
             } else {
               this.showError(xhr)
               this.enableSubmitFormButton($form)
@@ -114,9 +121,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   }
 
   Feedback.prototype.setInitialAriaAttributes = function () {
-    for (var i = 0; i < this.forms.length; i++) {
-      this.forms[i].setAttribute('aria-hidden', true)
-    }
     this.pageIsNotUsefulButton.setAttribute('aria-expanded', false)
     this.somethingIsWrongButton.setAttribute('aria-expanded', false)
   }
@@ -168,20 +172,16 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
   Feedback.prototype.updateAriaAttributes = function (linkClicked) {
     linkClicked.setAttribute('aria-expanded', true)
-    var controls = linkClicked.getAttribute('aria-controls')
-    var ariaControls = document.querySelector('#' + controls)
-    ariaControls.setAttribute('aria-hidden', false)
   }
 
   Feedback.prototype.toggleForm = function (formId) {
     this.activeForm = this.$module.querySelector('#' + formId)
-    this.activeForm.classList.toggle(this.jshiddenClass)
-    this.prompt.classList.toggle(this.jshiddenClass)
-
-    var formIsVisible = !this.activeForm.classList.contains(this.jshiddenClass)
+    this.activeForm.hidden ? this.activeForm.hidden = false : this.activeForm.hidden = true
+    this.prompt.hidden ? this.prompt.hidden = false : this.prompt.hidden = true
 
-    if (formIsVisible) {
-      this.activeForm.querySelector('.gem-c-input').focus()
+    if (!this.activeForm.hidden) {
+      this.activeForm.querySelectorAll('.gem-c-textarea .govuk-textarea, .gem-c-input.govuk-input')[0]
+        .focus()
     } else {
       this.activeForm = false
     }
@@ -223,20 +223,20 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     }
     var $errors = this.activeForm.querySelector('.js-errors')
     $errors.innerHTML = error
-    $errors.classList.remove(this.jshiddenClass)
+    $errors.hidden = false
     $errors.focus()
   }
 
   Feedback.prototype.showFormSuccess = function () {
     for (var i = 0; i < this.promptQuestions.length; i++) {
-      this.promptQuestions[i].classList.add(this.jshiddenClass)
+      this.promptQuestions[i].hidden = true
     }
-    this.promptSuccessMessage.classList.remove(this.jshiddenClass)
+    this.promptSuccessMessage.hidden = false
     this.promptSuccessMessage.focus()
   }
 
   Feedback.prototype.revealInitialPrompt = function () {
-    this.prompt.classList.remove(this.jshiddenClass)
+    this.prompt.hidden = false
     this.prompt.focus()
   }
 

data/app/assets/javascripts/govuk_publishing_components/lib/extend-object.js

@@ -0,0 +1,22 @@
+(function (root) {
+  'use strict'
+  window.GOVUK = window.GOVUK || {}
+
+  window.GOVUK.extendObject = function (obj) {
+    obj = obj || {}
+
+    for (var i = 1; i < arguments.length; i++) {
+      if (!arguments[i]) {
+        continue
+      }
+
+      for (var key in arguments[i]) {
+        if (Object.prototype.hasOwnProperty.call(arguments[i], key)) {
+          obj[key] = arguments[i][key]
+        }
+      }
+    }
+
+    return obj
+  }
+}(window))

data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss

@@ -39,7 +39,6 @@ $govuk-new-link-styles: true;
 @import "components/govspeak-html-publication";
 @import "components/govspeak";
 @import "components/heading";
-@import "components/highlight-boxes";
 @import "components/hint";
 @import "components/image-card";
 @import "components/input";
@@ -79,7 +78,6 @@ $govuk-new-link-styles: true;
 @import "components/summary-list";
 @import "components/tabs";
 @import "components/table";
-@import "components/taxonomy-list";
 @import "components/textarea";
 @import "components/title";
 @import "components/translation-nav";

data/app/assets/stylesheets/govuk_publishing_components/components/_feedback.scss

@@ -6,6 +6,12 @@
     margin-top: govuk-spacing(9);
     border-bottom: 1px solid govuk-colour("white");
   }
+
+  // Scoped to the feedback component temporarily
+  [hidden] {
+    // stylelint-disable-next-line declaration-no-important
+    display: none !important;
+  }
 }
 
 .gem-c-feedback__prompt-questions {
@@ -238,38 +244,3 @@
     outline: $govuk-focus-width solid $govuk-focus-colour;
   }
 }
-
-// hide without js
-// show with js, unless also has the js-hidden class
-.gem-c-feedback__js-show,
-.gem-c-feedback__prompt-success,
-.gem-c-feedback__prompt-questions,
-.gem-c-feedback__error-summary {
-  display: none;
-
-  .js-enabled & {
-    display: block;
-
-    &.js-hidden {
-      display: none;
-    }
-  }
-}
-
-// maintain table display for prompt and prompt-questions
-.js-enabled .gem-c-feedback__prompt {
-  @include govuk-media-query($from: tablet) {
-    display: table;
-  }
-}
-
-.js-enabled .gem-c-feedback__prompt-questions {
-  @include govuk-media-query($from: tablet) {
-    display: table-cell;
-  }
-}
-
-// show the default feedback form without js
-.js-enabled .gem-c-feedback__form.js-hidden {
-  display: none;
-}

data/app/views/govuk_publishing_components/components/docs/feedback.yml

@@ -5,6 +5,11 @@ body: |
 
   This component uses JavaScript for expanding and collapsing and also for submitting form responses. This code is not compatible with Internet Explorer, so IE11 and down do not use JavaScript to submit the forms, instead falling back to a normal form submission.
 accessibility_criteria: |
+  The form must:
+
+  * be functional and accessible with JavaScript disabled
+  * be usable and accessible with stylesheets disabled
+
   Form elements in the component must:
 
   * accept focus

data/app/views/govuk_publishing_components/components/feedback/_problem_form.html.erb

@@ -1,9 +1,10 @@
 <form action="/contact/govuk/problem_reports"
   id="something-is-wrong"
-  class="gem-c-feedback__form js-feedback-form js-hidden"
+  class="gem-c-feedback__form js-feedback-form"
   data-track-category="Onsite Feedback"
   data-track-action="GOV.UK Send Form"
-  method="post">
+  method="post"
+  hidden>
   <button
     class="govuk-button govuk-button--secondary gem-c-feedback__close gem-c-feedback__js-show js-close-form"
     data-track-category="Onsite Feedback"
@@ -15,26 +16,28 @@
 
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">
-      <div class="gem-c-feedback__error-summary gem-c-feedback__js-show js-hidden js-errors" tabindex="-1"></div>
+      <div class="gem-c-feedback__error-summary gem-c-feedback__js-show js-errors" tabindex="-1" hidden></div>
 
       <input type="hidden" name="url" value="<%= url_without_pii %>">
 
       <h3 class="gem-c-feedback__form-heading"><%= t("components.feedback.help_us_improve_govuk") %></h3>
       <p id="feedback_explanation" class="gem-c-feedback__form-paragraph"><%= t("components.feedback.dont_include_personal_info") %></p>
 
-      <%= render "govuk_publishing_components/components/input", {
+      <%= render "govuk_publishing_components/components/textarea", {
         label: {
           text: t("components.feedback.what_doing")
         },
         name: "what_doing",
+        rows: 3,
         describedby: "feedback_explanation"
       } %>
 
-      <%= render "govuk_publishing_components/components/input", {
+      <%= render "govuk_publishing_components/components/textarea", {
         label: {
           text: t("components.feedback.what_wrong")
         },
-        name: "what_wrong"
+        name: "what_wrong",
+        rows: 3
       } %>
 
       <%= render "govuk_publishing_components/components/button", {

data/app/views/govuk_publishing_components/components/feedback/_survey_signup_form.html.erb

@@ -1,6 +1,6 @@
 <form action="/contact/govuk/email-survey-signup"
   id="page-is-not-useful"
-  class="gem-c-feedback__form gem-c-feedback__form--email gem-c-feedback__js-show js-feedback-form js-hidden"
+  class="gem-c-feedback__form gem-c-feedback__form--email gem-c-feedback__js-show js-feedback-form"
   data-track-category="yesNoFeedbackForm"
   data-track-action="Send Form"
   method="post">
@@ -9,13 +9,14 @@
     data-track-category="yesNoFeedbackForm"
     data-track-action="ffFormClose"
     aria-controls="page-is-not-useful"
-    aria-expanded="true">
+    aria-expanded="true"
+    hidden>
     <%= t("components.feedback.close") %>
   </button>
 
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds" id="survey-wrapper">
-      <div class="gem-c-feedback__error-summary js-hidden js-errors" tabindex="-1"></div>
+      <div class="gem-c-feedback__error-summary js-errors" tabindex="-1" hidden></div>
 
       <input name="email_survey_signup[survey_id]" type="hidden" value="footer_satisfaction_survey">
       <input name="email_survey_signup[survey_source]" type="hidden" value="<%= path_without_pii %>">

data/app/views/govuk_publishing_components/components/feedback/_yes_no_banner.html.erb

@@ -3,10 +3,10 @@
 %>
 
 <div class="gem-c-feedback__prompt gem-c-feedback__js-show js-prompt" tabindex="-1">
-  <div class="gem-c-feedback__prompt-questions js-prompt-questions">
+  <div class="gem-c-feedback__prompt-questions js-prompt-questions" hidden>
     <h2 class="gem-c-feedback__prompt-question"><%= t("components.feedback.is_this_page_useful") %></h2>
     <!-- Maybe button exists only to try and capture clicks by bots -->
-    <button data-track-category="yesNoFeedbackForm" data-track-action="ffMaybeClick" aria-expanded="false" style="display: none" hidden="hidden" aria-hidden="true">
+    <button data-track-category="yesNoFeedbackForm" data-track-action="ffMaybeClick" aria-expanded="false" hidden>
       <%= t("components.feedback.maybe") %>
     </button>
     
@@ -23,10 +23,10 @@
       </li>
     </ul>
   </div>
-  <div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-success js-prompt-success js-hidden" role="alert">
+  <div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-success js-prompt-success" role="alert" hidden>
     <%= t("components.feedback.thank_you_for_feedback") %>
   </div>
-  <div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-questions--something-is-wrong js-prompt-questions">
+  <div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-questions--something-is-wrong js-prompt-questions" hidden>
     <button class="govuk-button gem-c-feedback__prompt-link js-toggle-form js-something-is-wrong" data-track-category="Onsite Feedback" data-track-action="GOV-UK Open Form" aria-controls="something-is-wrong" aria-expanded="false">
       <%= t("components.feedback.something_wrong") %>
     </button>