match latest landmark-unique-matches

dequelabs · Jun 13, 2024 · 13eed12 · 13eed12
1 parent daf2677
commit 13eed12
Showing 1 changed file with 109 additions and 7 deletions.
diff --git a/test/rule-matches/landmark-unique-matches.js b/test/rule-matches/landmark-unique-matches.js
@@ -4,13 +4,9 @@ describe('landmark-unique-matches', function () {
   let fixture;
   let axeFixtureSetup;
   const shadowSupport = axe.testUtils.shadowSupport.v1;
-  const excludedDescendantsForHeadersFooters = [
-    'article',
-    'aside',
-    'main',
-    'nav',
-    'section'
-  ];
+  const sectioningContentElements = ['article', 'aside', 'nav', 'section'];
+  const excludedDescendantsForHeadersFooters =
+    sectioningContentElements.concat('main');
   const headerFooterElements = ['header', 'footer'];
 
   beforeEach(function () {
@@ -128,6 +124,51 @@ describe('landmark-unique-matches', function () {
     });
   });
 
+  describe('aside should not match when scoped to a sectioning content element unless it has an accessible name', function () {
+    sectioningContentElements.forEach(function (exclusionType) {
+      it(
+        'should not match because aside is scoped to ' +
+          exclusionType +
+          ' and has no label',
+        function () {
+          axeFixtureSetup(
+            '<' +
+              exclusionType +
+              '><aside data-test>an element</aside></' +
+              exclusionType +
+              '>'
+          );
+          const node = fixture.querySelector('aside[data-test]');
+          const virtualNode = axe.utils.getNodeFromTree(axe._tree[0], node);
+          assert.isFalse(rule.matches(node, virtualNode));
+        }
+      );
+
+      it(
+        'should match because aside within ' + exclusionType + ' has a label',
+        function () {
+          axeFixtureSetup(
+            '<' +
+              exclusionType +
+              '><aside aria-label="sample label" data-test>an element</aside></' +
+              exclusionType +
+              '>'
+          );
+          const node = fixture.querySelector('aside[data-test]');
+          const virtualNode = axe.utils.getNodeFromTree(axe._tree[0], node);
+          assert.isTrue(rule.matches(node, virtualNode));
+        }
+      );
+    });
+
+    it('should match because aside is not scoped to a sectioning content element', function () {
+      axeFixtureSetup('<aside>an element</aside>');
+      const node = fixture.querySelector('aside');
+      const virtualNode = axe.utils.getNodeFromTree(axe._tree[0], node);
+      assert.isTrue(rule.matches(node, virtualNode));
+    });
+  });
+
   if (shadowSupport) {
     it('return true for landmarks contained within shadow dom', function () {
       const container = document.createElement('div');
@@ -195,5 +236,66 @@ describe('landmark-unique-matches', function () {
         );
       });
     });
+
+    describe('aside should match inside shadow dom unless it is both within sectioning content and has no accessible name', function () {
+      let container;
+      let shadow;
+
+      beforeEach(function () {
+        container = document.createElement('div');
+        shadow = container.attachShadow({ mode: 'open' });
+      });
+
+      sectioningContentElements.forEach(function (exclusionType) {
+        it(
+          'should not match because aside is scoped to ' +
+            exclusionType +
+            ' and has no label',
+          function () {
+            shadow.innerHTML =
+              '<' +
+              exclusionType +
+              ' aria-label="sample label"><aside data-test>an element</aside></' +
+              exclusionType +
+              '>';
+
+            axeFixtureSetup(container);
+            const virtualNode = axe.utils.querySelectorAll(
+              axe._tree[0],
+              'aside[data-test]'
+            )[0];
+            assert.isFalse(rule.matches(virtualNode.actualNode, virtualNode));
+          }
+        );
+
+        it(
+          'should match because aside within ' + exclusionType + ' has a label',
+          function () {
+            shadow.innerHTML =
+              '<' +
+              exclusionType +
+              '><aside aria-label="sample label" data-test>an element</aside></' +
+              exclusionType +
+              '>';
+            axeFixtureSetup(container);
+            const virtualNode = axe.utils.querySelectorAll(
+              axe._tree[0],
+              'aside[data-test]'
+            )[0];
+            assert.isTrue(rule.matches(virtualNode.actualNode, virtualNode));
+          }
+        );
+      });
+
+      it('should match because aside is not scoped to a sectioning content element', function () {
+        shadow.innerHTML = '<aside>an element</aside>';
+        axeFixtureSetup(container);
+        const virtualNode = axe.utils.querySelectorAll(
+          axe._tree[0],
+          'aside'
+        )[0];
+        assert.isTrue(rule.matches(virtualNode.actualNode, virtualNode));
+      });
+    });
   }
 });