Add example E2E-style test for the app, showing async/await and routing.

.eslintrc

@@ -18,7 +18,9 @@
       "jsx": true
     }
   },
-  "globals": {},
+  "globals": {
+    "sleep": 1
+  },
   "rules": {
     "react/jsx-no-bind": [2, { "ignoreRefs": true }],
     "react/jsx-no-duplicate-props": 2,

package.json

@@ -23,6 +23,7 @@
     "setupFiles": [
       "./test/setup.js"
     ],
+    "testURL": "http://localhost:8080",
     "moduleFileExtensions": [
       "js",
       "jsx"
@@ -73,6 +74,7 @@
     "postcss-loader": "^1.2.1",
     "preact-jsx-chai": "^2.2.1",
     "raw-loader": "^0.5.1",
+    "regenerator-runtime": "^0.10.3",
     "replace-bundle-webpack-plugin": "^1.0.0",
     "script-ext-html-webpack-plugin": "^1.3.4",
     "sinon": "^1.17.5",

test/components/app.test.js

@@ -0,0 +1,50 @@
+import { h, render } from 'preact';
+import { route } from 'preact-router';
+import { expect } from 'chai';
+
+import App from '../../src/components/app';
+
+describe('App', () => {
+	let scratch;
+
+	beforeAll( () => {
+		scratch = document.createElement('div');
+		(document.body || document.documentElement).appendChild(scratch);
+	});
+
+	beforeEach( () => {
+		scratch.innerHTML = '';
+	});
+
+	afterAll( () => {
+		scratch.parentNode.removeChild(scratch);
+		scratch = null;
+	});
+
+
+	describe('routing', () => {
+		it('should render the homepage', () => {
+			render(<App />, scratch);
+
+			expect(scratch.innerHTML).to.contain('Home');
+		});
+
+		it('should render /profile', async () => {
+			render(<App />, scratch);
+			route('/profile');
+
+			await sleep(1);
+
+			expect(scratch.innerHTML).to.contain('Profile: me');
+		});
+
+		it('should render /profile/:user', async () => {
+			render(<App />, scratch);
+			route('/profile/john');
+
+			await sleep(1);
+
+			expect(scratch.innerHTML).to.contain('Profile: john');
+		});
+	});
+});

test/setup.js

@@ -1,3 +1,4 @@
+import 'regenerator-runtime/runtime';
 import chai from 'chai';
 import assertJsx, { options } from 'preact-jsx-chai';
 
@@ -6,3 +7,5 @@ options.functions = false;
 
 // activate the JSX assertion extension:
 chai.use(assertJsx);
+
+global.sleep = ms => new Promise( resolve => setTimeout(resolve, ms) );