Skip to content

Commit

Permalink
fix: Pass all tests that use accessibleText
Browse files Browse the repository at this point in the history
  • Loading branch information
@WilcoFiers
WilcoFiers committed Jul 11, 2017
1 parent e6f031a commit 2b3b8b5
Show file tree
Hide file tree
Showing 11 changed files with 120 additions and 99 deletions.
27 changes: 16 additions & 11 deletions lib/commons/text/accessible-text.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,14 @@ var phrasingElements = ['A', 'EM', 'STRONG', 'SMALL', 'MARK', 'ABBR', 'DFN', 'I'
* @return {HTMLElement} The label element, or null if none is found
*/
function findLabel({ actualNode }) {
let label;
const id = axe.utils.escapeSelector(actualNode.id);
const ref = id && document.querySelector('label[for="' + id + '"]');

return ref || dom.findUp(actualNode, 'label');
if (id) {
label = document.querySelector('label[for="' + id + '"]');
} else {
label = dom.findUp(actualNode, 'label');
}
return axe.utils.getNodeFromTree(axe._tree[0], label);
}

function isButton({ actualNode }) {
Expand Down Expand Up @@ -135,6 +139,9 @@ function nonEmptyText(t) {
text.accessibleText = function(element, inLabelledByContext) {
let accessibleNameComputation;
const encounteredNodes = [];
if (element instanceof Node) {
element = axe.utils.getNodeFromTree(axe._tree[0], element);
}

function getInnerText (element, inLabelledByContext, inControlContext) {
return element.children.reduce((returnText, child) => {
Expand Down Expand Up @@ -214,9 +221,8 @@ text.accessibleText = function(element, inLabelledByContext) {
encounteredNodes.pop();
} //let element be encountered twice

// TODO: Not sure if this works
var out = accessibleNameComputation(label, true, actualNode !== label);
return out;
const vLabel = axe.utils.getNodeFromTree(axe._tree[0], label);
return accessibleNameComputation(vLabel, true, actualNode !== label);
}).join(' '));
}

Expand All @@ -240,12 +246,11 @@ text.accessibleText = function(element, inLabelledByContext) {
accessibleNameComputation = function (element, inLabelledByContext, inControlContext) {
// TODO: Make sure I don't have to do this
let returnText;
if (element instanceof Node) {
element = axe.utils.getNodeFromTree(axe._tree[0], element);
}

if (element.actualNode instanceof Node !== true) {
throw new Error('Invalid argument. Virtual Node must be provided');
/* global console */
var e = new Error('Invalid argument. Virtual Node must be provided');
console.error(e);
throw e;
}

// If the node was already checked or is null, skip
Expand Down
74 changes: 36 additions & 38 deletions test/checks/forms/fieldset.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
describe('fieldset', function () {
'use strict';
var fixture = document.getElementById('fixture');

var fixtureSetup = axe.testUtils.fixtureSetup;
var checkContext = {
_data: null,
data: function (d) {
Expand All @@ -20,16 +20,16 @@ describe('fieldset', function () {
function tests(type) {

it('should return true if there is only one ' + type + ' element with the same name', function () {
fixture.innerHTML = '<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="differentname">';
fixtureSetup('<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="differentname">');

var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
});

it('should return false if there are two ungrouped ' + type + ' elements with the same name', function () {
fixture.innerHTML = '<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname">';
fixtureSetup('<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname">');

var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
Expand All @@ -43,8 +43,8 @@ describe('fieldset', function () {
});

it('should return false if the group has no legend element', function () {
fixture.innerHTML = '<fieldset><input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></fieldset>';
fixtureSetup('<fieldset><input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></fieldset>');
var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
assert.deepEqual(checkContext._data, {
Expand All @@ -57,9 +57,9 @@ describe('fieldset', function () {
});

it('should return false if the group has no legend text', function () {
fixture.innerHTML = '<fieldset><legend></legend>' +
fixtureSetup('<fieldset><legend></legend>' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></fieldset>';
'<input type="' + type + '" name="uniqueyname"></fieldset>');
var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
assert.deepEqual(checkContext._data, {
Expand All @@ -72,10 +72,10 @@ describe('fieldset', function () {
});

it('should return false if the group contains extra elements', function () {
fixture.innerHTML = '<fieldset><legend>Legendary</legend>' +
fixtureSetup('<fieldset><legend>Legendary</legend>' +
'<input type="text" id="random">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></fieldset>';
'<input type="' + type + '" name="uniqueyname"></fieldset>');
var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
assert.deepEqual(checkContext._data, {
Expand All @@ -88,17 +88,17 @@ describe('fieldset', function () {
});

it('should return true if the group contains only the right elements and has legend', function () {
fixture.innerHTML = '<fieldset><legend>Legendary</legend>' +
fixtureSetup('<fieldset><legend>Legendary</legend>' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></fieldset>';
'<input type="' + type + '" name="uniqueyname"></fieldset>');
var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
});

it('should return false if an unlabelled ARIA group contains only the right elements', function () {
fixture.innerHTML = '<div role="group">' +
fixtureSetup('<div role="group">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>';
'<input type="' + type + '" name="uniqueyname"></div>');

var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
Expand All @@ -112,10 +112,10 @@ describe('fieldset', function () {
});

it('should return false if an improperly labelled-by ARIA group contains only the right elements', function () {
fixture.innerHTML = '<div id="grouplabel"></div>' +
fixtureSetup('<div id="grouplabel"></div>' +
'<div role="group" aria-labelledby="grouplabel">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>';
'<input type="' + type + '" name="uniqueyname"></div>');

var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
Expand All @@ -129,10 +129,10 @@ describe('fieldset', function () {
});

it('should return false if the group contains extra elements', function () {
fixture.innerHTML = '<div role="group" aria-labelledby="g1"><div id="g1">Legendary</div>' +
fixtureSetup('<div role="group" aria-labelledby="g1"><div id="g1">Legendary</div>' +
'<input type="text" id="random">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>';
'<input type="' + type + '" name="uniqueyname"></div>');
var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));
assert.deepEqual(checkContext._data, {
Expand All @@ -145,10 +145,10 @@ describe('fieldset', function () {
});

it('should return true if a properly labelled-by ARIA group contains only the right elements', function () {
fixture.innerHTML = '<div id="grouplabel">Label</div>' +
fixtureSetup('<div id="grouplabel">Label</div>' +
'<div role="group" aria-labelledby="grouplabel">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>';
'<input type="' + type + '" name="uniqueyname"></div>');

var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
Expand All @@ -160,10 +160,10 @@ describe('fieldset', function () {


it('should return true if a properly labelled-by ARIA group contains only the right elements - special characters', function () {
fixture.innerHTML = '<div id="grouplabel">Label</div>' +
fixtureSetup('<div id="grouplabel">Label</div>' +
'<div role="group" aria-labelledby="grouplabel">' +
'<input type="' + type + '" id="target" name="s.%$#n">' +
'<input type="' + type + '" name="s.%$#n"></div>';
'<input type="' + type + '" name="s.%$#n"></div>');

var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
Expand All @@ -175,46 +175,46 @@ describe('fieldset', function () {
});

it('should return true if a properly labelled ARIA group contains only the right elements', function () {
fixture.innerHTML = '<div role="group" aria-label="group label">' +
fixtureSetup('<div role="group" aria-label="group label">' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>';
'<input type="' + type + '" name="uniqueyname"></div>');
var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
});


it('should ignore hidden inputs', function () {
fixture.innerHTML = '<fieldset><legend>Legendary</legend>' +
fixtureSetup('<fieldset><legend>Legendary</legend>' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>' +
'<input type="hidden" name="things"></fieldset>';
'<input type="hidden" name="things"></fieldset>');
var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));

});

it('should allow elements to be contained in 2 or more fieldsets', function () {
fixture.innerHTML = '<fieldset><legend>Legendary</legend>' +
fixtureSetup('<fieldset><legend>Legendary</legend>' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>' +
'</fieldset>' +
'<fieldset><legend>Also Legendary</legend>' +
'<input type="' + type + '" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>' +
'</fieldset>';
'</fieldset>');
var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
});

it('should allow elements to be contained in 2 or more groups', function () {
fixture.innerHTML = '<div role="group" aria-labelledby="g1"><div id="g1">Legendary</div>' +
fixtureSetup('<div role="group" aria-labelledby="g1"><div id="g1">Legendary</div>' +
'<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>' +
'</div>' +
'<div role="group" aria-labelledby="g2"><div id="g2">Also Legendary</div>' +
'<input type="' + type + '" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname"></div>' +
'</fieldset>';
'</fieldset>');
var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));
});
Expand All @@ -226,29 +226,27 @@ describe('fieldset', function () {
tests(type);

it('should allow radiogroup role', function () {
fixture.innerHTML = '<div id="grouplabel">Label</div>' +
fixtureSetup('<div id="grouplabel">Label</div>' +
'<div role="radiogroup" aria-labelledby="grouplabel">' +
'<input type="' + type + '" id="target" name="s.%$#n">' +
'<input type="' + type + '" name="s.%$#n"></div>';
'<input type="' + type + '" name="s.%$#n"></div>');

var node = fixture.querySelector('#target');
assert.isTrue(checks.fieldset.evaluate.call(checkContext, node));

});
});

describe('checkbox', function () {
var type = 'checkbox';
tests(type);

it('should NOT allow radiogroup role', function () {
fixture.innerHTML = '<div id="grouplabel">Label</div>' +
fixtureSetup('<div id="grouplabel">Label</div>' +
'<div role="radiogroup" aria-labelledby="grouplabel">' +
'<input type="' + type + '" id="target" name="s.%$#n">' +
'<input type="' + type + '" name="s.%$#n"></div>';

'<input type="' + type + '" name="s.%$#n"></div>');
var node = fixture.querySelector('#target');
assert.isFalse(checks.fieldset.evaluate.call(checkContext, node));

});
});
});
30 changes: 15 additions & 15 deletions test/checks/forms/labelledby.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ describe('group-labelledby', function () {
'use strict';

var fixture = document.getElementById('fixture');

var fixtureSetup = axe.testUtils.fixtureSetup;
var checkContext = {
_data: null,
data: function (d) {
Expand All @@ -21,16 +21,16 @@ describe('group-labelledby', function () {
var check = checks['group-labelledby'];

it('should return true if there is only one ' + type + ' element with the same name', function () {
fixture.innerHTML = '<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="differentname">';
fixtureSetup('<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="differentname">');

var node = fixture.querySelector('#target');
assert.isTrue(check.evaluate.call(checkContext, node));
});

it('should return false if there are two ungrouped ' + type + ' elements with the same name', function () {
fixture.innerHTML = '<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname">';
fixtureSetup('<input type="' + type + '" id="target" name="uniqueyname">' +
'<input type="' + type + '" name="uniqueyname">');

var node = fixture.querySelector('#target');
assert.isFalse(check.evaluate.call(checkContext, node));
Expand All @@ -41,9 +41,9 @@ describe('group-labelledby', function () {
});

it('should return false if there are ungrouped ' + type + ' elements with the same name and without shared labelledby', function () {
fixture.innerHTML = '<input type="' + type + '" id="target" aria-labelledby="unique one" name="uniqueyname">' +
fixtureSetup('<input type="' + type + '" id="target" aria-labelledby="unique one" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="notshared two" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="different three" name="uniqueyname">';
'<input type="' + type + '" aria-labelledby="different three" name="uniqueyname">');
var node = fixture.querySelector('#target');
assert.isFalse(check.evaluate.call(checkContext, node));
assert.deepEqual(checkContext._data, {
Expand All @@ -55,9 +55,9 @@ describe('group-labelledby', function () {
it('should return false if there are ungrouped ' + type + ' elements with the same name and with shared labelledby ' +
'pointing to no real node', function () {

fixture.innerHTML = '<input type="' + type + '" id="target" aria-labelledby="shared one" name="uniqueyname">' +
fixtureSetup('<input type="' + type + '" id="target" aria-labelledby="shared one" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared two" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">';
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">');

var node = fixture.querySelector('#target');
assert.isFalse(check.evaluate.call(checkContext, node));
Expand All @@ -69,10 +69,10 @@ describe('group-labelledby', function () {

it('should return false if there are ungrouped ' + type + ' elements with the same name and with shared labelledby ' +
'pointing to an empty node', function () {
fixture.innerHTML = '<p id="shared"></p>' +
fixtureSetup('<p id="shared"></p>' +
'<input type="' + type + '" id="target" aria-labelledby="shared one" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared two" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">';
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">');

var node = fixture.querySelector('#target');
assert.isFalse(check.evaluate.call(checkContext, node));
Expand All @@ -85,10 +85,10 @@ describe('group-labelledby', function () {
it('should return true if there are ungrouped ' + type + ' elements with the same name and with shared labelledby' +
'pointing to a node with text content', function () {

fixture.innerHTML = '<p id="shared">Label</p>' +
fixtureSetup('<p id="shared">Label</p>' +
'<input type="' + type + '" id="target" aria-labelledby="shared one" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared two" name="uniqueyname">' +
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">';
'<input type="' + type + '" aria-labelledby="shared three" name="uniqueyname">');

var node = fixture.querySelector('#target');
assert.isTrue(check.evaluate.call(checkContext, node));
Expand All @@ -101,10 +101,10 @@ describe('group-labelledby', function () {
it('should return true if there are ungrouped ' + type + ' elements with the same name and with shared labelledby ' +
'pointing to a node with text content - SPECIAL CHARACTERS', function () {

fixture.innerHTML = '<p id="shared">Label</p>' +
fixtureSetup('<p id="shared">Label</p>' +
'<input type="' + type + '" id="target" aria-labelledby="shared one" name="s$.#0">' +
'<input type="' + type + '" aria-labelledby="shared two" name="s$.#0">' +
'<input type="' + type + '" aria-labelledby="shared three" name="s$.#0">';
'<input type="' + type + '" aria-labelledby="shared three" name="s$.#0">');

var node = fixture.querySelector('#target');
assert.isTrue(check.evaluate.call(checkContext, node));
Expand Down
Loading

0 comments on commit 2b3b8b5

Please sign in to comment.