docs: fix mocha example (#1687)

* docs: fix broken mocha example

* update readme

* update package.json

* revert test-examples.js

* sync test-examples code to understand output

* rerevert test-examples.js

Author: straker

doc/examples/jasmine/README.md

@@ -10,15 +10,13 @@ result from HTML with a single error.
 
 - Node must be installed; please follow the directions at http://www.nodejs.org
   to install it.
-- `npm install -g grunt-cli` to install the Grunt task runner (may need to be
-  run with `sudo` on Unix or as Administrator on Windows)
 - Move to the `doc/examples/jasmine` directory
 - `npm install` to install dependencies
 
 ## To run the example
 
 - Move to the `doc/examples/jasmine` directory
-- `grunt jasmine` to run Jasmine
+- `npm test` to run Jasmine
 
 You should see output indicating that the tests ran successfully, with zero
 failures.

doc/examples/mocha/Gruntfile.js

@@ -10,15 +10,13 @@ result from HTML with a single error.
 
 - Node must be installed; please follow the directions at http://www.nodejs.org
   to install it.
-- `npm install -g grunt-cli` to install the Grunt task runner (may need to be
-  run with `sudo` on Unix or as Administrator on Windows)
 - Move to the `doc/examples/mocha` directory
 - `npm install` to install dependencies
 
 ## To run the example
 
 - Move to the `doc/examples/mocha` directory
-- `grunt mocha` to run Mocha
+- `npm test` to run Mocha
 
 You should see output indicating that the tests ran successfully, with zero
 failures.
@@ -33,5 +31,5 @@ to `axe.run`.
 The third argument to the `axe.run` call should be the function to test
 the results. The example is simply looking at the count of violations, but much
 more detailed information is available if desired. The axe documentation
-should be consulted for more details on customizing and
-analyzing calls to `axe.run`.
+should be consulted for more details on customizing and analyzing calls to
+`axe.run`.

doc/examples/mocha/README.md

@@ -0,0 +1,29 @@
+module.exports = function(config) {
+	config.set({
+		basePath: '',
+
+		frameworks: ['mocha', 'chai'],
+
+		files: ['test/**/*.js', 'node_modules/axe-core/axe.js'],
+
+		exclude: [],
+
+		preprocessors: {},
+
+		reporters: ['progress'],
+
+		port: 9876,
+
+		colors: true,
+
+		logLevel: config.LOG_INFO,
+
+		autoWatch: true,
+
+		browsers: ['ChromeHeadless'],
+
+		singleRun: true,
+
+		concurrency: Infinity
+	});
+};

doc/examples/mocha/karma.conf.js

@@ -10,12 +10,13 @@
 	},
 	"dependencies": {},
 	"scripts": {
-		"test": "grunt mocha"
+		"test": "karma start karma.conf.js"
 	},
 	"devDependencies": {
 		"axe-core": "^3.2.2",
-		"chai": "~4.1.2",
-		"grunt": "~1.0.2",
-		"grunt-mocha": "1.2.0"
+		"karma": "^4.1.0",
+		"karma-chai": "^0.1.0",
+		"karma-chrome-launcher": "^2.2.0",
+		"karma-mocha": "^1.3.0"
 	}
 }

doc/examples/mocha/package.json

@@ -1,9 +1,21 @@
-/* global describe, it, expect, axe, document */
+/* global describe, it, expect, axe, document, expect */
 
 describe('axe', function() {
-	/* eslint no-unused-expressions: 0 */
 	'use strict';
 
+	document
+		.getElementsByTagName('body')[0]
+		.insertAdjacentHTML(
+			'beforeend',
+			'<div id="working">' +
+				'<label for="has-label">Label for this text field.</label>' +
+				'<input type="text" id="has-label">' +
+				'</div>' +
+				'<div id="broken">' +
+				'<p>Not a label</p><input type="text" id="no-label">' +
+				'</div>'
+		);
+
 	it('should report that good HTML is good', function(done) {
 		var n = document.getElementById('working');
 		axe.run(n, function(err, result) {