Add pause

- Add pause to improve screen reader experience.

"Upon taking to the a11y clinic for feedback, the group didn’t think lack of punctuation was an issue. Similar comments were made about how different screen readers and the different combinations of user settings + browsers, alter speed and pauses.

However with that being said there was additional work [1] conducted where punctuation was explored in more detail and found to be beneficial (blog post link below).  As a result of this it was decided we *would* include a pause in this iteration"

There might be more native controls within CSS in future[2] eg:
h1 { pause: 20ms; } /* pause-before: 20ms; pause-after: 20ms */

[1] https://accessibility.blog.gov.uk/2017/12/18/what-working-on-gov-uk-navigation-taught-us-about-accessibility/

[2]https://www.w3.org/TR/css-speech-1/#speak-as

src/govuk/components/accordion/accordion.js

@@ -118,6 +118,13 @@ Accordion.prototype.initHeaderAttributes = function ($headerWrapper, index) {
   var $showIcons = document.createElement('span')
   $showIcons.classList.add(this.sectionShowHideToggleClass)
 
+  // Add pause (with a comma) after heading for assistive technology.
+  // Example: [heading]Section A ,[pause] Show this section.
+  // https://accessibility.blog.gov.uk/2017/12/18/what-working-on-gov-uk-navigation-taught-us-about-accessibility/
+  var $srPause = document.createElement('span')
+  $srPause.classList.add('govuk-visually-hidden')
+  $srPause.innerHTML = ', '
+
   // Wrapper of heading to receive focus state design
   // ID set to allow the heading alone to be referenced without "this section"
   var $wrapperFocusHeading = document.createElement('span')
@@ -144,6 +151,7 @@ Accordion.prototype.initHeaderAttributes = function ($headerWrapper, index) {
   $heading.removeChild($span)
   $heading.appendChild($button)
   $button.appendChild($wrapperFocusHeading)
+  $button.appendChild($srPause)
   // span could contain HTML elements (see https://www.w3.org/TR/2011/WD-html5-20110525/content-models.html#phrasing-content)
   $wrapperFocusHeading.innerHTML = $span.innerHTML