init

dequelabs · WilcoFiers · Nov 14, 2017 · Jul 19, 2017 · Jul 19, 2017 · Jul 19, 2017
commit edeb860cbed8bd6b638a747f16c794f6c77f2815
@@ -33,6 +33,7 @@
 | input-image-alt | Ensures &lt;input type=&quot;image&quot;&gt; elements have alternate text | cat.text-alternatives, wcag2a, wcag111, section508, section508.22.a | true |
 | label-title-only | Ensures that every form element is not solely labeled using the title or aria-describedby attributes | cat.forms, best-practice | false |
 | label | Ensures every form element has a label | cat.forms, wcag2a, wcag332, wcag131, section508, section508.22.n | true |
+| landmark-no-more-than-one-main | Each document in a page must have no more than one main landmark, used to identify the main content. | cat.best-practice | true |
 | layout-table | Ensures presentational &lt;table&gt; elements do not use &lt;th&gt;, &lt;caption&gt; elements or the summary attribute | cat.semantics, wcag2a, wcag131 | true |
 | link-in-text-block | Links can be distinguished without relying on color | cat.color, experimental, wcag2a, wcag141 | true |
 | link-name | Ensures links have discernible text | cat.name-role-value, wcag2a, wcag111, wcag412, wcag244, section508, section508.22.a | true |

