feat: support Vite 5 (#45)

* Attempt at updating to vite 5

* Fix test

* Skip test on unsupported Node/Vite version combinations

* Lock playwright version

* Upgrade dependencies

* FORCE Upgrade dependencies

* Move dependencies to devDependencies

* Set yarn to ignore engines version check in CI

* yarn format

* Fix skipped tests on Node.js 14

---------

Co-authored-by: Menci <[email protected]>

.github/workflows/publish.yaml

@@ -13,7 +13,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
       - name: Install dependencies
         run: yarn --frozen-lockfile
       - name: Build

.github/workflows/test.yaml

@@ -17,6 +17,8 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node }}
+      - name: Set yarn to ignore engines version check
+        run: yarn config set ignore-engines true
       - name: Install dependencies
         run: yarn --frozen-lockfile
       - name: Build

e2e/e2e.ts

@@ -32,6 +32,11 @@ type VitePackages =
       vite: typeof import("./vite4/node_modules/vite");
       vitePluginLegacy: (typeof import("./vite4/node_modules/@vitejs/plugin-legacy"))["default"];
       vitePluginTopLevelAwait: (typeof import("./vite4/node_modules/vite-plugin-top-level-await"))["default"];
+    }
+  | {
+      vite: typeof import("./vite5/node_modules/vite");
+      vitePluginLegacy: (typeof import("./vite5/node_modules/@vitejs/plugin-legacy"))["default"];
+      vitePluginTopLevelAwait: (typeof import("./vite5/node_modules/vite-plugin-top-level-await"))["default"];
     };
 
 async function buildAndStartProdServer(
@@ -75,7 +80,7 @@ async function buildAndStartProdServer(
     if (filePath in bundle) {
       res.header("Access-Control-Allow-Origin", "*");
       res.header("Access-Control-Allow-Methods", "*");
-      const contentType = mime.lookup(filePath);
+      const contentType = mime.getType(filePath);
       const contentTypeWithEncoding = contentType + (contentType.includes("text/") ? "; charset=utf-8" : "");
       res.contentType(contentTypeWithEncoding);
       res.send(bundle[filePath]);
@@ -183,24 +188,30 @@ const runTestWithRetry = async (...args: Parameters<typeof runTest>) => {
   }
 };
 
-export function runTests(viteVersion: number, vitePackages: VitePackages) {
+export function runTests(viteVersion: number, importVitePackages: () => Promise<VitePackages>) {
   jest.setTimeout(60000);
 
   describe(`E2E test for Vite ${viteVersion}`, () => {
+    const nodeVersion = Number(process.versions.node.split(".")[0]);
+    if (viteVersion >= 5 && nodeVersion < 18) {
+      it(`vite ${viteVersion}: skipped on Node.js ${nodeVersion}`, async () => {});
+      return;
+    }
+
     it(`vite ${viteVersion}: should work on modern browser in Vite dev server`, async () => {
-      await runTestWithRetry(vitePackages, true, false, true);
+      await runTestWithRetry(await importVitePackages(), true, false, true);
     });
 
     it(`vite ${viteVersion}: should work on modern browser without top-level await transform`, async () => {
-      await runTestWithRetry(vitePackages, false, false, true);
+      await runTestWithRetry(await importVitePackages(), false, false, true);
     });
 
     it(`vite ${viteVersion}: should work on modern browser with top-level await transform`, async () => {
-      await runTestWithRetry(vitePackages, false, true, true);
+      await runTestWithRetry(await importVitePackages(), false, true, true);
     });
 
     it(`vite ${viteVersion}: should work on legacy browser`, async () => {
-      await runTestWithRetry(vitePackages, false, true, false);
+      await runTestWithRetry(await importVitePackages(), false, true, false);
     });
   });
 }

e2e/package.json

@@ -5,6 +5,6 @@
   "license": "MIT",
   "private": true,
   "scripts": {
-    "install": "yarn --cwd vite2 && yarn --cwd vite3 && yarn --cwd vite4"
+    "install": "yarn --cwd vite2 && yarn --cwd vite3 && yarn --cwd vite4 && yarn --cwd vite5"
   }
-}
+}

e2e/vite2/e2e-vite2.test.ts

@@ -1,11 +1,7 @@
-import * as vite from "vite";
-import { default as vitePluginLegacy } from "@vitejs/plugin-legacy";
-import { default as vitePluginTopLevelAwait } from "vite-plugin-top-level-await";
-
 import { runTests } from "../e2e";
 
-runTests(2, {
-  vite,
-  vitePluginLegacy,
-  vitePluginTopLevelAwait
-});
+runTests(2, async () => ({
+  vite: await import("vite"),
+  vitePluginLegacy: (await import("@vitejs/plugin-legacy")).default,
+  vitePluginTopLevelAwait: (await import("vite-plugin-top-level-await")).default
+}));

e2e/vite3/e2e-vite3.test.ts

@@ -1,11 +1,7 @@
-import * as vite from "vite";
-import { default as vitePluginLegacy } from "@vitejs/plugin-legacy";
-import { default as vitePluginTopLevelAwait } from "vite-plugin-top-level-await";
-
 import { runTests } from "../e2e";
 
-runTests(3, {
-  vite,
-  vitePluginLegacy,
-  vitePluginTopLevelAwait
-});
+runTests(3, async () => ({
+  vite: await import("vite"),
+  vitePluginLegacy: (await import("@vitejs/plugin-legacy")).default,
+  vitePluginTopLevelAwait: (await import("vite-plugin-top-level-await")).default
+}));

e2e/vite4/e2e-vite4.test.ts

@@ -1,11 +1,7 @@
-import * as vite from "vite";
-import { default as vitePluginLegacy } from "@vitejs/plugin-legacy";
-import { default as vitePluginTopLevelAwait } from "vite-plugin-top-level-await";
-
 import { runTests } from "../e2e";
 
-runTests(4, {
-  vite,
-  vitePluginLegacy,
-  vitePluginTopLevelAwait
-});
+runTests(4, async () => ({
+  vite: await import("vite"),
+  vitePluginLegacy: (await import("@vitejs/plugin-legacy")).default,
+  vitePluginTopLevelAwait: (await import("vite-plugin-top-level-await")).default
+}));

e2e/vite5/e2e-vite5.test.ts

@@ -0,0 +1,7 @@
+import { runTests } from "../e2e";
+
+runTests(5, async () => ({
+  vite: await import("vite"),
+  vitePluginLegacy: (await import("@vitejs/plugin-legacy")).default,
+  vitePluginTopLevelAwait: (await import("vite-plugin-top-level-await")).default
+}));

e2e/vite5/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "dependencies-vite5",
+  "version": "1.0.0",
+  "main": "index.js",
+  "license": "MIT",
+  "private": true,
+  "devDependencies": {
+    "@vitejs/plugin-legacy": "^5",
+    "vite": "5",
+    "vite-plugin-top-level-await": "^1.1.1"
+  }
+}