fix(webpack-loader): fix schema for webpackResolveOptions.plugins (#577)

microsoft · Jul 10, 2024 · b5dd894 · b5dd894
1 parent 427bf80
commit b5dd894
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 67 deletions.
diff --git a/change/@griffel-webpack-loader-3fba1f5a-ce6b-4d64-ad46-b17ca2db5949.json b/change/@griffel-webpack-loader-3fba1f5a-ce6b-4d64-ad46-b17ca2db5949.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix(webpack-loader): fix schema for webpackResolveOptions.plugins",
+  "packageName": "@griffel/webpack-loader",
+  "email": "olfedias@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/webpack-loader/__fixtures__/webpack-resolve-plugins/fake-color.ts b/packages/webpack-loader/__fixtures__/webpack-resolve-plugins/fake-color.ts
@@ -0,0 +1,3 @@
+const color = 'red';
+
+export default color;
diff --git a/packages/webpack-loader/src/schema.ts b/packages/webpack-loader/src/schema.ts
@@ -37,10 +37,8 @@ export const optionsSchema: JSONSchema7 = {
         extensions: { type: 'array', items: { type: 'string' } },
         modules: { type: 'array', items: { type: 'string' } },
         plugins: {
-          oneOf: [
-            { type: 'string', enum: ['...'] },
-            { type: 'object', additionalProperties: true },
-          ],
+          type: 'array',
+          items: { type: 'object' },
         },
       },
     },

diff --git a/packages/webpack-loader/src/webpackLoader.test.ts b/packages/webpack-loader/src/webpackLoader.test.ts
@@ -234,84 +234,47 @@ describe('webpackLoader', () => {
   testFixture('reset');
   testFixture('empty');
 
-  // Integration fixtures for config functionality
-  testFixture('config-classname-hash-salt', {
-    loaderOptions: {
-      classNameHashSalt: 'HASH_SALT',
-    },
-  });
+  const fakeColorModulePath = path.resolve(__dirname, '..', '__fixtures__', 'webpack-resolve-plugins', 'fake-color.ts');
+  const colorModulePath = path.resolve(__dirname, '..', '__fixtures__', 'webpack-resolve-plugins', 'color.ts');
 
-  testFixture('config-modules', {
-    loaderOptions: {
-      modules: [{ moduleSource: 'react-make-styles', importName: 'makeStyles' }],
-    },
-    webpackConfig: {
-      externals: {
-        'react-make-styles': 'Griffel',
-      },
+  const CustomAliasPlugin: webpack.ResolvePluginInstance = {
+    // Simple plugin that will detect the non-existent module we are testing for and replace with
+    // correct path from the fixture
+    apply(resolver) {
+      const target = resolver.ensureHook('internal-resolve');
+
+      resolver.getHook('raw-resolve').tapAsync('CustomAliasPlugin', (request, resolveContext, callback) => {
+        if (request.request === 'non-existing-color-module') {
+          const newRequest = { ...request, request: colorModulePath };
+
+          return resolver.doResolve(target, newRequest, null, resolveContext, callback);
+        }
+
+        callback();
+      });
     },
-  });
+  };
 
-  // Asserts that aliases are resolved properly in Babel plugin
-  testFixture('webpack-aliases', {
+  testFixture('webpack-resolve-plugins', {
     webpackConfig: {
       resolve: {
         alias: {
-          'non-existing-color-module': path.resolve(__dirname, '..', '__fixtures__', 'webpack-aliases', 'color.ts'),
+          'non-existing-color-module': fakeColorModulePath,
         },
+        plugins: [CustomAliasPlugin],
       },
     },
   });
-
-  // Asserts that "inheritResolveOptions" are handled properly
-  testFixture('webpack-inherit-resolve-options', {
-    loaderOptions: {
-      inheritResolveOptions: ['extensions'],
-    },
+  testFixture('webpack-resolve-plugins', {
     webpackConfig: {
       resolve: {
-        extensions: ['.ts', '.jsx'],
+        alias: {
+          'non-existing-color-module': fakeColorModulePath,
+        },
       },
     },
-  });
-
-  // Asserts that "webpackResolveOptions" are handled properly
-  testFixture('webpack-resolve-options', {
     loaderOptions: {
-      webpackResolveOptions: {
-        extensions: ['.ts', '.jsx'],
-      },
-    },
-  });
-
-  // Asserts that aliases are resolved properly in Babel plugin with resolve plugins
-  testFixture('webpack-resolve-plugins', {
-    webpackConfig: {
-      resolve: {
-        plugins: [
-          {
-            // Simple plugin that will detect the non-existent module we are testing for and replace with
-            // correct path from the fixture
-            apply: function (resolver) {
-              const target = resolver.ensureHook('resolve');
-
-              resolver.getHook('before-resolve').tapAsync('ResolveFallback', (request, resolveContext, callback) => {
-                if (request.request === 'non-existing-color-module') {
-                  const obj = {
-                    directory: request.directory,
-                    path: request.path,
-                    query: request.query,
-                    request: path.resolve(__dirname, '..', '__fixtures__', 'webpack-resolve-plugins', 'color.ts'),
-                  };
-                  return resolver.doResolve(target, obj, null, resolveContext, callback);
-                }
-
-                callback();
-              });
-            },
-          },
-        ],
-      },
+      webpackResolveOptions: { plugins: [CustomAliasPlugin] },
     },
   });