From 1e7a9992f694ad3bb3d9f68c3145e01d9cb201b4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alvaro=20Mouri=C3=B1o?= <alvaro@mourino.net>
Date: Fri, 28 May 2021 11:30:21 +0200
Subject: [PATCH] Introduce custom hooks

They are useful for other plugins to tap into certain points of the
build process. In this case a `devServerRunning` hook is introduced,
which would allow a 3rd party plugin to, for example, display a QR code
with the address the app is running on once the dev server started.
---
 packages/cli/lib/lib/webpack/hooks.js       |  5 ++++
 packages/cli/lib/lib/webpack/run-webpack.js |  2 ++
 packages/cli/tests/hooks.test.js            | 32 +++++++++++++++++++++
 packages/cli/tests/lib/utils.js             |  2 ++
 4 files changed, 41 insertions(+)
 create mode 100644 packages/cli/lib/lib/webpack/hooks.js
 create mode 100644 packages/cli/tests/hooks.test.js

diff --git a/packages/cli/lib/lib/webpack/hooks.js b/packages/cli/lib/lib/webpack/hooks.js
new file mode 100644
index 000000000..f90a3f9c6
--- /dev/null
+++ b/packages/cli/lib/lib/webpack/hooks.js
@@ -0,0 +1,5 @@
+const SyncHook = require('tapable').SyncHook;
+
+module.exports = {
+	devServerRunning: new SyncHook(),
+};
diff --git a/packages/cli/lib/lib/webpack/run-webpack.js b/packages/cli/lib/lib/webpack/run-webpack.js
index d8818ebb7..3222c61ca 100644
--- a/packages/cli/lib/lib/webpack/run-webpack.js
+++ b/packages/cli/lib/lib/webpack/run-webpack.js
@@ -10,6 +10,7 @@ const clientConfig = require('./webpack-client-config');
 const serverConfig = require('./webpack-server-config');
 const transformConfig = require('./transform-config');
 const { error, isDir, warn } = require('../../util');
+const { devServerRunning } = require('./hooks');
 
 async function devBuild(env) {
 	let userPort = parseInt(process.env.PORT || env.port, 10) || 8080;
@@ -68,6 +69,7 @@ async function devBuild(env) {
 			}
 
 			showStats(stats, false);
+			devServerRunning.call();
 		});
 
 		compiler.hooks.failed.tap('CliDevPlugin', rej);
diff --git a/packages/cli/tests/hooks.test.js b/packages/cli/tests/hooks.test.js
new file mode 100644
index 000000000..971b4ad0b
--- /dev/null
+++ b/packages/cli/tests/hooks.test.js
@@ -0,0 +1,32 @@
+const { create, watch } = require('./lib/cli');
+const { hooks } = require('./lib/utils');
+
+describe('preact', () => {
+	let intervalId;
+
+	afterEach(() => {
+		clearInterval(intervalId);
+		intervalId = null;
+	});
+
+	it('should emit a devServerRunning event after the server starts', (done) => {
+		let hookCalled;
+		hooks.devServerRunning.tap('TestPlugin', () => {
+			hookCalled = true;
+		});
+
+		create('default').then((app) => {
+			watch(app, 8083).then((server) => {
+				// We need to wait not only for the server to start but also for the
+				// stats to be printed to stdout.
+				intervalId = setInterval(() => {
+					if (hookCalled) {
+						expect(hookCalled).toBe(true);
+						server.close();
+						done();
+					}
+				}, 1000);
+			});
+		});
+	});
+});
diff --git a/packages/cli/tests/lib/utils.js b/packages/cli/tests/lib/utils.js
index fe2a43ee2..ab98bf8f1 100644
--- a/packages/cli/tests/lib/utils.js
+++ b/packages/cli/tests/lib/utils.js
@@ -5,6 +5,7 @@ const minimatch = require('minimatch');
 const pRetry = require('p-retry');
 const { promisify } = require('util');
 const glob = promisify(require('glob').glob);
+const hooks = require('../../lib/lib/webpack/hooks');
 
 const PER = 0.05; // % diff
 const LOG = !!process.env.WITH_LOG;
@@ -68,4 +69,5 @@ module.exports = {
 	sleep,
 	hasKey,
 	isWithin,
+	hooks,
 };