govuk_publishing_components 28.2.0 → 28.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '0989b4b0c9bafbc71f0347de67fb337acee0cfb13da092fae2be8c6c35122d32'
-  data.tar.gz: e56b816c73f788ca8bfd9383fe39db912a84f5a14b141bb258cd7e7fcc526919
+  metadata.gz: 85985bab4532c5cbccfa05369e032e61cedfda7468ab5654d10ce0eb937155b8
+  data.tar.gz: fd00b4c1e0784b1951f0103412dc7dd2eaf619d2ad72456c77b892903fc1cd9a
 SHA512:
-  metadata.gz: 384f96c451155a016bbfea69596892e4ed287afa095a0780570d07842c62498f3de4890819e1d87e173a856178e74d34e3f6561562aa8b5e9e2fe7a5974a2380
-  data.tar.gz: b8e6166d94e9536640edca9e877f8bec63429596dfe7c563f2521b2254b4acbcadd7decf26ffbc64ca28b14a8a5bd2b02d8fb7ceba35a2d523c3c65641b8d3fb
+  metadata.gz: fd73aa7768ba4224e03065bb8b04becf3e4c227c50422eb5255ab52fe82a075a8e5968d143ecb80bbc3f3481432783ab1ef7dad55515801f2905c2449676989d
+  data.tar.gz: 6b0541c15147aedcbbd890cb222d280ba02f492fb84d5a280580b5fa6d64a58f6e5a80ae2277bd9667e3e9c7a9c28b22ba2ef590400b5b047230cb3e0036f41b

data/README.md

@@ -27,7 +27,7 @@ bundle exec rake
 
 To run JavaScript tests (only):
 
-```
+```sh
 # run JS tests in browser
 bin/rake app:jasmine
 

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

