Set aria-expanded on trigger, not target.

alphagov · Jun 25, 2021 · b35334d · b35334d
1 parent 30471a9
commit b35334d
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/lib/assets/javascripts/_modules/collapsible-navigation.js b/lib/assets/javascripts/_modules/collapsible-navigation.js
@@ -34,10 +34,9 @@
           arrayOfIds.push(uniqueId)
           $(this).addClass('collapsible__body')
             .attr('id', uniqueId)
-            .attr('aria-expanded', 'false')
         })
         $heading.addClass('collapsible__heading')
-          .after('<button class="collapsible__toggle" aria-controls="' + arrayOfIds.join(' ') + '"><span class="collapsible__toggle-label">Expand ' + $heading.text() + '</span><span class="collapsible__toggle-icon" aria-hidden="true"></button>')
+          .after('<button class="collapsible__toggle" aria-expanded="false" aria-controls="' + arrayOfIds.join(' ') + '"><span class="collapsible__toggle-label">Expand ' + $heading.text() + '</span><span class="collapsible__toggle-icon" aria-hidden="true"></button>')
         $topLevelItem.on('click', '.collapsible__toggle', function (e) {
           e.preventDefault()
           var $parent = $(this).parent()
@@ -49,11 +48,11 @@
     function toggleHeading ($topLevelItem) {
       var isOpen = $topLevelItem.hasClass('is-open')
       var $heading = $topLevelItem.find('> a')
-      var $body = $topLevelItem.find('.collapsible__body')
+      var $toggle = $topLevelItem.find('.collapsible__toggle')
       var $toggleLabel = $topLevelItem.find('.collapsible__toggle-label')
 
       $topLevelItem.toggleClass('is-open', !isOpen)
-      $body.attr('aria-expanded', isOpen ? 'false' : 'true')
+      $toggle.attr('aria-expanded', isOpen ? 'false' : 'true')
       $toggleLabel.text(isOpen ? 'Expand ' + $heading.text() : 'Collapse ' + $heading.text())
     }
 

diff --git a/lib/govuk_tech_docs/table_of_contents/helpers.rb b/lib/govuk_tech_docs/table_of_contents/helpers.rb
@@ -32,7 +32,7 @@ def render_page_tree(resources, current_page, config, current_page_html)
         # Sort by weight frontmatter
         resources = resources
         .sort_by { |r| [r.data.weight ? 0 : 1, r.data.weight || 0] }
-        
+
         output = "<ul>"
         resources.each do |resource|
           # Skip from page tree if hide_in_navigation:true frontmatter