test: Proxy request in watch mode

packages/cli/tests/server.js

@@ -6,5 +6,10 @@ exports.getServer = (dir, port = 3000) => {
 		maxAge: 0,
 		single: true,
 	};
-	return polka().use(sirv(dir, opts)).listen(port);
+	return polka()
+		.use(sirv(dir, opts))
+		.get('/proxied/request', (_req, res) => {
+			res.end('Hello World!');
+		})
+		.listen(port);
 };

packages/cli/tests/subjects/proxy/index.js

@@ -0,0 +1,14 @@
+import { h } from 'preact';
+import { useEffect, useState } from 'preact/hooks';
+
+export default () => {
+	const [val, setVal] = useState('');
+
+	useEffect(() => {
+		fetch('/proxied/request')
+			.then(res => res.text())
+			.then(data => setVal(data));
+	}, []);
+
+	return <h1>Data retrieved from proxied server: {val}</h1>;
+};

packages/cli/tests/subjects/proxy/package.json

@@ -0,0 +1,5 @@
+{
+  "private": true,
+  "name": "preact-proxy",
+  "proxy": "http://localhost:8086"
+}

packages/cli/tests/watch.test.js

@@ -3,6 +3,8 @@ const { resolve } = require('path');
 const startChrome = require('./lib/chrome');
 const { create, watch } = require('./lib/cli');
 const { determinePort } = require('../lib/commands/watch');
+const { subject } = require('./lib/output');
+const { getServer } = require('./server');
 
 const { loadPage, waitUntilExpression } = startChrome;
 let chrome, server;
@@ -34,6 +36,23 @@ describe('preact', () => {
 
 		server.close();
 	});
+
+	it('should proxy requests when "proxy" exists in package.json', async () => {
+		const api = getServer('', 8086);
+		let app = await subject('proxy');
+
+		server = await watch(app, 8087);
+
+		let page = await loadPage(chrome, 'http://127.0.0.1:8087/');
+
+		await waitUntilExpression(
+			page,
+			`document.querySelector('h1').innerText === 'Data retrieved from proxied server: Hello World!'`
+		);
+
+		server.close();
+		api.server.close();
+	});
 });
 
 describe('should determine the correct port', () => {