First stab at a test suite (#52)

* First stab at a test suite

* Fix Travis setup

* Reencrypt te key

* Exit with non-zero on fail

* Date is local to the servers

* Rotated the access key

* More tests

* More tests

* More tests

* Fix WebAnimations detector

* Some more browser targets

* Apply core-js to the polyfills

* Switch to Safari 8

* More tests

* test : Element.prototype.classList

* cleanup

* test : Object.assign

* add eslint

* update polyfill-library

* generate

* manual import

* check that tests can pass

* more manual imports

* make it fail again

* test : customElements.define

* Revert "generate"

This reverts commit d2418b6.

* Revert "update polyfill-library"

This reverts commit 526a76b.

* AbortController is not automatically polyfilled it seems

* compile abort-controller

* mjs is also js

* AbortController is broken

* Gettings there, slowly

* use correct web animations arguments

* check if WebAnimation is broken on Edge81 or just flaky

* fix WebAnimations test

* patch broken AbortController

* skip more blob tests

* update after merge from master

* more badges

* use correct browserstack badge key

* Revert "use correct browserstack badge key"

This reverts commit 738e375.

* let's try this again : browserstack badge

* v0.2.5

Co-authored-by: romainmenke <[email protected]>
Co-authored-by: Romain Menke <[email protected]>

.gitignore

@@ -1,4 +1,2 @@
-/helpers
-/modules
 node_modules
 *.log

.travis.yml

@@ -1,9 +1,14 @@
 language: node_js
 node_js:
-- node
-
+  - node
 install:
-    - make install
-    - make generate
+  - make install
+  - make generate
 script:
-    - make build-example
+  - make build-example
+  - make build-tests
+  - make run-tests
+env:
+  global:
+    - BROWSERSTACK_USERNAME=simonmenke
+    - secure: "ex9A3gs2B8j57uPlv9aKsQHRIZY8WdBq7XbCm96wPfxJed2UzOg211odayHvcmVAt4n3CSpyxolF1tvEIihWHHHF6jR8yDuK5kaXiRkIPFFeNprTKbkGs+745Gyb1xnp8PGgLdZLi8JWU2dJWUEFEeMYmIXskKXHtn+mJe15fdNbus1zhjHcWv+T3V6jkROoDRShzq56UgiQC7/wpiOCGtS6kn92en4OY7JUAQHGUFJT1ldVGm+/vZt+dbd5y2ME1HTduZw4ml+H4YZuImdTEZhiBSCZKUC8hOpn1tYn913xfgiaCol5WHjplnRhjV+ukNgdCy6rZqwzJYWEbNOk2AdzLOKD8ykjIafzyXUAbDPH4016almquaHK8zMdjQfBsi0mp6EiqHLal4SGcAKr82yupRckI8amJyn8BwamDh7zufVMoq1ell6irm48NAw0lYZLRG5qedB0HPX5tD3fpxHe1ZNTqUtMcVlBhDEEG6D2pcFTWYepOT6q+ldcbL1QcbwmgCdNmJVe+7G/JmUClQG9WdUHmlQ9DqvMkjmxs0+OhgVq2IqoHd6Gcxk4RN5NtK649ZidXRKIk9El4VbO0RM4qmApKuWjzOXMjNuRQHn7po6kNKSmp38elNwwLMOo+h5cEB2VFoODdRwxdaZEdPyHzF76ISpgBCbaxZ4Es1I="

Makefile

@@ -8,6 +8,15 @@ generate: yarn
 build-example: yarn
 	(cd packages/core-web-example && yarn build)
 
+build-tests: yarn
+	(cd packages/core-web-tests && yarn build)
+
+run-tests: yarn
+	(cd packages/core-web-tests && yarn browserstack-runner)
+
+build-watch-tests: yarn
+	yarn --cwd packages/core-web-tests webpack -w
+
 version: yarn
 	yarn lerna version --no-git-tag-version --no-push
 

README.md

@@ -1,6 +1,6 @@
 # core-web
 
-[![Build Status](https://travis-ci.com/mrhenry/core-web.svg?branch=master)](https://travis-ci.com/mrhenry/core-web) [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=mrhenry/core-web)](https://dependabot.com)
+[![Build Status](https://travis-ci.com/mrhenry/core-web.svg?branch=master)](https://travis-ci.com/mrhenry/core-web) [![BrowserStack Status](https://automate.browserstack.com/badge.svg?badge_key=MkE1NFM0ZkZESGg1VkNVd0htbm1BSTNFNjJHUGRhSjlEcU1PQ0JOMVVLOD0tLUVQMFpFUWIxTCtJWUtKYkFXYnN3OGc9PQ==--e6f705c0dc92b0ed20bd3a64df779e846f1ceeda)](https://automate.browserstack.com/public-build/MkE1NFM0ZkZESGg1VkNVd0htbm1BSTNFNjJHUGRhSjlEcU1PQ0JOMVVLOD0tLUVQMFpFUWIxTCtJWUtKYkFXYnN3OGc9PQ==--e6f705c0dc92b0ed20bd3a64df779e846f1ceeda) [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=mrhenry/core-web)](https://dependabot.com)
 
 ## Babel Plugin
 

lerna.json

@@ -3,6 +3,6 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.2.4",
+  "version": "0.2.5",
   "useWorkspaces": true
 }

package.json

@@ -7,6 +7,9 @@
   "scripts": {
     "bootstrap": "lerna bootstrap"
   },
+  "prettier": {
+    "useTabs": true
+  },
   "devDependencies": {
     "lerna": "^3.20.2"
   }

packages/babel-plugin-core-web/README.md

@@ -4,7 +4,7 @@
 >
 > Bringing [polyfill.io](https://polyfill.io/v3/) to your babel flow.
 
-[![version](https://img.shields.io/npm/v/@mrhenry/babel-plugin-core-web.svg)](https://www.npmjs.com/package/@mrhenry/babel-plugin-core-web) [![Build Status](https://travis-ci.com/mrhenry/core-web.svg?branch=master)](https://travis-ci.com/mrhenry/core-web) [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=mrhenry/core-web)](https://dependabot.com)
+[![version](https://img.shields.io/npm/v/@mrhenry/babel-plugin-core-web.svg)](https://www.npmjs.com/package/@mrhenry/babel-plugin-core-web) [![Build Status](https://travis-ci.com/mrhenry/core-web.svg?branch=master)](https://travis-ci.com/mrhenry/core-web) [![BrowserStack Status](https://automate.browserstack.com/badge.svg?badge_key=MkE1NFM0ZkZESGg1VkNVd0htbm1BSTNFNjJHUGRhSjlEcU1PQ0JOMVVLOD0tLUVQMFpFUWIxTCtJWUtKYkFXYnN3OGc9PQ==--e6f705c0dc92b0ed20bd3a64df779e846f1ceeda)](https://automate.browserstack.com/public-build/MkE1NFM0ZkZESGg1VkNVd0htbm1BSTNFNjJHUGRhSjlEcU1PQ0JOMVVLOD0tLUVQMFpFUWIxTCtJWUtKYkFXYnN3OGc9PQ==--e6f705c0dc92b0ed20bd3a64df779e846f1ceeda) [![Dependabot Status](https://api.dependabot.com/badges/status?host=github&repo=mrhenry/core-web)](https://dependabot.com)
 
 
 ## why

packages/babel-plugin-core-web/detectors/WebAnimations.js

@@ -0,0 +1,3 @@
+const m = require("../lib/ast-matcher");
+
+module.exports = [m("animate"), m("Animation")];

packages/babel-plugin-core-web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrhenry/babel-plugin-core-web",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "browser feature polyfills as a babel plugin",
   "main": "lib/index.js",
   "author": "Simon Menke <[email protected]>",
@@ -28,7 +28,7 @@
     "@babel/parser": "^7.3.1",
     "@babel/traverse": "^7.2.3",
     "@babel/types": "^7.3.0",
-    "@mrhenry/core-web": "^0.2.4",
+    "@mrhenry/core-web": "^0.2.5",
     "fast-deep-equal": "^3.1.1"
   },
   "bugs": {

packages/core-web-example/package.json

@@ -1,13 +1,13 @@
 {
-  "name": "core-web-example",
-  "version": "0.2.4",
+  "name": "@mrhenry/core-web-example",
+  "version": "0.2.5",
   "private": true,
   "scripts": {
     "build": "babel src -d lib"
   },
   "devDependencies": {
     "@babel/cli": "^7.2.3",
     "@babel/core": "^7.8.6",
-    "@mrhenry/babel-plugin-core-web": "^0.2.4"
+    "@mrhenry/babel-plugin-core-web": "^0.2.5"
   }
 }

packages/core-web-generator/generate.js

@@ -94,6 +94,13 @@ async function gen(feature, mapping) {
 		if (meta.detectSource) {
 			output.add(streamFromString(`if (!(${meta.detectSource})) {`));
 		}
+
+		// TODO: polyfill is broken upstream
+		// fix umdOutro in AbortController
+		// https://github.com/mysticatea/abort-controller/blob/master/rollup.config.js#L14
+		if (feature === 'AbortController') {
+			output.add(streamFromString(`var define;\nvar module;\n`));
+		}
 	}
 
 	output.add(sources.streamPolyfillSource(feature, 'raw'));

packages/core-web-generator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrhenry/core-web-generator",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "private": true,
   "scripts": {
     "build": "node ./generate.js"

packages/core-web-tests/.eslintrc.js

@@ -0,0 +1,34 @@
+module.exports = {
+	'env': {
+		'browser': true,
+		'es6': true
+	},
+	'extends': 'eslint:recommended',
+	'globals': {
+		'Atomics': 'readonly',
+		'SharedArrayBuffer': 'readonly',
+		'QUnit': 'readonly'
+	},
+	'parserOptions': {
+		'ecmaVersion': 2018,
+		'sourceType': 'module'
+	},
+	'rules': {
+		'indent': [
+			'error',
+			'tab'
+		],
+		'linebreak-style': [
+			'error',
+			'unix'
+		],
+		'quotes': [
+			'error',
+			'single'
+		],
+		'semi': [
+			'error',
+			'always'
+		]
+	}
+};

packages/core-web-tests/.gitignore

@@ -0,0 +1,2 @@
+/node_modules
+/dist

packages/core-web-tests/browserstack.json

@@ -0,0 +1,17 @@
+{
+	"exit_with_fail": true,
+	"test_framework": "qunit",
+	"test_path": ["index.html"],
+	"test_server_port": "8899",
+	"browsers": [
+		"ie_11",
+		"safari_8",
+		"chrome_41",
+
+		"safari_latest",
+		"chrome_latest",
+		"opera_latest",
+		"firefox_latest",
+		"edge_latest"
+	]
+}

packages/core-web-tests/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width" />
+		<title>QUnit</title>
+		<link
+			rel="stylesheet"
+			href="https://code.jquery.com/qunit/qunit-2.9.2.css"
+		/>
+	</head>
+	<body>
+		<div id="qunit"></div>
+		<div id="qunit-fixture"></div>
+		<script src="https://code.jquery.com/qunit/qunit-2.9.2.js"></script>
+		<script src="dist/non-interactive.bundle.js"></script>
+	</body>
+</html>

packages/core-web-tests/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@mrhenry/core-web-tests",
+  "version": "0.2.5",
+  "private": true,
+  "scripts": {
+    "build": "webpack",
+    "lint": "eslint --fix ./src/*.js"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.8.6",
+    "@babel/preset-env": "^7.8.6",
+    "@mrhenry/babel-plugin-core-web": "^0.2.5",
+    "@types/qunit": "2.9.x",
+    "babel-loader": "^8.0.6",
+    "browserstack-runner": "^0.9.1",
+    "core-js": "^3.6.4",
+    "eslint": "^6.8.0",
+    "regenerator-runtime": "0.13.x",
+    "webpack": "4.41.x",
+    "webpack-cli": "^3.3.11"
+  }
+}

packages/core-web-tests/src/non_interactive.js

@@ -0,0 +1,6 @@
+function importAll(r) {
+	r.keys().forEach(r);
+}
+
+// eslint-disable-next-line no-undef, no-useless-escape
+importAll(require.context('./', true, /test_[^\/]+\.js$/));

packages/core-web-tests/src/test_AbortController.js

@@ -0,0 +1,8 @@
+// TODO: polyfill is broken upstream
+QUnit.test('AbortController', async assert => {
+	const ac = new AbortController();
+
+	await fetch('package.json', { signal: ac.signal });
+	ac.abort();
+	assert.rejects(fetch('package.json', { signal: ac.signal }));
+});

packages/core-web-tests/src/test_Blob.js

@@ -0,0 +1,28 @@
+QUnit.module('Blob', function() {
+	QUnit.test('new Blob', assert => {
+		const blob = new Blob(['Hello', ' World', '!'], { type: 'text/plain' });
+		assert.equal(blob.size, 12);
+		assert.equal(blob.type, 'text/plain');
+	});
+
+	// TODO: needs polyfill for "stream()"
+	QUnit.skip('Blob/Response interop', async assert => {
+		const blob = new Blob(['Hello', ' World', '!'], { type: 'text/plain' });
+		const text = await new Response(blob).text();
+		assert.equal(text, 'Hello World!');
+	});
+
+	// TODO: fetch polyfill doesn't handle data urls
+	QUnit.skip('URL.createObjectURL', async assert => {
+		const blob = new Blob(['Hello', ' World', '!'], { type: 'text/plain' });
+		const data = URL.createObjectURL(blob);
+		const actual = await (await fetch(data)).text();
+		assert.equal(actual, 'Hello World!');
+	});
+
+	// TODO: needs polyfill for "text()"
+	QUnit.skip('Blob.text()', async assert => {
+		const blob = new Blob(['Hello', ' World', '!'], { type: 'text/plain' });
+		assert.equal(await blob.text(), 'Hello World!');
+	});
+});

packages/core-web-tests/src/test_Element.prototype.classList.js

@@ -0,0 +1,9 @@
+QUnit.test('Element.prototype.classList', function(assert) {
+	const fixture = document.getElementById('qunit-fixture');
+
+	const div = document.createElement('div');
+	fixture.appendChild(div);
+
+	div.classList.add('classlist-test');
+	assert.equal(div.className, 'classlist-test');
+});

packages/core-web-tests/src/test_Intl.DateTimeFormat.js

@@ -0,0 +1,15 @@
+import '@mrhenry/core-web/modules/Intl.~locale.en-US';
+import '@mrhenry/core-web/modules/Intl.~locale.en-GB';
+
+QUnit.test('Intl.DateTimeFormat ', function(assert) {
+	const date = new Date(Date.UTC(2012, 11, 20, 12, 0, 0));
+	const remove_LEFT_TO_RIGHT_MARKER = s => s.replace(/\u200E/g, '');
+	assert.equal(
+		remove_LEFT_TO_RIGHT_MARKER(new Intl.DateTimeFormat('en-US').format(date)),
+		'12/20/2012'
+	);
+	assert.equal(
+		remove_LEFT_TO_RIGHT_MARKER(new Intl.DateTimeFormat('en-GB').format(date)),
+		'20/12/2012'
+	);
+});

packages/core-web-tests/src/test_Intl.RelativeTimeFormat.js

@@ -0,0 +1,10 @@
+import '@mrhenry/core-web/modules/Intl.~locale.en';
+import '@mrhenry/core-web/modules/Intl.PluralRules.~locale.en';
+import '@mrhenry/core-web/modules/Intl.RelativeTimeFormat.~locale.en';
+
+QUnit.test('Intl.RelativeTimeFormat', function(assert) {
+	const format = new Intl.RelativeTimeFormat('en', { style: 'narrow' });
+	const expected = 'in 3 qtrs.';
+	const actual = format.format(3, 'quarter');
+	assert.equal(actual, expected);
+});

packages/core-web-tests/src/test_Object.assign.js

@@ -0,0 +1,19 @@
+QUnit.test('Object.assign', function(assert) {
+	const fixture = document.getElementById('qunit-fixture');
+
+	const div = document.createElement('div');
+	fixture.appendChild(div);
+
+	Object.assign(div, {
+		width: '100px',
+		height: '200px'
+	});
+	assert.equal(div.width, '100px');
+	assert.equal(div.height, '200px');
+
+	Object.assign(div.style, {
+		backgroundColor: 'black'
+	});
+
+	assert.equal(div.getAttribute('style'), 'background-color: black;');
+});

packages/core-web-tests/src/test_URL.js

@@ -0,0 +1,59 @@
+QUnit.module('URL', function() {
+	QUnit.test('new URL', assert => {
+		const url = new URL(
+			'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+		);
+		assert.equal(
+			url.href,
+			'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+		);
+		assert.equal(url.origin, 'https://example.com:8080');
+		assert.equal(url.protocol, 'https:');
+		assert.equal(url.username, 'u');
+		assert.equal(url.password, 'p');
+		assert.equal(url.host, 'example.com:8080');
+		assert.equal(url.hostname, 'example.com');
+		assert.equal(url.port, '8080');
+		assert.equal(url.pathname, '/some/path');
+		assert.equal(url.search, '?foo=true&bar=true');
+		assert.equal(url.hash, '#frag');
+		assert.deepEqual(
+			[...url.searchParams.entries()],
+			[
+				['foo', 'true'],
+				['bar', 'true']
+			]
+		);
+	});
+
+	QUnit.test('new URL with base', assert => {
+		assert.equal(
+			new URL(
+				'rel?baz=true#fragx',
+				'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+			).href,
+			'https://u:[email protected]:8080/some/rel?baz=true#fragx'
+		);
+		assert.equal(
+			new URL(
+				'/abs?baz=true#fragx',
+				'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+			).href,
+			'https://u:[email protected]:8080/abs?baz=true#fragx'
+		);
+		assert.equal(
+			new URL(
+				'rel?baz=true',
+				'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+			).href,
+			'https://u:[email protected]:8080/some/rel?baz=true'
+		);
+		assert.equal(
+			new URL(
+				'rel',
+				'https://u:[email protected]:8080/some/path?foo=true&bar=true#frag'
+			).href,
+			'https://u:[email protected]:8080/some/rel'
+		);
+	});
+});