feat(non-space-content): switch all non-empty checks to new generic c…

…heck (#2215)

* feat(non-space-content): switch all non-empty checks to new generic check

* udpate doc

lib/checks/generic/README.md

@@ -0,0 +1,13 @@
+Generic checks are evaluate functions that are used by multiple checks. They cannot be used directly by a rule (thus there is no check meatadata file associated with them) and must be used by another check passing in the required options.
+
+To use these checks, pass the check id (found in the metadata-function-map file) as the value of a checks `evaluate` property and pass any required options.
+
+```json
+{
+	"id": "my-check",
+	"evaluate": "generic-check-id",
+	"options": {
+		"required": true
+	}
+}
+```

lib/checks/generic/attr-non-space-content-evaluate.js

@@ -0,0 +1,14 @@
+import { sanitize } from '../../commons/text';
+
+function attrNonSpaceContentEvaluate(node, options = {}, vNode) {
+	if (!options.attribute || typeof options.attribute !== 'string') {
+		throw new TypeError(
+			'attr-non-space-content requires options.attribute to be a string'
+		);
+	}
+
+	const attribute = vNode.attr(options.attribute) || '';
+	return !!sanitize(attribute.trim());
+}
+
+export default attrNonSpaceContentEvaluate;

lib/checks/shared/non-empty-alt.json

@@ -1,6 +1,9 @@
 {
 	"id": "non-empty-alt",
-	"evaluate": "non-empty-alt-evaluate",
+	"evaluate": "attr-non-space-content-evaluate",
+	"options": {
+		"attribute": "alt"
+	},
 	"metadata": {
 		"impact": "critical",
 		"messages": {

lib/checks/shared/non-empty-title.json

@@ -1,6 +1,9 @@
 {
 	"id": "non-empty-title",
-	"evaluate": "non-empty-title-evaluate",
+	"evaluate": "attr-non-space-content-evaluate",
+	"options": {
+		"attribute": "title"
+	},
 	"metadata": {
 		"impact": "serious",
 		"messages": {

lib/checks/shared/non-empty-value.json

@@ -1,6 +1,9 @@
 {
 	"id": "non-empty-value",
-	"evaluate": "non-empty-value-evaluate",
+	"evaluate": "attr-non-space-content-evaluate",
+	"options": {
+		"attribute": "value"
+	},
 	"metadata": {
 		"impact": "critical",
 		"messages": {

lib/core/base/metadata-function-map.js

@@ -38,6 +38,9 @@ import linkInTextBlockEvaluate from '../../checks/color/link-in-text-block-evalu
 import autocompleteAppropriateEvaluate from '../../checks/forms/autocomplete-appropriate-evaluate';
 import autocompleteValidEvaluate from '../../checks/forms/autocomplete-valid-evaluate';
 
+// generic
+import attrNonSpaceContentEvaluate from '../../checks/generic/attr-non-space-content-evaluate';
+
 // navigation
 import headerPresentEvaluate from '../../checks/navigation/header-present-evaluate';
 import headingOrderAfter from '../../checks/navigation/heading-order-after';
@@ -63,10 +66,7 @@ import existsEvaluate from '../../checks/shared/exists-evaluate';
 import hasAltEvaluate from '../../checks/shared/has-alt-evaluate';
 import hasVisibleTextEvaluate from '../../checks/shared/has-visible-text-evaluate';
 import isOnScreenEvaluate from '../../checks/shared/is-on-screen-evaluate';
-import nonEmptyAltEvaluate from '../../checks/shared/non-empty-alt-evaluate';
 import nonEmptyIfPresentEvaluate from '../../checks/shared/non-empty-if-present-evaluate';
-import nonEmptyTitleEvaluate from '../../checks/shared/non-empty-title-evaluate';
-import nonEmptyValueEvaluate from '../../checks/shared/non-empty-value-evaluate';
 import roleNoneEvaluate from '../../checks/shared/role-none-evaluate';
 import rolePresentationEvaluate from '../../checks/shared/role-presentation-evaluate';
 import svgNonEmptyTitleEvaluate from '../../checks/shared/svg-non-empty-title-evaluate';
@@ -203,6 +203,9 @@ const metadataFunctionMap = {
 	'autocomplete-appropriate-evaluate': autocompleteAppropriateEvaluate,
 	'autocomplete-valid-evaluate': autocompleteValidEvaluate,
 
+	// generic
+	'attr-non-space-content-evaluate': attrNonSpaceContentEvaluate,
+
 	// navigation
 	'header-present-evaluate': headerPresentEvaluate,
 	'heading-order-after': headingOrderAfter,
@@ -228,10 +231,7 @@ const metadataFunctionMap = {
 	'has-alt-evaluate': hasAltEvaluate,
 	'has-visible-text-evaluate': hasVisibleTextEvaluate,
 	'is-on-screen-evaluate': isOnScreenEvaluate,
-	'non-empty-alt-evaluate': nonEmptyAltEvaluate,
 	'non-empty-if-present-evaluate': nonEmptyIfPresentEvaluate,
-	'non-empty-title-evaluate': nonEmptyTitleEvaluate,
-	'non-empty-value-evaluate': nonEmptyValueEvaluate,
 	'role-none-evaluate': roleNoneEvaluate,
 	'role-presentation-evaluate': rolePresentationEvaluate,
 	'svg-non-empty-title-evaluate': svgNonEmptyTitleEvaluate,

test/checks/shared/non-empty-alt.js

@@ -9,22 +9,28 @@ describe('non-empty-alt', function() {
 	});
 
 	it('should return true if an alt is present', function() {
-		var params = checkSetup('<img id="target" alt="woohoo" />');
+		var params = checkSetup('<img id="target" alt="woohoo" />', {
+			attribute: 'alt'
+		});
 		assert.isTrue(checks['non-empty-alt'].evaluate.apply(null, params));
 	});
 
 	it('should return false if an alt is not present', function() {
-		var params = checkSetup('<img id="target" />');
+		var params = checkSetup('<img id="target" />', { attribute: 'alt' });
 		assert.isFalse(checks['non-empty-alt'].evaluate.apply(null, params));
 	});
 
 	it('should return false if an alt is present, but empty', function() {
-		var params = checkSetup('<img id="target" alt=" " />');
+		var params = checkSetup('<img id="target" alt=" " />', {
+			attribute: 'alt'
+		});
 		assert.isFalse(checks['non-empty-alt'].evaluate.apply(null, params));
 	});
 
 	it('should collapse whitespace', function() {
-		var params = checkSetup('<img id="target" alt=" \t \n \r \t  \t\r\n " />');
+		var params = checkSetup('<img id="target" alt=" \t \n \r \t  \t\r\n " />', {
+			attribute: 'alt'
+		});
 		assert.isFalse(checks['non-empty-alt'].evaluate.apply(null, params));
 	});
 });

test/checks/shared/non-empty-title.js

@@ -2,44 +2,40 @@ describe('non-empty-title', function() {
 	'use strict';
 
 	var fixture = document.getElementById('fixture');
-	var flatTreeSetup = axe.testUtils.flatTreeSetup;
+	var checkSetup = axe.testUtils.checkSetup;
 
 	afterEach(function() {
 		fixture.innerHTML = '';
 	});
 
 	it('should return true if a title is present', function() {
-		var node = document.createElement('img');
-		node.setAttribute('title', 'woohoo');
-		fixture.appendChild(node);
-		flatTreeSetup(fixture);
+		var params = checkSetup('<img id="target" title="woohoo" />', {
+			attribute: 'title'
+		});
 
-		assert.isTrue(checks['non-empty-title'].evaluate(node));
+		assert.isTrue(checks['non-empty-title'].evaluate.apply(null, params));
 	});
 
 	it('should return false if a title is not present', function() {
-		var node = document.createElement('img');
-		fixture.appendChild(node);
-		flatTreeSetup(fixture);
+		var params = checkSetup('<img id="target" />', { attribute: 'title' });
 
-		assert.isFalse(checks['non-empty-title'].evaluate(node));
+		assert.isFalse(checks['non-empty-title'].evaluate.apply(null, params));
 	});
 
 	it('should return false if a title is present, but empty', function() {
-		var node = document.createElement('img');
-		node.setAttribute('title', ' ');
-		fixture.appendChild(node);
-		flatTreeSetup(fixture);
+		var params = checkSetup('<img id="target" title=" " />', {
+			attribute: 'title'
+		});
 
-		assert.isFalse(checks['non-empty-title'].evaluate(node));
+		assert.isFalse(checks['non-empty-title'].evaluate.apply(null, params));
 	});
 
 	it('should collapse whitespace', function() {
-		var node = document.createElement('div');
-		node.setAttribute('title', ' \t \n \r \t  \t\r\n ');
-		fixture.appendChild(node);
-		flatTreeSetup(fixture);
+		var params = checkSetup(
+			'<img id="target" title=" \t \n \r \t  \t\r\n " />',
+			{ attribute: 'title' }
+		);
 
-		assert.isFalse(checks['non-empty-title'].evaluate(node));
+		assert.isFalse(checks['non-empty-title'].evaluate.apply(null, params));
 	});
 });

test/checks/shared/non-empty-value.js

@@ -2,39 +2,40 @@ describe('non-empty-value', function() {
 	'use strict';
 
 	var fixture = document.getElementById('fixture');
+	var checkSetup = axe.testUtils.checkSetup;
 
 	afterEach(function() {
 		fixture.innerHTML = '';
 	});
 
 	it('should return true if an value is present', function() {
-		var node = document.createElement('input');
-		node.setAttribute('value', 'woohoo');
-		fixture.appendChild(node);
+		var params = checkSetup('<input id="target" value="woohoo" />', {
+			attribute: 'value'
+		});
 
-		assert.isTrue(checks['non-empty-value'].evaluate(node));
+		assert.isTrue(checks['non-empty-value'].evaluate.apply(null, params));
 	});
 
 	it('should return false if an value is not present', function() {
-		var node = document.createElement('input');
-		fixture.appendChild(node);
+		var params = checkSetup('<input id="target" />', { attribute: 'value' });
 
-		assert.isFalse(checks['non-empty-value'].evaluate(node));
+		assert.isFalse(checks['non-empty-value'].evaluate.apply(null, params));
 	});
 
 	it('should return false if an value is present, but empty', function() {
-		var node = document.createElement('input');
-		node.setAttribute('value', ' ');
-		fixture.appendChild(node);
+		var params = checkSetup('<input id="target" value=" " />', {
+			attribute: 'value'
+		});
 
-		assert.isFalse(checks['non-empty-value'].evaluate(node));
+		assert.isFalse(checks['non-empty-value'].evaluate.apply(null, params));
 	});
 
 	it('should collapse whitespace', function() {
-		var node = document.createElement('div');
-		node.setAttribute('value', ' \t \n \r \t  \t\r\n ');
-		fixture.appendChild(node);
+		var params = checkSetup(
+			'<input id="target" value=" \t \n \r \t  \t\r\n " />',
+			{ attribute: 'value' }
+		);
 
-		assert.isFalse(checks['non-empty-value'].evaluate(node));
+		assert.isFalse(checks['non-empty-value'].evaluate.apply(null, params));
 	});
 });