From ae8c523854700d63baca335312ccc55df4bfbc42 Mon Sep 17 00:00:00 2001 From: Nitin Kumar Date: Tue, 17 Aug 2021 17:58:27 +0530 Subject: [PATCH] test: add e2e test for universal compiler (#3656) --- .../universal-compiler.test.js.snap.webpack4 | 9 ++ .../universal-compiler.test.js.snap.webpack5 | 9 ++ test/e2e/api.test.js | 6 +- test/e2e/entry.test.js | 9 -- test/e2e/hot-and-live-reload.test.js | 1 - test/e2e/ipc.test.js | 2 - test/e2e/logging.test.js | 1 - test/e2e/multi-compiler.test.js | 1 - test/e2e/overlay.test.js | 18 ---- test/e2e/progress.test.js | 1 - test/e2e/stats.test.js | 1 - test/e2e/target.test.js | 1 - test/e2e/universal-compiler.test.js | 101 ++++++++++++++++++ test/e2e/web-socket-communication.test.js | 4 - test/integration/UniversalCompiler.test.js | 50 --------- 15 files changed, 122 insertions(+), 92 deletions(-) create mode 100644 test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack4 create mode 100644 test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack5 create mode 100644 test/e2e/universal-compiler.test.js delete mode 100644 test/integration/UniversalCompiler.test.js diff --git a/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack4 b/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack4 new file mode 100644 index 0000000000..dabed81dab --- /dev/null +++ b/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack4 @@ -0,0 +1,9 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Universal compiler client bundle should have the inlined the client runtime: console messages 1`] = `Array []`; + +exports[`Universal compiler client bundle should have the inlined the client runtime: page errors 1`] = `Array []`; + +exports[`Universal compiler server bundle should NOT have the inlined the client runtime: console messages 1`] = `Array []`; + +exports[`Universal compiler server bundle should NOT have the inlined the client runtime: page errors 1`] = `Array []`; diff --git a/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack5 b/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack5 new file mode 100644 index 0000000000..dabed81dab --- /dev/null +++ b/test/e2e/__snapshots__/universal-compiler.test.js.snap.webpack5 @@ -0,0 +1,9 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Universal compiler client bundle should have the inlined the client runtime: console messages 1`] = `Array []`; + +exports[`Universal compiler client bundle should have the inlined the client runtime: page errors 1`] = `Array []`; + +exports[`Universal compiler server bundle should NOT have the inlined the client runtime: console messages 1`] = `Array []`; + +exports[`Universal compiler server bundle should NOT have the inlined the client runtime: page errors 1`] = `Array []`; diff --git a/test/e2e/api.test.js b/test/e2e/api.test.js index 14a6e61bee..d693dbc382 100644 --- a/test/e2e/api.test.js +++ b/test/e2e/api.test.js @@ -9,7 +9,7 @@ const port = require("../ports-map").api; describe("API", () => { it(`should work with async API`, async () => { const compiler = webpack(config); - const server = new Server({ host: "127.0.0.1", port }, compiler); + const server = new Server({ port }, compiler); await server.start(); @@ -41,7 +41,7 @@ describe("API", () => { it(`should work with callback API`, async () => { const compiler = webpack(config); - const server = new Server({ host: "127.0.0.1", port }, compiler); + const server = new Server({ port }, compiler); await new Promise((resolve) => { server.startCallback(() => { @@ -81,7 +81,7 @@ describe("API", () => { it(`should work with deprecated API`, async () => { const compiler = webpack(config); - const devServerOptions = { host: "127.0.0.1", port }; + const devServerOptions = { port }; const server = new Server(devServerOptions, compiler); await new Promise((resolve, reject) => { diff --git a/test/e2e/entry.test.js b/test/e2e/entry.test.js index 90066ace6f..92671d0a7d 100644 --- a/test/e2e/entry.test.js +++ b/test/e2e/entry.test.js @@ -43,7 +43,6 @@ describe("entry", () => { it("should work with single entry", async () => { const compiler = webpack({ ...config, entry: entryFirst }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -79,7 +78,6 @@ describe("entry", () => { it("should work with single array entry", async () => { const compiler = webpack({ ...config, entry: [entryFirst, entrySecond] }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -120,7 +118,6 @@ describe("entry", () => { }, }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -156,7 +153,6 @@ describe("entry", () => { it("should work with dynamic entry", async () => { const compiler = webpack({ ...config, entry: () => entryFirst }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -195,7 +191,6 @@ describe("entry", () => { entry: () => new Promise((resolve) => resolve([entryFirst])), }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -242,7 +237,6 @@ describe("entry", () => { }, }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -290,7 +284,6 @@ describe("entry", () => { }, }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -337,7 +330,6 @@ describe("entry", () => { }, }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); @@ -384,7 +376,6 @@ describe("entry", () => { }).apply(compiler); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); diff --git a/test/e2e/hot-and-live-reload.test.js b/test/e2e/hot-and-live-reload.test.js index b8f786d35a..7066898b5b 100644 --- a/test/e2e/hot-and-live-reload.test.js +++ b/test/e2e/hot-and-live-reload.test.js @@ -286,7 +286,6 @@ describe("hot and live reload", () => { const compiler = webpack(webpackOptions); const testDevServerOptions = mode.options || {}; const devServerOptions = { - host: "0.0.0.0", port, ...testDevServerOptions, }; diff --git a/test/e2e/ipc.test.js b/test/e2e/ipc.test.js index 82c13cd720..8f590e938b 100644 --- a/test/e2e/ipc.test.js +++ b/test/e2e/ipc.test.js @@ -25,7 +25,6 @@ describe("web socket server URL", () => { const compiler = webpack(config); const devServerOptions = { webSocketServer, - host: devServerHost, ipc: true, }; const server = new Server(devServerOptions, compiler); @@ -118,7 +117,6 @@ describe("web socket server URL", () => { const compiler = webpack(config); const devServerOptions = { webSocketServer, - host: devServerHost, ipc, }; const server = new Server(devServerOptions, compiler); diff --git a/test/e2e/logging.test.js b/test/e2e/logging.test.js index 3d3fdc27ce..e7b7f8f34e 100644 --- a/test/e2e/logging.test.js +++ b/test/e2e/logging.test.js @@ -190,7 +190,6 @@ describe("logging", () => { })`, async () => { const compiler = webpack({ ...config, ...testCase.webpackOptions }); const devServerOptions = { - host: "0.0.0.0", port, ...testCase.devServerOptions, }; diff --git a/test/e2e/multi-compiler.test.js b/test/e2e/multi-compiler.test.js index 4567b75ce1..76d06309cb 100644 --- a/test/e2e/multi-compiler.test.js +++ b/test/e2e/multi-compiler.test.js @@ -10,7 +10,6 @@ describe("Multi compiler", () => { it(`should work with multiple compilers`, async () => { const compiler = webpack(config); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); diff --git a/test/e2e/overlay.test.js b/test/e2e/overlay.test.js index 18e9e7fce5..e55da085fe 100644 --- a/test/e2e/overlay.test.js +++ b/test/e2e/overlay.test.js @@ -49,7 +49,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -86,7 +85,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -127,7 +125,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -166,7 +163,6 @@ describe("overlay", () => { ); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -204,7 +200,6 @@ describe("overlay", () => { new ErrorPlugin("strong").apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -238,7 +233,6 @@ describe("overlay", () => { it("should not show initially, then show on an error, then hide on fix", async () => { const compiler = webpack(config); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -305,7 +299,6 @@ describe("overlay", () => { it("should not show initially, then show on an error, then show other error, then hide on fix", async () => { const compiler = webpack(config); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -392,7 +385,6 @@ describe("overlay", () => { it("should not show initially, then show on an error and allow to close", async () => { const compiler = webpack(config); const devServerOptions = { - host: "0.0.0.0", port, }; const server = new Server(devServerOptions, compiler); @@ -470,7 +462,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: false, @@ -504,7 +495,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { @@ -540,7 +530,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: true, @@ -580,7 +569,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { @@ -622,7 +610,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { @@ -664,7 +651,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: false, @@ -698,7 +684,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { @@ -734,7 +719,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: true, @@ -774,7 +758,6 @@ describe("overlay", () => { new ErrorPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { @@ -816,7 +799,6 @@ describe("overlay", () => { new WarningPlugin().apply(compiler); const devServerOptions = { - host: "0.0.0.0", port, client: { overlay: { diff --git a/test/e2e/progress.test.js b/test/e2e/progress.test.js index 06e4fbfb3f..c8bd283630 100644 --- a/test/e2e/progress.test.js +++ b/test/e2e/progress.test.js @@ -20,7 +20,6 @@ describe("progress", () => { const compiler = webpack(reloadConfig); const devServerOptions = { port, - host: "0.0.0.0", static: false, hot: true, client: { diff --git a/test/e2e/stats.test.js b/test/e2e/stats.test.js index 834b1936e8..5e4e32d511 100644 --- a/test/e2e/stats.test.js +++ b/test/e2e/stats.test.js @@ -109,7 +109,6 @@ describe("stats", () => { it(testCase.title, async () => { const compiler = webpack({ ...config, ...testCase.webpackOptions }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); diff --git a/test/e2e/target.test.js b/test/e2e/target.test.js index 7eec0df0c4..e73efb760b 100644 --- a/test/e2e/target.test.js +++ b/test/e2e/target.test.js @@ -47,7 +47,6 @@ describe("target", () => { : {}), }); const devServerOptions = { - host: "127.0.0.1", port, }; const server = new Server(devServerOptions, compiler); diff --git a/test/e2e/universal-compiler.test.js b/test/e2e/universal-compiler.test.js new file mode 100644 index 0000000000..2e33cc888b --- /dev/null +++ b/test/e2e/universal-compiler.test.js @@ -0,0 +1,101 @@ +"use strict"; + +const webpack = require("webpack"); +const Server = require("../../lib/Server"); +const config = require("../fixtures/universal-compiler-config/webpack.config"); +const runBrowser = require("../helpers/run-browser"); +const port = require("../ports-map")["universal-compiler"]; + +describe("Universal compiler", () => { + it("client bundle should have the inlined the client runtime", async () => { + const compiler = webpack(config); + const devServerOptions = { + port, + }; + const server = new Server(devServerOptions, compiler); + + await server.start(); + + const { page, browser } = await runBrowser(); + + const pageErrors = []; + const consoleMessages = []; + + page + .on("console", (message) => { + consoleMessages.push(message); + }) + .on("pageerror", (error) => { + pageErrors.push(error); + }); + + await page.goto(`http://127.0.0.1:${port}/client.js`, { + waitUntil: "networkidle0", + }); + + const bodyHandle = await page.$("body"); + const htmlContent = await page.evaluate( + (body) => body.innerHTML, + bodyHandle + ); + + expect(htmlContent).toContain("Hello from the client"); + expect(htmlContent).toContain("WebsocketClient"); + + expect(consoleMessages.map((message) => message.text())).toMatchSnapshot( + "console messages" + ); + + expect(pageErrors).toMatchSnapshot("page errors"); + + await browser.close(); + await server.close(); + }); + + it("server bundle should NOT have the inlined the client runtime", async () => { + // we wouldn't normally request a server bundle + // but we'll do it here to check the contents + const compiler = webpack(config); + const devServerOptions = { + port, + }; + const server = new Server(devServerOptions, compiler); + + await server.start(); + + const { page, browser } = await runBrowser(); + + const pageErrors = []; + const consoleMessages = []; + + page + .on("console", (message) => { + consoleMessages.push(message); + }) + .on("pageerror", (error) => { + pageErrors.push(error); + }); + + await page.goto(`http://127.0.0.1:${port}/server.js`, { + waitUntil: "networkidle0", + }); + + const bodyHandle = await page.$("body"); + const htmlContent = await page.evaluate( + (body) => body.innerHTML, + bodyHandle + ); + + expect(htmlContent).toContain("Hello from the server"); + expect(htmlContent).not.toContain("WebsocketServer"); + + expect(consoleMessages.map((message) => message.text())).toMatchSnapshot( + "console messages" + ); + + expect(pageErrors).toMatchSnapshot("page errors"); + + await browser.close(); + await server.close(); + }); +}); diff --git a/test/e2e/web-socket-communication.test.js b/test/e2e/web-socket-communication.test.js index b5877900f3..5f841427f6 100644 --- a/test/e2e/web-socket-communication.test.js +++ b/test/e2e/web-socket-communication.test.js @@ -19,7 +19,6 @@ describe("web socket communication", () => { const compiler = webpack(config); const devServerOptions = { - host: "127.0.0.1", port, webSocketServer: websocketServer, }; @@ -67,7 +66,6 @@ describe("web socket communication", () => { const compiler = webpack(config); const devServerOptions = { - host: "127.0.0.1", port, webSocketServer: websocketServer, }; @@ -114,7 +112,6 @@ describe("web socket communication", () => { const compiler = webpack(config); const devServerOptions = { - host: "127.0.0.1", port, webSocketServer: websocketServer, }; @@ -161,7 +158,6 @@ describe("web socket communication", () => { const compiler = webpack(config); const devServerOptions = { - host: "127.0.0.1", port, webSocketServer: "ws", }; diff --git a/test/integration/UniversalCompiler.test.js b/test/integration/UniversalCompiler.test.js deleted file mode 100644 index 5db6e700ea..0000000000 --- a/test/integration/UniversalCompiler.test.js +++ /dev/null @@ -1,50 +0,0 @@ -"use strict"; - -const webpack = require("webpack"); -const request = require("supertest"); -const Server = require("../../lib/Server"); -const config = require("../fixtures/universal-compiler-config/webpack.config"); -const port = require("../ports-map")["universal-compiler"]; - -describe("universal compiler", () => { - let server; - let req; - - beforeAll(async () => { - const compiler = webpack(config); - - server = new Server({ port }, compiler); - - await server.start(); - - req = request(server.app); - }); - - afterAll(async () => { - await server.stop(); - }); - - it("client bundle should have the inlined the client runtime", async () => { - const response = await req.get("/client.js"); - - expect(response.headers["content-type"]).toEqual( - "application/javascript; charset=utf-8" - ); - expect(response.status).toEqual(200); - expect(response.text).toContain("Hello from the client"); - expect(response.text).toContain("WebsocketClient"); - }); - - it("server bundle should NOT have the inlined the client runtime", async () => { - // we wouldn't normally request a server bundle - // but we'll do it here to check the contents - const response = await req.get("/server.js"); - - expect(response.headers["content-type"]).toEqual( - "application/javascript; charset=utf-8" - ); - expect(response.status).toEqual(200); - expect(response.text).toContain("Hello from the server"); - expect(response.text).not.toContain("WebsocketClient"); - }); -});