Skip to content

Commit 9ddfc0f

Browse files
authored
feat: Make explicit check consider shadow DOM (#442)
1 parent ebe1858 commit 9ddfc0f

File tree

1 file changed

+44
-0
lines changed

1 file changed

+44
-0
lines changed

test/checks/label/explicit.js

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ describe('explicit-label', function () {
33

44
var fixture = document.getElementById('fixture');
55
var fixtureSetup = axe.testUtils.fixtureSetup;
6+
var shadowSupport = axe.testUtils.shadowSupport;
67

78
afterEach(function () {
89
fixture.innerHTML = '';
@@ -34,4 +35,47 @@ describe('explicit-label', function () {
3435
assert.isFalse(checks['explicit-label'].evaluate(node));
3536
});
3637

38+
(shadowSupport.v1 ? it : xit)('should return true if input and label are in the same shadow root', function () {
39+
var root = document.createElement('div');
40+
var shadow = root.attachShadow({ mode: 'open' });
41+
shadow.innerHTML = '<label for="target">American band</label><input id="target">';
42+
fixtureSetup(root);
43+
44+
var node = shadow.querySelector('#target');
45+
assert.isTrue(checks['explicit-label'].evaluate(node));
46+
});
47+
48+
(shadowSupport.v1 ? it : xit)('should return true if label content is slotted', function () {
49+
var root = document.createElement('div');
50+
root.innerHTML = 'American band';
51+
var shadow = root.attachShadow({ mode: 'open' });
52+
shadow.innerHTML = '<label for="target"><slot></slot></label><input id="target">';
53+
fixtureSetup(root);
54+
55+
var node = shadow.querySelector('#target');
56+
assert.isTrue(checks['explicit-label'].evaluate(node));
57+
});
58+
59+
(shadowSupport.v1 ? it : xit)('should return false if input is inside shadow DOM and the label is not', function () {
60+
var root = document.createElement('div');
61+
root.innerHTML = '<label for="target">American band</label>';
62+
var shadow = root.attachShadow({ mode: 'open' });
63+
shadow.innerHTML = '<slot></slot><input id="target">';
64+
fixtureSetup(root);
65+
66+
var node = shadow.querySelector('#target');
67+
assert.isFalse(checks['explicit-label'].evaluate(node));
68+
});
69+
70+
(shadowSupport.v1 ? it : xit)('should return false if label is inside shadow DOM and the input is not', function () {
71+
var root = document.createElement('div');
72+
root.innerHTML = '<input id="target">';
73+
var shadow = root.attachShadow({ mode: 'open' });
74+
shadow.innerHTML = '<label for="target">American band</label><slot></slot>';
75+
fixtureSetup(root);
76+
77+
var node = root.querySelector('#target');
78+
assert.isFalse(checks['explicit-label'].evaluate(node));
79+
});
80+
3781
});

0 commit comments

Comments
 (0)