feat(tasks/e2e): transformer + minifier runtime tests for popular npm packages (#8552)

Code extracted from
https://github.com/privatenumber/minification-benchmarks

.github/workflows/ci.yml

@@ -314,9 +314,9 @@ jobs:
           cache-key: warm
       - uses: ./.github/actions/pnpm
         if: steps.filter.outputs.src == 'true'
-      - run: pnpm run build-dev
-        if: steps.filter.outputs.src == 'true'
-      - run: pnpm run test
-        if: steps.filter.outputs.src == 'true'
-      - run: git diff --exit-code # Must commit everything
-        if: steps.filter.outputs.src == 'true'
+      - if: steps.filter.outputs.src == 'true'
+        run: |
+          pnpm run build-dev
+          pnpm run test
+          pnpm --filter e2e run test
+          git diff --exit-code # Must commit everything

.gitignore

@@ -12,6 +12,7 @@ target/
 /tasks/benchmark/codspeed/node_modules/
 /tasks/transform_conformance/node_modules/
 /tasks/compat_data/node_modules/
+/tasks/e2e/node_modules/
 /npm/*/node_modules
 
 # vscode

Cargo.toml

@@ -1,7 +1,7 @@
 [workspace]
 resolver = "2"
 members = ["apps/*", "crates/*", "napi/*", "tasks/*", "wasm/*"]
-exclude = ["tasks/lint_rules"]
+exclude = ["tasks/lint_rules", "tasks/e2e"]
 
 [workspace.package]
 authors = ["Boshen <boshenc@gmail.com>", "Oxc contributors"]

pnpm-workspace.yaml

@@ -6,6 +6,7 @@ packages:
   - 'tasks/benchmark/codspeed'
   - 'tasks/transform_conformance'
   - 'tasks/compat_data'
+  - 'tasks/e2e'
 
 catalog:
   "@napi-rs/cli": 3.0.0-alpha.65

tasks/e2e/README.md

@@ -0,0 +1,8 @@
+# End to End Integration Tests
+
+Node.js runtime tests for transformer and minifier.
+
+```
+pnpm run build-dev
+pnpm run test
+```

tasks/e2e/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "e2e",
+  "private": true,
+  "scripts": {
+    "build": "pnpm -w run build-dev",
+    "test": "vitest run ./test"
+  },
+  "devDependencies": {
+    "@oxc-minify/binding": "workspace:^",
+    "@oxc-transform/binding": "workspace:^",
+    "antd": "^5.23.1",
+    "fs-require": "^1.6.0",
+    "memfs": "^4.17.0",
+    "react": "^19.0.0",
+    "terser": "^5.37.0",
+    "vue": "^3.5.13"
+  }
+}

tasks/e2e/test/e2e.test.ts

@@ -0,0 +1,28 @@
+import { createElement } from 'react';
+import { describe, expect, test } from 'vitest';
+
+import { getModules } from './utils';
+
+const info = '$type $options';
+
+describe('react', () => {
+  const modules = getModules('react/cjs/', 'react.development.js');
+  test.each(modules)(info, ({ module: React }) => {
+    expect(React.createElement('div', null, 'rendered').type).toBe('div');
+  });
+});
+
+describe('vue', () => {
+  const modules = getModules('vue/dist/', 'vue.cjs.js');
+  test.each(modules)(info, ({ module: Vue }) => {
+    expect(Vue.createApp()).toBeDefined();
+  });
+});
+
+describe('antd', () => {
+  const modules = getModules('antd/dist/', 'antd.js');
+  test.each(modules)(info, ({ module: Antd }) => {
+    const e = createElement(Antd.Button, null);
+    expect(e.type.__ANT_BUTTON).toBe(true);
+  });
+});

tasks/e2e/test/utils.ts

@@ -0,0 +1,47 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+import { minify as oxcMinify } from '@oxc-minify/binding';
+import { transform as oxcTransform } from '@oxc-transform/binding';
+import { createFsRequire } from 'fs-require';
+import { Volume } from 'memfs';
+
+const nodeModulesPath = new URL('../node_modules', import.meta.url).pathname;
+
+const minifyOptions: any[] = [
+  { compress: true, mangle: true, codegen: { whitespace: true } },
+  { compress: true, mangle: true, codegen: { whitespace: true } },
+].map((o) => ({ type: 'minify', ...o }));
+
+const transformOptions: any[] = [
+  { target: 'esnext' },
+  { target: 'es2024' },
+  { target: 'es2023' },
+  { target: 'es2022' },
+  { target: 'es2021' },
+  { target: 'es2020' },
+  { target: 'es2019' },
+  { target: 'es2018' },
+  { target: 'es2017' },
+  { target: 'es2016' },
+  { target: 'es2015' },
+].map((o) => ({ type: 'transform', ...o }));
+
+export function getModules(dir: string, fileName: string) {
+  const p = path.join(nodeModulesPath, dir + fileName);
+  const code = fs.readFileSync(p, 'utf8');
+  return minifyOptions.concat(transformOptions)
+    .map(({ type, ...options }) => {
+      const modifiedCode = {
+        minify: oxcMinify,
+        transform: oxcTransform,
+      }[type](fileName, code).code;
+      return { module: fsRequire(modifiedCode), type, options };
+    });
+}
+
+function fsRequire(code: string) {
+  const vol = Volume.fromJSON({ '/index.js': code });
+  const fsRequire = createFsRequire(vol);
+  return fsRequire('/index.js');
+}