test: Updating test suite

packages/cli/tests/build.test.js

@@ -1,9 +1,9 @@
-const { join } = require('path');
+const { join, relative } = require('path');
 const { access, mkdir, readdir, readFile, rename, writeFile } =
 	require('fs').promises;
 const looksLike = require('html-looks-like');
 const { create, build, buildFast } = require('./lib/cli');
-const { snapshot } = require('./lib/utils');
+const { expand, snapshot } = require('./lib/utils');
 const { subject } = require('./lib/output');
 const images = require('./images/build');
 const minimatch = require('minimatch');
@@ -77,6 +77,26 @@ describe('preact build', () => {
 		await expect(buildFast(dir)).resolves.not.toThrow();
 	});
 
+	it('lazy loads routes with preact-iso `lazy`', async () => {
+		let dir = await subject('lazy-load-iso');
+		await buildFast(dir);
+
+		let output = await expand(join(dir, 'build')).then(arr => {
+			return arr.map(x => relative(dir, x));
+		});
+
+		let expected = [
+			/build\/a\.chunk\.\w{5}\.js$/,
+			/build\/a\.chunk\.\w{5}\.css$/,
+			/build\/b\.chunk\.\w{5}\.js$/,
+			/build\/b\.chunk\.\w{5}\.css$/,
+		];
+
+		expected.forEach(pattern => {
+			expect(output.find(file => pattern.test(file))).not.toBeUndefined();
+		});
+	});
+
 	it('should patch global location object', async () => {
 		let dir = await subject('location-patch');
 

packages/cli/tests/images/build.js

@@ -9,40 +9,40 @@ exports.default = {
 
 	'ssr-build/ssr-bundle.css': 1281,
 	'ssr-build/ssr-bundle.css.map': 2070,
-	'ssr-build/ssr-bundle.js': 10863,
-	'ssr-build/ssr-bundle.js.map': 49128,
+	'ssr-build/ssr-bundle.js': 8729,
+	'ssr-build/ssr-bundle.js.map': 42913,
 	'ssr-build/asset-manifest.json': 76,
 
-	'bundle.79d07.js': 21560,
-	'bundle.79d07.js.map': 85822,
-	'bundle.79d07.legacy.js': 22549,
-	'bundle.79d07.legacy.js.map': 106841,
+	'bundle.65625.js': 21088,
+	'bundle.65625.js.map': 86032,
+	'bundle.65625.legacy.js': 22434,
+	'bundle.65625.legacy.js.map': 108309,
 	'bundle.354c3.css': 945,
 	'bundle.354c3.css.map': 1758,
 
-	'dom-polyfills.8a933.legacy.js': 5221,
-	'dom-polyfills.8a933.legacy.js.map': 18676,
-	'es-polyfills.legacy.js': 42690,
+	'dom-polyfills.8a933.legacy.js': 5252,
+	'dom-polyfills.8a933.legacy.js.map': 18836,
+	'es-polyfills.legacy.js': 61323,
 
 	'favicon.ico': 15086,
-	'index.html': 2264,
+	'index.html': 2137,
 	'manifest.json': 455,
 	'preact_prerender_data.json': 11,
 	'asset-manifest.json': 943,
 
-	'route-home.chunk.dd4a3.js': 347,
-	'route-home.chunk.dd4a3.js.map': 1848,
-	'route-home.chunk.dd4a3.legacy.js': 388,
-	'route-home.chunk.dd4a3.legacy.js.map': 2136,
-	'route-home.chunk.6eaee.css': 112,
-	'route-home.chunk.6eaee.css.map': 224,
-
-	'route-profile.chunk.0d30e.js': 3198,
-	'route-profile.chunk.0d30e.js.map': 12743,
-	'route-profile.chunk.0d30e.legacy.js': 3335,
-	'route-profile.chunk.0d30e.legacy.js.map': 16137,
-	'route-profile.chunk.0af3e.css': 118,
-	'route-profile.chunk.0af3e.css.map': 231,
+	'routes-home.chunk.55be1.js': 348,
+	'routes-home.chunk.55be1.js.map': 1703,
+	'routes-home.chunk.55be1.legacy.js': 394,
+	'routes-home.chunk.55be1.legacy.js.map': 1991,
+	'routes-home.chunk.4c05c.css': 112,
+	'routes-home.chunk.4c05c.css.map': 224,
+
+	'routes-profile.chunk.e20b5.js': 743,
+	'routes-profile.chunk.e20b5.js.map': 3272,
+	'routes-profile.chunk.e20b5.legacy.js': 910,
+	'routes-profile.chunk.e20b5.legacy.js.map': 3931,
+	'routes-profile.chunk.0a57b.css': 118,
+	'routes-profile.chunk.0a57b.css.map': 231,
 };
 
 exports.prerender = {};

packages/cli/tests/lib/cli.js

@@ -28,6 +28,7 @@ const build = (exports.build = async function (cwd, options) {
 
 	await mkdir(join(cwd, 'node_modules'), { recursive: true }); // ensure exists, avoid exit()
 	await linkPackage('preact', cwd);
+	await linkPackage('preact-iso', cwd);
 	await linkPackage('preact-render-to-string', cwd);
 
 	let opts = Object.assign({ cwd }, argv, options);

packages/cli/tests/subjects/lazy-load-iso/a.css

@@ -0,0 +1,3 @@
+h1 {
+	color: red;
+}

packages/cli/tests/subjects/lazy-load-iso/a.js

@@ -0,0 +1,3 @@
+import './a.css';
+
+export default () => <h1>Lazy Load A</h1>;

packages/cli/tests/subjects/lazy-load-iso/b.css

@@ -0,0 +1,3 @@
+h1 {
+	color: blue;
+}

packages/cli/tests/subjects/lazy-load-iso/b.js

@@ -0,0 +1,3 @@
+import './b.css';
+
+export default () => <h1>Lazy Load B</h1>;

packages/cli/tests/subjects/lazy-load-iso/index.js

@@ -0,0 +1,19 @@
+import { LocationProvider, Router } from 'preact-iso/router';
+import { default as lazy, ErrorBoundary } from 'preact-iso/lazy';
+
+// Asynchronous, code-splitted:
+const A = lazy(() => import('./a.js'));
+const B = lazy(() => import('./b.js'));
+
+export default function App() {
+	return (
+		<LocationProvider>
+			<ErrorBoundary>
+				<Router>
+					<A path="/" />
+					<B path="/b" />
+				</Router>
+			</ErrorBoundary>
+		</LocationProvider>
+	);
+}

packages/cli/tests/subjects/lazy-load-iso/package.json

@@ -0,0 +1,4 @@
+{
+  "private": true,
+  "name": "preact-lazy-load-iso"
+}

packages/cli/tests/subjects/location-patch/index.js

@@ -1,16 +1,19 @@
 export default () => {
+	// Uses WHATWG URL API
+	// https://nodejs.org/api/url.html#the-whatwg-url-api
 	if (
-		location.protocol === undefined ||
-		location.slashes === undefined ||
-		location.auth === undefined ||
+		location.hash === undefined ||
 		location.host === undefined ||
-		location.port === undefined ||
 		location.hostname === undefined ||
-		location.hash === undefined ||
-		location.query === undefined ||
+		location.href === undefined ||
+		location.origin === undefined ||
+		location.password === undefined ||
 		location.pathname === undefined ||
-		location.path === undefined ||
-		location.href === undefined
+		location.port === undefined ||
+		location.protocol === undefined ||
+		location.search === undefined ||
+		location.searchParams === undefined ||
+		location.username === undefined
 	) {
 		throw new Error('Incomplete Location object');
 	}

packages/create-cli/src/commands/create.js

@@ -35,8 +35,10 @@ exports.create = async function createCommand(repo, dest, argv) {
 	if (!repo.includes('/')) {
 		repo = `preactjs-templates/${repo}`;
 
-		// TODO: Remove this after updating all templates
-		if (repo.endsWith('default') || repo.endsWith('typescript')) {
+		// TODO: This is an awful hack but necessary to test with
+		if (repo.endsWith('default')) {
+			repo += '#experimental/preact-iso';
+		} else if (repo.endsWith('typescript')) {
 			repo += '#next';
 		}
 	}