Update metadata test (#1024)

* remove pnp-webpack-plugin * rewrite metadata test * remove react-intl dev deps * remove unused fixtures
babel · Jul 10, 2024 · 943f412 · 943f412
1 parent 955e577
commit 943f412
Show file tree

Hide file tree

Showing 5 changed files with 93 additions and 470 deletions.
diff --git a/package.json b/package.json
@@ -24,18 +24,14 @@
     "@babel/eslint-parser": "^7.23.3",
     "@babel/preset-env": "^7.23.3",
     "ava": "^3.13.0",
-    "babel-plugin-react-intl": "^8.2.25",
     "c8": "^8.0.0",
     "eslint": "^8.45.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-prettier": "^5.0.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.3",
-    "pnp-webpack-plugin": "^1.7.0",
     "prettier": "^3.0.0",
     "react": "^17.0.1",
-    "react-intl": "^5.9.4",
-    "react-intl-webpack-plugin": "^0.3.0",
     "rimraf": "^5.0.1",
     "semver": "7.5.2",
     "webpack": "^5.89.0"

diff --git a/test/fixtures/metadata.js b/test/fixtures/metadata.js
diff --git a/test/fixtures/metadataErr.js b/test/fixtures/metadataErr.js
diff --git a/test/metadata.test.js b/test/metadata.test.js
@@ -1,41 +1,42 @@
 import test from "ava";
-import fs from "fs";
 import path from "path";
 import { rimraf } from "rimraf";
-import PnpWebpackPlugin from "pnp-webpack-plugin";
 import createTestDirectory from "./helpers/createTestDirectory.js";
 import { webpackAsync } from "./helpers/webpackAsync.js";
-import ReactIntlPlugin from "react-intl-webpack-plugin";
+import { NormalModule } from "webpack";
 
 const cacheDir = path.join(__dirname, "output/cache/cachefiles");
 const outputDir = path.join(__dirname, "output/metadata");
 const babelLoader = path.join(__dirname, "../lib");
-const globalConfig = {
-  mode: "development",
-  entry: "./test/fixtures/metadata.js",
-  output: {
-    path: outputDir,
-    filename: "[id].metadata.js",
-  },
-  plugins: [new ReactIntlPlugin()],
-  resolve: {
-    plugins: [PnpWebpackPlugin],
-  },
-  module: {
-    rules: [
-      {
-        test: /\.jsx?/,
-        loader: babelLoader,
-        options: {
-          metadataSubscribers: [ReactIntlPlugin.metadataContextFunctionName],
-          plugins: ["react-intl"],
-          presets: [],
-        },
-        exclude: /node_modules/,
+
+function babelMetadataProvierPlugin() {
+  return {
+    name: "babel-metadata-provider-plugin",
+    visitor: {
+      Program(_, pass) {
+        pass.file.metadata = { hello: "world" };
       },
-    ],
-  },
-};
+    },
+  };
+}
+
+class WebpackMetadataSubscriberPlugin {
+  static subscriber = Symbol("subscriber");
+  constructor(subscriberCallback) {
+    this.subscriberCallback = subscriberCallback;
+  }
+  apply(compiler) {
+    compiler.hooks.compilation.tap("plugin", compilation => {
+      NormalModule.getCompilationHooks(compilation).loader.tap(
+        "plugin",
+        context => {
+          context[WebpackMetadataSubscriberPlugin.subscriber] =
+            this.subscriberCallback;
+        },
+      );
+    });
+  }
+}
 
 // Create a separate directory for each test so that the tests
 // can run in parallel
@@ -46,94 +47,81 @@ test.beforeEach(async t => {
 
 test.afterEach(t => rimraf(t.context.directory));
 
-test("should pass metadata code snippet", async t => {
-  const config = Object.assign({}, globalConfig, {
-    output: {
-      path: t.context.directory,
-      filename: "[id].metadata.js",
-    },
-  });
-
-  const stats = await webpackAsync(config);
-  t.deepEqual(stats.compilation.errors, []);
-  t.deepEqual(stats.compilation.warnings, []);
-
-  const files = fs.readdirSync(t.context.directory);
-  t.true(files.length > 0);
+test("should obtain metadata from the transform result", async t => {
+  let actualMetadata;
 
-  const text = fs.readFileSync(
-    path.resolve(t.context.directory, "reactIntlMessages.json"),
-    "utf8",
-  );
-  const jsonText = JSON.parse(text);
-  t.true(jsonText.length == 1);
-  t.true(jsonText[0].id == "greetingId");
-  t.true(jsonText[0].defaultMessage == "Hello World!");
-});
-
-test("should not throw error", async t => {
-  const config = Object.assign({}, globalConfig, {
+  const config = {
+    mode: "development",
+    entry: "./test/fixtures/basic.js",
     output: {
       path: t.context.directory,
       filename: "[id].metadata.js",
     },
-  });
+    plugins: [
+      new WebpackMetadataSubscriberPlugin(
+        metadata => (actualMetadata = metadata),
+      ),
+    ],
+    module: {
+      rules: [
+        {
+          test: /\.js/,
+          loader: babelLoader,
+          options: {
+            metadataSubscribers: [WebpackMetadataSubscriberPlugin.subscriber],
+            plugins: [babelMetadataProvierPlugin],
+            babelrc: false,
+            configFile: false,
+          },
+          exclude: /node_modules/,
+        },
+      ],
+    },
+  };
 
   const stats = await webpackAsync(config);
   t.deepEqual(stats.compilation.errors, []);
   t.deepEqual(stats.compilation.warnings, []);
-});
 
-test("should throw error", async t => {
-  const config = Object.assign({}, globalConfig, {
-    output: {
-      path: t.context.directory,
-      filename: "[id].metadata.js",
-    },
-    entry: "./test/fixtures/metadataErr.js",
-  });
-
-  const stats = await webpackAsync(config);
-  t.true(stats.compilation.errors.length > 0);
-  t.deepEqual(stats.compilation.warnings, []);
+  t.deepEqual(actualMetadata, { hello: "world" });
 });
 
-test("should pass metadata code snippet ( cache version )", async t => {
-  const config = Object.assign({}, globalConfig, {
+test("should obtain metadata from the transform result with cache", async t => {
+  let actualMetadata;
+
+  const config = {
+    mode: "development",
+    entry: "./test/fixtures/basic.js",
     output: {
       path: t.context.directory,
       filename: "[id].metadata.js",
     },
+    plugins: [
+      new WebpackMetadataSubscriberPlugin(
+        metadata => (actualMetadata = metadata),
+      ),
+    ],
     module: {
       rules: [
         {
-          test: /\.jsx?/,
+          test: /\.js/,
           loader: babelLoader,
           options: {
-            metadataSubscribers: [ReactIntlPlugin.metadataContextFunctionName],
-            plugins: ["react-intl"],
             cacheDirectory: cacheDir,
-            presets: [],
+            metadataSubscribers: [WebpackMetadataSubscriberPlugin.subscriber],
+            plugins: [babelMetadataProvierPlugin],
+            babelrc: false,
+            configFile: false,
           },
           exclude: /node_modules/,
         },
       ],
     },
-  });
+  };
 
   const stats = await webpackAsync(config);
   t.deepEqual(stats.compilation.errors, []);
   t.deepEqual(stats.compilation.warnings, []);
 
-  const files = fs.readdirSync(t.context.directory);
-  t.true(files.length > 0);
-
-  const text = fs.readFileSync(
-    path.resolve(t.context.directory, "reactIntlMessages.json"),
-    "utf8",
-  );
-  const jsonText = JSON.parse(text);
-  t.true(jsonText.length == 1);
-  t.true(jsonText[0].id == "greetingId");
-  t.true(jsonText[0].defaultMessage == "Hello World!");
+  t.deepEqual(actualMetadata, { hello: "world" });
 });