diff --git a/lib/checks/keyboard/has-no-more-than-one-main.js b/lib/checks/keyboard/has-no-more-than-one-main.js
@@ -0,0 +1,2 @@
+var mains = document.querySelectorAll('main,[role=main]');
+return mains.length<=1;
diff --git a/lib/checks/keyboard/has-no-more-than-one-main.json b/lib/checks/keyboard/has-no-more-than-one-main.json
@@ -0,0 +1,11 @@
+{
+  "id": "has-no-more-than-one-main",
+  "evaluate": "has-no-more-than-one-main.js",
+  "metadata": {
+    "impact": "moderate",
+    "messages": {
+      "pass": "Document has no more than one main landmark",
+      "fail": "Document has more than one main landmark"
+    }
+  }
+}
diff --git a/lib/rules/landmark-no-more-than-one-main.json b/lib/rules/landmark-no-more-than-one-main.json
@@ -0,0 +1,16 @@
+{
+  "id": "landmark-no-more-than-one-main",
+  "selector": "html",
+  "tags": [
+	"cat.best-practice"
+  ],
+  "metadata": {
+    "description": "Each document in a page must have no more than one main landmark, used to identify the main content.",
+    "help": "A <main> element or an element with a role='main' attribute defines a main landmark."
+  },
+  "all": [],
+  "any": [
+    "has-no-more-than-one-main"
+  ],
+  "none": []
+}
diff --git a/test/checks/keyboard/has-no-more-than-one-main.js b/test/checks/keyboard/has-no-more-than-one-main.js
@@ -0,0 +1,37 @@
+describe('has-no-more-than-one-main', function () {
+	'use strict';
+
+	var fixture = document.getElementById('fixture');
+
+	afterEach(function () {
+		fixture.innerHTML = '';
+	});
+
+	it('should return false if there is more than one element with role main', function () {
+		var mainDiv = document.createElement('div');
+		mainDiv.setAttribute('role','main');
+		var anotherMain = document.createElement('div');
+		anotherMain.setAttribute('role','main');
+		fixture.appendChild(mainDiv);
+		fixture.appendChild(anotherMain);
+	});
+
+	it('should return false if there is more than one main element', function () {
+		var mainLandmark = document.createElement('main');
+		var anotherMain = document.createElement('main');
+		fixture.appendChild(mainLandmark);
+		fixture.appendChild(anotherMain);
+	});
+
+	it('should return true if there is only one element with role main', function(){
+		var mainDiv = document.createElement('div');
+		mainDiv.setAttribute('role','main');
+		fixture.appendChild(mainDiv);
+	});
+
+	it('should return true if there is only one main element', function(){
+		var mainLandmark = document.createElement('main');
+		fixture.appendChild(mainLandmark);
+	});
+
+});
diff --git a/test/integration/full/landmark-no-more-than-one-main/frames/level1.html b/test/integration/full/landmark-no-more-than-one-main/frames/level1.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html id="violation1">
+<head>
+	<meta charset="utf8">
+	<script src="/axe.js"></script>
+</head>
+<body>
+	<main>
+		<p>Main content in the outer body</p>
+	</main>
+	<iframe id="frame2" src="level2.html"></iframe>
+	<iframe id="frame3" src="level2-a.html"></iframe>
+</body>
+</html>
diff --git a/test/integration/full/landmark-no-more-than-one-main/frames/level2-a.html b/test/integration/full/landmark-no-more-than-one-main/frames/level2-a.html
@@ -0,0 +1,11 @@
+<!doctype html>
+<html id="pass2">
+<head>
+	<title>No lang test</title>
+	<meta charset="utf8">
+	<script src="/axe.js"></script>
+</head>
+<body>
+	Hi
+</body>
+</html>
diff --git a/test/integration/full/landmark-no-more-than-one-main/frames/level2.html b/test/integration/full/landmark-no-more-than-one-main/frames/level2.html
@@ -0,0 +1,9 @@
+<!doctype html>
+<html id="violation2">
+<head>
+	<meta charset="utf8">
+	<script src="/axe.js"></script>
+</head>
+<body>
+</body>
+</html>
diff --git a/.../integration/full/landmark-no-more-than-one-main/landmark-no-more-than-one-main-pass.html b/.../integration/full/landmark-no-more-than-one-main/landmark-no-more-than-one-main-pass.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html lang="en" id="pass1">
+<head>
+	<title>has-no-more-than-one-main test</title>
+	<meta charset="utf8">
+	<link rel="stylesheet" type="text/css" href="/node_modules/mocha/mocha.css" />
+	<script src="/node_modules/mocha/mocha.js"></script>
+	<script src="/node_modules/chai/chai.js"></script>
+	<script src="/axe.js"></script>
+	<script>
+		mocha.setup({
+			timeout: 10000,
+			ui: 'bdd'
+		});
+		var assert = chai.assert;
+	</script>
+</head>
+<body>
+
+	<iframe id="frame1" src="frames/level1.html"></iframe>
+	<div id="mocha"></div>
+	<script src="landmark-no-more-than-one-main-pass.js"></script>
+	<script src="/test/integration/adapter.js"></script>
+</body>
+</html>
diff --git a/test/integration/full/landmark-no-more-than-one-main/landmark-no-more-than-one-main-pass.js b/test/integration/full/landmark-no-more-than-one-main/landmark-no-more-than-one-main-pass.js
@@ -0,0 +1,39 @@
+
+describe('landmark-no-more-than-one-main test pass', function () {
+	'use strict';
+	var results;
+	before(function (done) {
+		window.addEventListener('load', function () {
+			axe.run({ runOnly: { type: 'rule', values: ['landmark-no-more-than-one-main'] } }, function (err, r) {
+				assert.isNull(err);
+				results = r;
+				done();
+			});
+		});
+	});
+
+	describe('violations', function () {
+		it('should find 0', function () {
+			assert.lengthOf(results.violations, 0);
+		});
+	});
+
+	describe('passes', function () {
+		it('should find 2', function () {
+			assert.lengthOf(results.passes[0].nodes, 2);
+		});
+
+		it('should find #pass1', function () {
+			assert.deepEqual(results.passes[0].nodes[0].target, ['#pass1']);
+		});
+	});
+
+	it('should find 0 inapplicable', function () {
+		assert.lengthOf(results.inapplicable, 0);
+	});
+
+	it('should find 0 incomplete', function () {
+		assert.lengthOf(results.incomplete, 0);
+	});
+
+});