@@ -199,7 +199,8 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
 
     for (var i = 0; i < this.config.percentages.length; i++) {
       var percent = this.config.percentages[i]
-      var pos = (pageHeight / 100) * percent
+      // subtract 1 pixel to solve a bug where 100% can't be reached in some cases
+      var pos = ((pageHeight / 100) * percent) - 1
       var alreadySeen = false
       if (trackedNodes.length) {
         alreadySeen = trackedNodes[i].alreadySeen

data/app/assets/javascripts/govuk_publishing_components/analytics/auto-track-event.js

@@ -1,30 +1,30 @@
-;(function (global) {
-  'use strict'
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {};
 
-  var GOVUK = global.GOVUK || {}
-  GOVUK.Modules = GOVUK.Modules || {}
+(function (Modules) {
+  function AutoTrackEvent ($module) {
+    this.$module = $module
+  }
 
-  GOVUK.Modules.AutoTrackEvent = function () {
-    this.start = function (element) {
-      var options = { nonInteraction: 1 } // automatic events shouldn't affect bounce rate
-      var category = element.data('track-category')
-      var action = element.data('track-action')
-      var label = element.data('track-label')
-      var value = element.data('track-value')
+  AutoTrackEvent.prototype.init = function () {
+    var options = { nonInteraction: 1 } // automatic events shouldn't affect bounce rate
+    var category = this.$module.getAttribute('data-track-category')
+    var action = this.$module.getAttribute('data-track-action')
+    var label = this.$module.getAttribute('data-track-label')
+    var value = parseInt(this.$module.getAttribute('data-track-value'))
 
-      if (typeof label === 'string') {
-        options.label = label
-      }
+    if (typeof label === 'string') {
+      options.label = label
+    }
 
-      if (value || value === 0) {
-        options.value = value
-      }
+    if (value || value === 0) {
+      options.value = value
+    }
 
-      if (GOVUK.analytics && GOVUK.analytics.trackEvent) {
-        GOVUK.analytics.trackEvent(category, action, options)
-      }
+    if (window.GOVUK.analytics && window.GOVUK.analytics.trackEvent) {
+      window.GOVUK.analytics.trackEvent(category, action, options)
     }
   }
 
-  global.GOVUK = GOVUK
-})(window)
+  Modules.AutoTrackEvent = AutoTrackEvent
+})(window.GOVUK.Modules)

data/app/assets/javascripts/govuk_publishing_components/analytics/pii.js

@@ -1,5 +1,3 @@
-/* global $ */
-
 ;(function (global) {
   'use strict'
 
@@ -15,15 +13,21 @@
   var STATE_PATTERN = /state=.[^&]+/g
 
   function shouldStripDates () {
-    return ($('meta[name="govuk:static-analytics:strip-dates"]').length > 0)
+    var metas = document.querySelectorAll('meta[name="govuk:static-analytics:strip-dates"]')
+    return metas.length > 0
   }
 
   function shouldStripPostcodes () {
-    return ($('meta[name="govuk:static-analytics:strip-postcodes"]').length > 0)
+    var metas = document.querySelectorAll('meta[name="govuk:static-analytics:strip-postcodes"]')
+    return metas.length > 0
   }
 
   function queryStringParametersToStrip () {
-    var value = $('meta[name="govuk:static-analytics:strip-query-string-parameters"]').attr('content')
+    var meta = document.querySelector('meta[name="govuk:static-analytics:strip-query-string-parameters"]')
+    var value = false
+    if (meta) {
+      value = meta.getAttribute('content')
+    }
     var parameters = []
 
     if (value) {

data/app/assets/javascripts/govuk_publishing_components/analytics/track-click.js

@@ -4,10 +4,11 @@ window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {};
 
 (function (Modules) {
-  function GemTrackClick () { }
+  function GemTrackClick ($module) {
+    this.$module = $module
+  }
 
-  GemTrackClick.prototype.start = function ($module) {
-    this.$module = $module[0]
+  GemTrackClick.prototype.init = function () {
     this.$module.handleClick = this.handleClick.bind(this)
     var trackLinksOnly = this.$module.hasAttribute('data-track-links-only')
     var limitToElementClass = this.$module.getAttribute('data-limit-to-element-class')

data/app/assets/javascripts/govuk_publishing_components/analytics/track-select-change.js

@@ -2,10 +2,11 @@ window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {};
 
 (function (Modules) {
-  function TrackSelectChange () { }
+  function TrackSelectChange ($module) {
+    this.$module = $module
+  }
 
-  TrackSelectChange.prototype.start = function ($module) {
-    this.$module = $module[0]
+  TrackSelectChange.prototype.init = function ($module) {
     this.$module.trackChange = this.trackChange.bind(this)
     this.$module.fireTrackingChange = this.fireTrackingChange.bind(this)
     this.$module.addEventListener('change', this.trackChange)

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

@@ -1,32 +1,18 @@
 /* global nodeListForEach */
-//  = require ../vendor/polyfills/closest.js
-//  = require ../vendor/polyfills/indexOf.js
 //  = require ../vendor/polyfills/common.js
-
+// This component relies on JavaScript from GOV.UK Frontend
+// = require govuk/components/accordion/accordion.js
 window.GOVUK = window.GOVUK || {}
-window.GOVUK.Modules = window.GOVUK.Modules || {};
+window.GOVUK.Modules = window.GOVUK.Modules || {}
+window.GOVUK.Modules.GovukAccordion = window.GOVUKFrontend.Accordion;
 
 (function (Modules) {
   function GemAccordion ($module) {
     this.$module = $module
-    this.sectionClass = 'gem-c-accordion__section'
-    this.moduleId = this.$module.getAttribute('id')
-    this.sections = this.$module.querySelectorAll('.' + this.sectionClass)
-    this.openAllButton = ''
-    this.controlsClass = 'gem-c-accordion__controls'
-    this.openAllClass = 'gem-c-accordion__open-all'
-    this.openAllTextClass = 'gem-c-accordion__open-all-text'
-    this.sectionHeaderClass = 'gem-c-accordion__section-header'
-    this.sectionHeadingClass = 'gem-c-accordion__section-heading'
-    this.sectionSummaryClass = 'gem-c-accordion__section-summary'
-    this.sectionButtonClass = 'gem-c-accordion__section-button'
-    this.sectionExpandedClass = 'gem-c-accordion__section--expanded'
-    this.sectionInnerContent = 'gem-c-accordion__section-content'
-    this.toggleLinkClass = 'js-toggle-link'
-    this.sectionShowHideIconClass = 'gem-c-accordion__toggle-link'
-    this.sectionShowHideTextClass = 'gem-c-accordion__toggle-text'
-    this.upChevonIconClass = 'gem-c-accordion-nav__chevron'
-    this.downChevonIconClass = 'gem-c-accordion-nav__chevron--down'
+    this.sectionClass = 'govuk-accordion__section'
+    this.sectionClassExpanded = 'govuk-accordion__section--expanded'
+    this.sectionHeaderClass = 'govuk-accordion__section-header'
+    this.sectionInnerContent = 'govuk-accordion__section-content'
 
     // Translated component content and language attribute pulled from data attributes
     this.$module.actions = {}
@@ -39,279 +25,14 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   }
 
   GemAccordion.prototype.init = function () {
-    this.browserSupportsSessionStorage = helper.checkForSessionStorage()
-
     // Indicate that JavaScript has worked
     this.$module.classList.add('gem-c-accordion--active')
 
-    this.initControls()
-    this.initSectionHeaders()
-
     // Feature flag for anchor tag navigation used on manuals
     if (this.$module.getAttribute('data-anchor-navigation') === 'true') {
       this.openByAnchorOnLoad()
       this.addEventListenersForAnchors()
     }
-
-    // See if "Show all sections" button text should be updated
-    var areAllSectionsOpen = this.checkIfAllSectionsOpen()
-    this.updateOpenAllButton(areAllSectionsOpen)
-  }
-
-  // Initialise controls and set attributes
-  GemAccordion.prototype.initControls = function () {
-    // Create "Show all" button and set attributes
-    this.openAllButton = document.createElement('button')
-    this.openAllButton.setAttribute('class', this.openAllClass)
-    this.openAllButton.setAttribute('aria-expanded', 'false')
-
-    // Create icon, add to element
-    var icon = document.createElement('span')
-    icon.classList.add(this.upChevonIconClass)
-    this.openAllButton.appendChild(icon)
-
-    // Create control wrapper and add controls to it
-    var accordionControls = document.createElement('div')
-    accordionControls.setAttribute('class', this.controlsClass)
-    accordionControls.appendChild(this.openAllButton)
-    this.$module.insertBefore(accordionControls, this.$module.firstChild)
-
-    // Build additional wrapper for open all toggle text, place icon after wrapped text.
-    var wrapperOpenAllText = document.createElement('span')
-    wrapperOpenAllText.classList.add(this.openAllTextClass)
-    this.openAllButton.insertBefore(wrapperOpenAllText, this.openAllButton.childNodes[0] || null)
-
-    // Handle events for the controls
-    this.openAllButton.addEventListener('click', this.onOpenOrCloseAllToggle.bind(this))
-  }
-
-  // Initialise section headers
-  GemAccordion.prototype.initSectionHeaders = function () {
-    // Loop through section headers
-    nodeListForEach(this.sections, function (section, i) {
-      // Set header attributes
-      var header = section.querySelector('.' + this.sectionHeaderClass)
-
-      this.initHeaderAttributes(header, i)
-      this.setExpanded(this.isExpanded(section), section)
-
-      // Handle events
-      header.addEventListener('click', this.onSectionToggle.bind(this, section))
-
-      // See if there is any state stored in sessionStorage and set the sections to
-      // open or closed.
-      this.setInitialState(section)
-    }.bind(this))
-  }
-
-  // Set individual header attributes
-  GemAccordion.prototype.initHeaderAttributes = function (headerWrapper, index) {
-    var span = headerWrapper.querySelector('.' + this.sectionButtonClass)
-    var heading = headerWrapper.querySelector('.' + this.sectionHeadingClass)
-    var summary = headerWrapper.querySelector('.' + this.sectionSummaryClass)
-
-    // Copy existing span element to an actual button element, for improved accessibility.
-    var button = document.createElement('button')
-    button.setAttribute('id', this.moduleId + '-heading-' + (index + 1))
-    button.setAttribute('aria-controls', this.moduleId + '-content-' + (index + 1))
-
-    // Create show / hide arrow icons with text.
-    var showIcons = document.createElement('span')
-    showIcons.classList.add(this.sectionShowHideIconClass, this.toggleLinkClass)
-
-    // Add pause after heading for assistive technology.
-    var srPause = document.createElement('span')
-    srPause.classList.add('govuk-visually-hidden')
-    srPause.innerHTML = ', '
-
-    // Build additional copy for assistive technology
-    var srAdditionalCopy = document.createElement('span')
-    srAdditionalCopy.classList.add('govuk-visually-hidden')
-    srAdditionalCopy.innerHTML = this.$module.actions.thisSectionVisuallyHidden
-
-    if (this.$module.actions.locale) {
-      srAdditionalCopy.lang = this.filterLocale('this_section_visually_hidden')
-    }
-
-    // Build additional wrapper for toggle text, place icon after wrapped text.
-    var wrapperShowHideIcon = document.createElement('span')
-    var icon = document.createElement('span')
-    icon.classList.add(this.upChevonIconClass)
-    showIcons.appendChild(icon)
-    wrapperShowHideIcon.classList.add(this.sectionShowHideTextClass)
-    showIcons.insertBefore(wrapperShowHideIcon, showIcons.childNodes[0] || null)
-
-    // Copy all attributes (https://developer.mozilla.org/en-US/docs/Web/API/Element/attributes) from span to button
-    for (var i = 0; i < span.attributes.length; i++) {
-      var attr = span.attributes.item(i)
-      button.setAttribute(attr.nodeName, attr.nodeValue)
-    }
-
-    // span could contain HTML elements (see https://www.w3.org/TR/2011/WD-html5-20110525/content-models.html#phrasing-content)
-    button.innerHTML = span.innerHTML
-    heading.removeChild(span)
-    heading.appendChild(button)
-    button.appendChild(srPause)
-
-    // If summary content exists add to DOM in correct order
-    if (typeof (summary) !== 'undefined' && summary !== null) {
-      button.setAttribute('aria-describedby', this.moduleId + '-summary-' + (index + 1))
-      button.appendChild(summary)
-    }
-
-    button.appendChild(showIcons)
-    button.appendChild(srAdditionalCopy)
-  }
-
-  // When section toggled, set and store state
-  GemAccordion.prototype.onSectionToggle = function (section) {
-    var expanded = this.isExpanded(section)
-    this.setExpanded(!expanded, section)
-
-    // Store the state in sessionStorage when a change is triggered
-    this.storeState(section)
-  }
-
-  // When Open/Close All toggled, set and store state
-  GemAccordion.prototype.onOpenOrCloseAllToggle = function () {
-    var module = this
-    var sections = this.sections
-    var nowExpanded = !this.checkIfAllSectionsOpen()
-
-    nodeListForEach(sections, function (section) {
-      module.setExpanded(nowExpanded, section)
-      // Store the state in sessionStorage when a change is triggered
-      module.storeState(section)
-    })
-
-    module.updateOpenAllButton(nowExpanded)
-  }
-
-  // Set section attributes when opened/closed
-  GemAccordion.prototype.setExpanded = function (expanded, section) {
-    var icon = section.querySelector('.' + this.upChevonIconClass)
-    var showHideText = section.querySelector('.' + this.sectionShowHideTextClass)
-    var button = section.querySelector('.' + this.sectionButtonClass)
-    var newButtonText = expanded ? this.$module.actions.hideText : this.$module.actions.showText
-
-    showHideText.innerHTML = newButtonText
-    button.setAttribute('aria-expanded', expanded)
-    button.classList.add(this.toggleLinkClass)
-
-    if (this.$module.actions.locale) {
-      showHideText.lang = this.filterLocale(expanded ? 'hide_text' : 'show_text')
-    }
-
-    // Swap icon, change class
-    if (expanded) {
-      section.classList.add(this.sectionExpandedClass)
-      icon.classList.remove(this.downChevonIconClass)
-    } else {
-      section.classList.remove(this.sectionExpandedClass)
-      icon.classList.add(this.downChevonIconClass)
-    }
-
-    // See if "Show all sections" button text should be updated
-    var areAllSectionsOpen = this.checkIfAllSectionsOpen()
-    this.updateOpenAllButton(areAllSectionsOpen)
-  }
-
-  // Get state of section
-  GemAccordion.prototype.isExpanded = function (section) {
-    return section.classList.contains(this.sectionExpandedClass)
-  }
-
-  // Check if all sections are open
-  GemAccordion.prototype.checkIfAllSectionsOpen = function () {
-    // Get a count of all the Accordion sections
-    var sectionsCount = this.sections.length
-    // Get a count of all Accordion sections that are expanded
-    var expandedSectionCount = this.$module.querySelectorAll('.' + this.sectionExpandedClass).length
-    var areAllSectionsOpen = sectionsCount === expandedSectionCount
-
-    return areAllSectionsOpen
-  }
-
-  // Update "Show all sections" button
-  GemAccordion.prototype.updateOpenAllButton = function (expanded) {
-    var icon = this.openAllButton.querySelector('.' + this.upChevonIconClass)
-    var openAllCopy = this.openAllButton.querySelector('.' + this.openAllTextClass)
-    var newButtonText = expanded ? this.$module.actions.hideAllText : this.$module.actions.showAllText
-
-    this.openAllButton.setAttribute('aria-expanded', expanded)
-    openAllCopy.innerHTML = newButtonText
-
-    if (this.$module.actions.locale) {
-      openAllCopy.lang = this.filterLocale(expanded ? 'hide_all_text' : 'show_all_text')
-    }
-
-    // Swap icon, toggle class
-    if (expanded) {
-      icon.classList.remove(this.downChevonIconClass)
-    } else {
-      icon.classList.add(this.downChevonIconClass)
-    }
-  }
-
-  var helper = {
-    checkForSessionStorage: function () {
-      var testString = 'this is the test string'
-      var result
-      try {
-        window.sessionStorage.setItem(testString, testString)
-        result = window.sessionStorage.getItem(testString) === testString.toString()
-        window.sessionStorage.removeItem(testString)
-        return result
-      } catch (exception) {
-        if ((typeof console === 'undefined' || typeof console.log === 'undefined')) {
-          console.log('Notice: sessionStorage not available.')
-        }
-      }
-    }
-  }
-
-  // Set the state of the accordions in sessionStorage
-  GemAccordion.prototype.storeState = function (section) {
-    if (this.browserSupportsSessionStorage) {
-      // We need a unique way of identifying each content in the GemAccordion. Since
-      // an `#id` should be unique and an `id` is required for `aria-` attributes
-      // `id` can be safely used.
-      var button = section.querySelector('.' + this.sectionButtonClass)
-
-      if (button) {
-        var contentId = button.getAttribute('aria-controls')
-        var contentState = button.getAttribute('aria-expanded')
-
-        if (typeof contentId === 'undefined' && (typeof console === 'undefined' || typeof console.log === 'undefined')) {
-          console.error(new Error('No aria controls present in accordion section heading.'))
-        }
-
-        if (typeof contentState === 'undefined' && (typeof console === 'undefined' || typeof console.log === 'undefined')) {
-          console.error(new Error('No aria expanded present in accordion section heading.'))
-        }
-
-        // Only set the state when both `contentId` and `contentState` are taken from the DOM.
-        if (contentId && contentState) {
-          window.sessionStorage.setItem(contentId, contentState)
-        }
-      }
-    }
-  }
-
-  // Read the state of the accordions from sessionStorage
-  GemAccordion.prototype.setInitialState = function (section) {
-    if (this.browserSupportsSessionStorage) {
-      var button = section.querySelector('.' + this.sectionButtonClass)
-
-      if (button) {
-        var contentId = button.getAttribute('aria-controls')
-        var contentState = contentId ? window.sessionStorage.getItem(contentId) : null
-
-        if (contentState !== null) {
-          this.setExpanded(contentState === 'true', section)
-        }
-      }
-    }
   }
 
   // Navigate to and open accordions with anchored content on page load if a hash is present
@@ -327,6 +48,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   // Adding an event listener to all anchor link a tags in an accordion is risky but we circumvent this risk partially by only being a layer of accordion behaviour instead of any sort of change to link behaviour
   GemAccordion.prototype.addEventListenersForAnchors = function () {
     var links = this.$module.querySelectorAll('.' + this.sectionInnerContent + ' a[href*="#"]')
+
     nodeListForEach(links, function (link) {
       if (link.pathname === window.location.pathname) {
         link.addEventListener('click', this.openForAnchor.bind(this, link.hash.split('#')[1]))
@@ -337,9 +59,18 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
   // Find the parent accordion section for the given id and open it
   GemAccordion.prototype.openForAnchor = function (hash) {
     var target = document.getElementById(hash)
-    var section = this.getContainingSection(target)
-
-    this.setExpanded(true, section)
+    var $section = this.getContainingSection(target)
+    var $header = $section.querySelector('.' + this.sectionHeaderClass)
+    var $expanded = this.getContainingSection($section)
+    var $parent = $header.parentElement
+
+    // manuals-frontend features:
+    // Should the target anchor link be within the same page, open section - navigate normally
+    // Should the target anchor link be within a different, closed section, open this section
+    // Should the target anchor link be within a different page and different, closed section open this section
+    if ($expanded && (!$parent.classList.contains(this.sectionClassExpanded))) {
+      $header.click()
+    }
   }
 
   // Loop through the given id's ancestors until the parent section class is found
@@ -347,7 +78,6 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
     while (!target.classList.contains(this.sectionClass)) {
       target = target.parentElement
     }
-
     return target
   }
 

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

@@ -2,4 +2,4 @@
 // = require govuk/components/button/button.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukButton = window.GOVUKFrontend
+window.GOVUK.Modules.GovukButton = window.GOVUKFrontend.Button

data/app/assets/javascripts/govuk_publishing_components/components/character-count.js

@@ -2,4 +2,4 @@
 // = require govuk/components/character-count/character-count.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukCharacterCount = window.GOVUKFrontend
+window.GOVUK.Modules.GovukCharacterCount = window.GOVUKFrontend.CharacterCount

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

@@ -1,9 +1,8 @@
-/* eslint-env jquery */
 // = require govuk/vendor/polyfills/Element/prototype/closest.js
 // = require govuk/components/checkboxes/checkboxes.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukCheckboxes = window.GOVUKFrontend;
+window.GOVUK.Modules.GovukCheckboxes = window.GOVUKFrontend.Checkboxes;
 
 (function (Modules) {
   function GemCheckboxes ($module) {

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

@@ -1,8 +1,7 @@
-/* eslint-env jquery */
 // = require govuk/components/details/details.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend;
+window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend.Details;
 
 (function (Modules) {
   function GemDetails ($module) {
@@ -15,8 +14,8 @@ window.GOVUK.Modules.GovukDetails = window.GOVUKFrontend;
 
   GemDetails.prototype.init = function () {
     if (this.customTrackLabel) { // If a custom label has been provided, we can simply call the tracking module
-      var trackDetails = new window.GOVUK.Modules.GemTrackClick()
-      trackDetails.start($(this.$summary))
+      var trackDetails = new window.GOVUK.Modules.GemTrackClick(this.$summary)
+      trackDetails.init()
     } else if (this.detailsClick) { // If no custom label is set, we use the open/close status as the label
       this.detailsClick.addEventListener('click', function (event) {
         this.trackDefault(this.$summary)

data/app/assets/javascripts/govuk_publishing_components/components/error-summary.js

@@ -2,4 +2,4 @@
 // = require govuk/components/error-summary/error-summary.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukErrorSummary = window.GOVUKFrontend
+window.GOVUK.Modules.GovukErrorSummary = window.GOVUKFrontend.ErrorSummary

data/app/assets/javascripts/govuk_publishing_components/components/layout-header.js

@@ -2,4 +2,4 @@
 // = require govuk/components/header/header.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukHeader = window.GOVUKFrontend
+window.GOVUK.Modules.GovukHeader = window.GOVUKFrontend.Header

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

@@ -2,4 +2,4 @@
 // = require govuk/components/radios/radios.js
 window.GOVUK = window.GOVUK || {}
 window.GOVUK.Modules = window.GOVUK.Modules || {}
-window.GOVUK.Modules.GovukRadios = window.GOVUKFrontend
+window.GOVUK.Modules.GovukRadios = window.GOVUKFrontend.Radios

data/app/assets/javascripts/govuk_publishing_components/components/skip-link.js

@@ -0,0 +1,5 @@
+// This component relies on JavaScript from GOV.UK Frontend
+// = require govuk/components/skip-link/skip-link.js
+window.GOVUK = window.GOVUK || {}
+window.GOVUK.Modules = window.GOVUK.Modules || {}
+window.GOVUK.Modules.GovukSkipLink = window.GOVUKFrontend.SkipLink