From fbc69f10eb708144928c602dcc95a68a32175655 Mon Sep 17 00:00:00 2001
From: Daniel Ruf <daniel@daniel-ruf.de>
Date: Tue, 13 Mar 2018 21:54:41 +0100
Subject: [PATCH] fix: add aria-expanded to the toggler triggers

---
 js/foundation.toggler.js              |  7 ++++---
 test/javascript/components/toggler.js | 18 ++++++++++++++++--
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/js/foundation.toggler.js b/js/foundation.toggler.js
index d8c5744ec..65effcbbe 100644
--- a/js/foundation.toggler.js
+++ b/js/foundation.toggler.js
@@ -58,9 +58,10 @@ class Toggler extends Plugin {
     // Add ARIA attributes to triggers
     var id = this.$element[0].id;
     $(`[data-open="${id}"], [data-close="${id}"], [data-toggle="${id}"]`)
-      .attr('aria-controls', id);
-    // If the target is hidden, add aria-hidden
-    this.$element.attr('aria-expanded', this.$element.is(':hidden') ? false : true);
+      .attr({
+        'aria-controls': id,
+        'aria-expanded': this.$element.is(':hidden') ? false : true
+      });
   }
 
   /**
diff --git a/test/javascript/components/toggler.js b/test/javascript/components/toggler.js
index e55817b37..322bf9e3e 100644
--- a/test/javascript/components/toggler.js
+++ b/test/javascript/components/toggler.js
@@ -58,17 +58,31 @@ describe('Toggler', function() {
 
     it('sets aria-expanded to true if the element is visible', function() {
       $html = $('<div id="toggler" data-toggler="class"></div>').appendTo('body');
+      var $triggers = $(`<div>
+          <a data-open="toggler">Open</a>
+          <a data-close="toggler">Close</a>
+          <a data-toggle="toggler">Toggle</a>
+        </div>`).appendTo('body');
       plugin = new Foundation.Toggler($html, {});
 
-      $('#toggler').should.have.attr('aria-expanded', 'true');
+      $triggers.find('[data-open]').should.have.attr('aria-expanded', 'true');
+      $triggers.find('[data-close]').should.have.attr('aria-expanded', 'true');
+      $triggers.find('[data-open]').should.have.attr('aria-expanded', 'true');
     });
 
     it('sets aria-expanded to false if the element is invisible', function() {
       var $css = $('<style>#toggler { display: none }</style>').appendTo('body');
       $html = $('<div id="toggler" data-toggler="class"></div>').appendTo('body');
+      var $triggers = $(`<div>
+          <a data-open="toggler">Open</a>
+          <a data-close="toggler">Close</a>
+          <a data-toggle="toggler">Toggle</a>
+        </div>`).appendTo('body');
       plugin = new Foundation.Toggler($html, {});
 
-      $('#toggler').should.have.attr('aria-expanded', 'false');
+      $triggers.find('[data-open]').should.have.attr('aria-expanded', 'false');
+      $triggers.find('[data-close]').should.have.attr('aria-expanded', 'false');
+      $triggers.find('[data-open]').should.have.attr('aria-expanded', 'false');
       $css.remove();
     });
   });
-- 
2.47.2