From b9a324a4b447ff0a9d8f07d663ca771f3d0f4619 Mon Sep 17 00:00:00 2001
From: Paul Grenier <pgrenier@gmail.com>
Date: Fri, 24 May 2019 11:08:17 -0400
Subject: [PATCH] fix(multiple-label): considers explicit labels in the same
 shadow tree (#1584)

---
 lib/checks/label/multiple-label.js  |  4 +-
 test/checks/label/multiple-label.js | 60 ++++++++++++++++++++++++++++-
 2 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/lib/checks/label/multiple-label.js b/lib/checks/label/multiple-label.js
index b8c156cf79..918a23106b 100644
--- a/lib/checks/label/multiple-label.js
+++ b/lib/checks/label/multiple-label.js
@@ -1,6 +1,8 @@
 const id = axe.utils.escapeSelector(node.getAttribute('id'));
-let labels = Array.from(document.querySelectorAll(`label[for="${id}"]`));
 let parent = node.parentNode;
+let root = axe.commons.dom.getRootNode(node);
+root = root.documentElement || root;
+let labels = Array.from(root.querySelectorAll(`label[for="${id}"]`));
 
 if (labels.length) {
 	// filter out CSS hidden labels because they're fine
diff --git a/test/checks/label/multiple-label.js b/test/checks/label/multiple-label.js
index 98bc10330f..1b90b60258 100644
--- a/test/checks/label/multiple-label.js
+++ b/test/checks/label/multiple-label.js
@@ -2,7 +2,7 @@ describe('multiple-label', function() {
 	'use strict';
 
 	var fixture = document.getElementById('fixture');
-
+	var shadowSupported = axe.testUtils.shadowSupport.v1;
 	var checkContext = axe.testUtils.MockCheckContext();
 
 	afterEach(function() {
@@ -176,4 +176,62 @@ describe('multiple-label', function() {
 		var target = fixture.querySelector('#Q');
 		assert.isTrue(checks['multiple-label'].evaluate.call(checkContext, target));
 	});
+
+	(shadowSupported ? it : xit)(
+		'should consider labels in the same document/shadow tree',
+		function() {
+			fixture.innerHTML = '<div id="target"></div>';
+			var target = document.querySelector('#target');
+			var shadowRoot = target.attachShadow({ mode: 'open' });
+			shadowRoot.innerHTML =
+				'<input id="myinput" /><label for="myinput">normal</label>';
+			var shadowTarget = target.shadowRoot;
+			assert.isFalse(
+				checks['multiple-label'].evaluate.call(
+					checkContext,
+					shadowTarget.firstElementChild
+				)
+			);
+		}
+	);
+
+	(shadowSupported ? it : xit)(
+		'should return false for valid multiple labels in the same document/shadow tree',
+		function() {
+			fixture.innerHTML = '<div id="target"></div>';
+			var target = document.querySelector('#target');
+			var shadowRoot = target.attachShadow({ mode: 'open' });
+			var innerHTML = '<input type="checkbox" id="D" aria-labelledby="E"/>';
+			innerHTML += '<label for="D" aria-hidden="true">Please</label>';
+			innerHTML += '<label for="D" id="E">Excuse</label>';
+			shadowRoot.innerHTML = innerHTML;
+			var shadowTarget = target.shadowRoot;
+			assert.isFalse(
+				checks['multiple-label'].evaluate.call(
+					checkContext,
+					shadowTarget.firstElementChild
+				)
+			);
+		}
+	);
+
+	(shadowSupported ? it : xit)(
+		'should return true for invalid multiple labels in the same document/shadow tree',
+		function() {
+			fixture.innerHTML = '<div id="target"></div>';
+			var target = document.querySelector('#target');
+			var shadowRoot = target.attachShadow({ mode: 'open' });
+			var innerHTML = '<input type="checkbox" id="Q"/>';
+			innerHTML += '<label for="Q" aria-hidden="true"></label>';
+			innerHTML += '<label for="Q" >Excuse</label>';
+			shadowRoot.innerHTML = innerHTML;
+			var shadowTarget = target.shadowRoot;
+			assert.isTrue(
+				checks['multiple-label'].evaluate.call(
+					checkContext,
+					shadowTarget.firstElementChild
+				)
+			);
+		}
+	);
 });