From cce7bb94f6855473513f4b7eb1630413db09bf87 Mon Sep 17 00:00:00 2001
From: Ryan Christian <33403762+rschristian@users.noreply.github.com>
Date: Mon, 25 Jul 2022 02:01:20 -0500
Subject: [PATCH] Refactor/remove preact 8 support (#1716)

* refactor: Drops support for Preact v8

* docs: Adding changeset
---
 .changeset/cuddly-ducks-reply.md              |  6 ++++
 packages/async-loader/async-legacy.js         | 36 -------------------
 packages/async-loader/index.js                | 20 ++++-------
 packages/async-loader/legacy.js               |  8 -----
 packages/async-loader/package.json            |  3 +-
 packages/cli/lib/lib/webpack/utils.js         | 16 ---------
 .../lib/lib/webpack/webpack-base-config.js    |  8 ++---
 .../lib/lib/webpack/webpack-client-config.js  |  8 ++---
 packages/cli/tests/client.test.js             | 29 ---------------
 .../progressive-hydration-preact8/index.js    | 19 ----------
 .../package.json                              |  8 -----
 .../preact.config.js                          |  7 ----
 .../prerender-urls.json                       | 15 --------
 .../routes/home.js                            | 12 -------
 14 files changed, 19 insertions(+), 176 deletions(-)
 create mode 100644 .changeset/cuddly-ducks-reply.md
 delete mode 100644 packages/async-loader/async-legacy.js
 delete mode 100644 packages/async-loader/legacy.js
 delete mode 100644 packages/cli/lib/lib/webpack/utils.js
 delete mode 100644 packages/cli/tests/subjects/progressive-hydration-preact8/index.js
 delete mode 100644 packages/cli/tests/subjects/progressive-hydration-preact8/package.json
 delete mode 100644 packages/cli/tests/subjects/progressive-hydration-preact8/preact.config.js
 delete mode 100644 packages/cli/tests/subjects/progressive-hydration-preact8/prerender-urls.json
 delete mode 100644 packages/cli/tests/subjects/progressive-hydration-preact8/routes/home.js

diff --git a/.changeset/cuddly-ducks-reply.md b/.changeset/cuddly-ducks-reply.md
new file mode 100644
index 000000000..ff68b3d00
--- /dev/null
+++ b/.changeset/cuddly-ducks-reply.md
@@ -0,0 +1,6 @@
+---
+'@preact/async-loader': major
+'preact-cli': major
+---
+
+Drops support for Preact v8
diff --git a/packages/async-loader/async-legacy.js b/packages/async-loader/async-legacy.js
deleted file mode 100644
index a408d1273..000000000
--- a/packages/async-loader/async-legacy.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import { h, Component } from 'preact';
-
-export default function (req) {
-	function Async() {
-		Component.call(this);
-
-		let b, old;
-		this.componentWillMount = () => {
-			b = this.base = this.nextBase || this.__b; // short circuits 1st render
-			req(m => {
-				this.setState({ child: m.default || m });
-			});
-		};
-
-		this.shouldComponentUpdate = (_, nxt) => {
-			nxt = nxt.child === void 0;
-			if (nxt && old === void 0 && b) {
-				// Node.TEXT_NODE
-				if (b.nodeType === 3) {
-					old = b.data;
-				} else {
-					old = h(b.nodeName, {
-						dangerouslySetInnerHTML: { __html: b.innerHTML },
-					});
-				}
-			} else {
-				old = ''; // dump it
-			}
-			return !nxt;
-		};
-
-		this.render = (p, s) => (s.child ? h(s.child, p) : old);
-	}
-	(Async.prototype = new Component()).constructor = Async;
-	return Async;
-}
diff --git a/packages/async-loader/index.js b/packages/async-loader/index.js
index cd8762578..e0da40570 100644
--- a/packages/async-loader/index.js
+++ b/packages/async-loader/index.js
@@ -1,11 +1,9 @@
 const path = require('path');
-const { getOptions, stringifyRequest } = require('loader-utils');
-const PREACT_LEGACY_MODE = 'PREACT_LEGACY_MODE';
 
-exports.pitch = function (req, mode) {
+exports.pitch = function (req) {
 	this.cacheable && this.cacheable();
 	let name;
-	let query = getOptions(this) || {};
+	let query = this.getOptions() || {};
 	let routeName =
 		typeof query.name === 'function' ? query.name(this.resourcePath) : null;
 
@@ -19,17 +17,15 @@ exports.pitch = function (req, mode) {
 
 	// import Async from '${path.relative(process.cwd(), path.resolve(__dirname, 'async-component.js'))}';
 	return `
-		import Async from ${stringifyRequest(
-			this,
-			path.resolve(
-				__dirname,
-				mode === PREACT_LEGACY_MODE ? 'async-legacy.js' : 'async.js'
-			) // explicit value check because webpack sends 2nd argument values but we dont use it
+		import Async from ${JSON.stringify(
+			this.utils.contextify(this.context, path.resolve(__dirname, 'async.js'))
 		)};
 
 		function load(cb) {
 			require.ensure([], function (require) {
-				var result = require(${stringifyRequest(this, '!!' + req)});
+				var result = require(${JSON.stringify(
+					this.utils.contextify(this.context, '!!' + req)
+				)});
 				typeof cb === 'function' && cb(result);
 			}${name ? ', ' + JSON.stringify(name) : ''});
 		}
@@ -37,5 +33,3 @@ exports.pitch = function (req, mode) {
 		export default Async(load);
 	`;
 };
-
-exports.PREACT_LEGACY_MODE = PREACT_LEGACY_MODE;
diff --git a/packages/async-loader/legacy.js b/packages/async-loader/legacy.js
deleted file mode 100644
index f77d66c84..000000000
--- a/packages/async-loader/legacy.js
+++ /dev/null
@@ -1,8 +0,0 @@
-const { pitch, PREACT_LEGACY_MODE } = require('.');
-const { info } = require('./utils');
-
-info('Detected Preact 8, Loading legacy async-component');
-
-exports.pitch = function (req) {
-	return pitch(req, PREACT_LEGACY_MODE);
-};
diff --git a/packages/async-loader/package.json b/packages/async-loader/package.json
index ada800699..9cac40f5c 100644
--- a/packages/async-loader/package.json
+++ b/packages/async-loader/package.json
@@ -18,8 +18,7 @@
     "node": ">=8"
   },
   "dependencies": {
-    "kleur": "^4.1.4",
-    "loader-utils": "^2.0.0"
+    "kleur": "^4.1.4"
   },
   "peerDependencies": {
     "preact": ">= 10.0.0"
diff --git a/packages/cli/lib/lib/webpack/utils.js b/packages/cli/lib/lib/webpack/utils.js
deleted file mode 100644
index 20dcccf4a..000000000
--- a/packages/cli/lib/lib/webpack/utils.js
+++ /dev/null
@@ -1,16 +0,0 @@
-function isInstalledVersionPreactXOrAbove(cwd) {
-	try {
-		return (
-			parseInt(
-				require(require.resolve('preact/package.json', { paths: [cwd] }))
-					.version,
-				10
-			) >= 10
-		);
-	} catch (e) {}
-	return false;
-}
-
-module.exports = {
-	isInstalledVersionPreactXOrAbove,
-};
diff --git a/packages/cli/lib/lib/webpack/webpack-base-config.js b/packages/cli/lib/lib/webpack/webpack-base-config.js
index eff39245f..b8716c53a 100644
--- a/packages/cli/lib/lib/webpack/webpack-base-config.js
+++ b/packages/cli/lib/lib/webpack/webpack-base-config.js
@@ -2,7 +2,6 @@ const webpack = require('webpack');
 const path = require('path');
 const { resolve, dirname } = require('path');
 const { readFileSync, existsSync } = require('fs');
-const { isInstalledVersionPreactXOrAbove } = require('./utils');
 const autoprefixer = require('autoprefixer');
 const browserslist = require('browserslist');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
@@ -64,7 +63,6 @@ function getSassConfiguration(...includePaths) {
  */
 module.exports = function createBaseConfig(env) {
 	const { cwd, isProd, src, source } = env;
-	const IS_SOURCE_PREACT_X_OR_ABOVE = isInstalledVersionPreactXOrAbove(cwd);
 	// Apply base-level `env` values
 	env.dest = resolve(cwd, env.dest || 'build');
 	env.manifest = readJson(source('manifest.json')) || {};
@@ -142,9 +140,9 @@ module.exports = function createBaseConfig(env) {
 				'react-dom': compat,
 				'preact-compat': compat,
 				'react-addons-css-transition-group': 'preact-css-transition-group',
-				'preact-cli/async-component': IS_SOURCE_PREACT_X_OR_ABOVE
-					? require.resolve('@preact/async-loader/async')
-					: require.resolve('@preact/async-loader/async-legacy'),
+				'preact-cli/async-component': require.resolve(
+					'@preact/async-loader/async'
+				),
 			},
 		},
 
diff --git a/packages/cli/lib/lib/webpack/webpack-client-config.js b/packages/cli/lib/lib/webpack/webpack-client-config.js
index 30489de3e..8ab265da3 100644
--- a/packages/cli/lib/lib/webpack/webpack-client-config.js
+++ b/packages/cli/lib/lib/webpack/webpack-client-config.js
@@ -1,7 +1,6 @@
 const webpack = require('webpack');
 const { resolve, join } = require('path');
 const { existsSync } = require('fs');
-const { isInstalledVersionPreactXOrAbove } = require('./utils');
 const { merge } = require('webpack-merge');
 const { filter } = require('minimatch');
 const SizePlugin = require('size-plugin');
@@ -29,11 +28,8 @@ const cleanFilename = name =>
  * @returns {Promise<import('webpack').Configuration>}
  */
 async function clientConfig(env) {
-	const { source, src, cwd } = env;
-	const IS_SOURCE_PREACT_X_OR_ABOVE = isInstalledVersionPreactXOrAbove(cwd);
-	const asyncLoader = IS_SOURCE_PREACT_X_OR_ABOVE
-		? require.resolve('@preact/async-loader')
-		: require.resolve('@preact/async-loader/legacy');
+	const { source, src } = env;
+	const asyncLoader = require.resolve('@preact/async-loader');
 
 	let entry = {
 		bundle: resolve(__dirname, './../entry'),
diff --git a/packages/cli/tests/client.test.js b/packages/cli/tests/client.test.js
index 5a946d19e..664c06ae0 100644
--- a/packages/cli/tests/client.test.js
+++ b/packages/cli/tests/client.test.js
@@ -22,35 +22,6 @@ describe('client-side tests', () => {
 		PORT = await getPort();
 	});
 
-	//it('should hydrate routes progressively with preact8.', async () => {
-	//	let dir = await subject('progressive-hydration-preact8');
-	//	await build(dir, {}, true);
-	//	const server = getServer(join(dir, 'build'), PORT);
-
-	//	// let page = await loadPage(chrome, `http://127.0.0.1:${PORT}/`);
-	//	const page = await chrome.newPage();
-
-	//	page.on('console', consoleMessage => {
-	//		// eslint-disable-next-line
-	//		console[consoleMessage.type()](consoleMessage.text());
-	//	});
-
-	//	await page.goto(`http://127.0.0.1:${PORT}/`);
-
-	//	// await waitUntilExpression(page, `window.booted`);
-	//	await sleep(500);
-
-	//	const mutations = await page.evaluate('window.ROOT_MUTATION_COUNT');
-
-	//	expect(mutations).toEqual(0);
-
-	//	expect(await page.evaluate('window.CHANGED_VAR')).toEqual(undefined);
-	//	await page.click('button');
-	//	expect(await page.evaluate('window.CHANGED_VAR')).toEqual(1);
-
-	//	server.server.close();
-	//});
-
 	it('should hydrate for pre-rendered URLs only', async () => {
 		let dir = await subject('prerendering-hydration');
 		await build(dir, {});
diff --git a/packages/cli/tests/subjects/progressive-hydration-preact8/index.js b/packages/cli/tests/subjects/progressive-hydration-preact8/index.js
deleted file mode 100644
index ed8f7111e..000000000
--- a/packages/cli/tests/subjects/progressive-hydration-preact8/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import Home from './routes/home';
-
-if (typeof window !== 'undefined') {
-	window.ROOT_MUTATION_COUNT = 0;
-	const root = document.querySelector('#app');
-	const old = root.removeChild;
-	root.removeChild = child => {
-		window.ROOT_MUTATION_COUNT++;
-		old.call(this, child);
-	};
-}
-
-export default function App() {
-	return (
-		<div id="app">
-			<Home url="/" />
-		</div>
-	);
-}
diff --git a/packages/cli/tests/subjects/progressive-hydration-preact8/package.json b/packages/cli/tests/subjects/progressive-hydration-preact8/package.json
deleted file mode 100644
index ba6ec7590..000000000
--- a/packages/cli/tests/subjects/progressive-hydration-preact8/package.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
-  "private": true,
-  "name": "preact-prerendering-hydration-preact8",
-  "dependencies": {
-    "preact": "8.5.3",
-    "preact-render-to-string": "4.1.0"
-  }
-}
diff --git a/packages/cli/tests/subjects/progressive-hydration-preact8/preact.config.js b/packages/cli/tests/subjects/progressive-hydration-preact8/preact.config.js
deleted file mode 100644
index 35aadbdc8..000000000
--- a/packages/cli/tests/subjects/progressive-hydration-preact8/preact.config.js
+++ /dev/null
@@ -1,7 +0,0 @@
-module.exports = function (config) {
-	const modules = config.resolve.modules;
-	if (modules[0] === 'node_modules') {
-		modules.splice(0, 1);
-		modules.push('node_modules');
-	}
-};
diff --git a/packages/cli/tests/subjects/progressive-hydration-preact8/prerender-urls.json b/packages/cli/tests/subjects/progressive-hydration-preact8/prerender-urls.json
deleted file mode 100644
index 7d52bcdaf..000000000
--- a/packages/cli/tests/subjects/progressive-hydration-preact8/prerender-urls.json
+++ /dev/null
@@ -1,15 +0,0 @@
-[
-	{
-		"url": "/",
-		"title": "Home"
-	},
-	{
-		"url": "/route66",
-		"title": "Route66"
-	},
-	{
-		"url": "/custom",
-		"title": "Custom",
-		"myProp": "It worked!"
-	}
-]
diff --git a/packages/cli/tests/subjects/progressive-hydration-preact8/routes/home.js b/packages/cli/tests/subjects/progressive-hydration-preact8/routes/home.js
deleted file mode 100644
index ec7699737..000000000
--- a/packages/cli/tests/subjects/progressive-hydration-preact8/routes/home.js
+++ /dev/null
@@ -1,12 +0,0 @@
-export default ({ url }) => (
-	<div>
-		Home {url}{' '}
-		<button
-			onClick={() => {
-				window.CHANGED_VAR = 1;
-			}}
-		>
-			Change Val
-		</button>
-	</div>
-);