fixed babel configuration for #208

package.json

@@ -41,13 +41,19 @@
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.26.0",
     "jest": "^27.2.1",
+    "memory-fs": "^0.5.0",
     "swc-loader": "^0.1.15",
+    "thenify": "^3.3.1",
     "webpack": "^5.72.0",
     "webpack-assets-manifest": "^5.0.6",
     "webpack-merge": "^5.8.0"
   },
   "jest": {
     "testRegex": "(/__tests__/.*|(\\.|/))\\.jsx?$",
+    "testPathIgnorePatterns": [
+      "/__fixtures__/",
+      "/__utils__/"
+    ],
     "roots": [
       "<rootDir>/package"
     ]

package/rules/__tests__/__utils__/webpack.js

@@ -0,0 +1,48 @@
+const webpack = require('webpack');
+const MemoryFS = require('memory-fs');
+const thenify = require('thenify');
+const path = require('path')
+
+const createTrackLoader = () => {
+    const filesTracked = {};
+    return [filesTracked, (source) => {
+        filesTracked[source.resource] = true;
+        return source;
+    }]
+}
+
+const node_modules = path.resolve('node_modules');
+const node_modules_included = path.resolve('node_modules/included');
+const app_javascript = path.resolve('app/javascript');
+
+const createInMemoryFs = () => {
+    const fs = new MemoryFS();
+
+    fs.mkdirpSync(node_modules);
+    fs.mkdirpSync(node_modules_included);
+    fs.mkdirpSync(app_javascript);
+
+    return fs;
+}
+
+const createTestCompiler = (config, fs = createInMemoryFs()) => {
+
+    Object.values(config.entry).forEach(file => {
+        fs.writeFileSync(file, 'console.log(1);');
+    })
+
+    const compiler = webpack(config);
+    compiler.run = thenify(compiler.run);
+    compiler.inputFileSystem = fs;
+    compiler.outputFileSystem = fs;
+    return compiler;
+};
+
+module.exports = {
+    createTrackLoader,
+    node_modules,
+    node_modules_included,
+    app_javascript,
+    createInMemoryFs,
+    createTestCompiler,
+}

package/rules/__tests__/babel.js

@@ -0,0 +1,60 @@
+const path = require('path')
+const {
+    app_javascript,
+    node_modules,
+    node_modules_included,
+    createTestCompiler,
+    createTrackLoader,
+} = require('./__utils__/webpack');
+const babelConfig = require("../babel");
+
+jest.mock("../../config", () => {
+    const original = jest.requireActual("../../config");
+    return {
+        ...original, additional_paths: [...original.additional_paths, 'node_modules/included'],
+    };
+})
+
+const createWebpackConfig = (file, use) => {
+    return {
+        entry: {file},
+        module: {
+            rules: [{
+                ...babelConfig,
+                use,
+            }]
+        },
+        output: {
+            path: "/",
+            filename: "scripts-bundled.js"
+        },
+    }
+}
+
+describe('babel', () => {
+
+    test('process source path', async () => {
+        const normalPath = `${app_javascript}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(normalPath, loader));
+        await compiler.run();
+        expect(tracked[normalPath]).toBeTruthy();
+    });
+
+    test('exclude node_modules', async () => {
+        const ignored = `${node_modules}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(ignored, loader));
+        await compiler.run();
+        expect(tracked[ignored]).toBeUndefined();
+    });
+
+    test('process included node_modules', async () => {
+        const included = `${node_modules_included}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(included, loader));
+        await compiler.run();
+        expect(tracked[included]).toBeTruthy();
+    });
+
+});

package/rules/__tests__/esbuild.js

@@ -0,0 +1,60 @@
+const path = require('path')
+const {
+    app_javascript,
+    node_modules,
+    node_modules_included,
+    createTestCompiler,
+    createTrackLoader,
+} = require('./__utils__/webpack');
+const esbuildConfig = require("../esbuild");
+
+jest.mock("../../config", () => {
+    const original = jest.requireActual("../../config");
+    return {
+        ...original, webpack_loader: "esbuild", additional_paths: [...original.additional_paths, 'node_modules/included'],
+    };
+})
+
+const createWebpackConfig = (file, use) => {
+    return {
+        entry: { file },
+        module: {
+            rules: [{
+                ...esbuildConfig,
+                use,
+            }]
+        },
+        output: {
+            path: "/",
+            filename: "scripts-bundled.js"
+        },
+    }
+}
+
+describe('swc', () => {
+
+    test('process source path', async () => {
+        const normalPath = `${app_javascript}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(normalPath, loader));
+        await compiler.run();
+        expect(tracked[normalPath]).toBeTruthy();
+    });
+
+    test('exclude node_modules', async () => {
+        const ignored = `${node_modules}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(ignored, loader));
+        await compiler.run();
+        expect(tracked[ignored]).toBeUndefined();
+    });
+
+    test('process included node_modules', async () => {
+        const included = `${node_modules_included}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(included, loader));
+        await compiler.run();
+        expect(tracked[included]).toBeTruthy();
+    });
+
+});

package/rules/__tests__/index.js

@@ -4,8 +4,4 @@ describe('index', () => {
   test('rule tests are regexes', () => {
     rules.forEach(rule => expect(rule.test instanceof RegExp).toBe(true))
   })
-
-  test('rule excludes are regexes', () => {
-    rules.forEach(rule => expect(rule.exclude instanceof RegExp).toBe(true))
-  })
 })

package/rules/__tests__/swc.js

@@ -0,0 +1,59 @@
+const path = require('path')
+const {
+    app_javascript,
+    node_modules,
+    node_modules_included,
+    createTestCompiler,
+    createTrackLoader,
+} = require('./__utils__/webpack');
+const swcConfig = require("../swc");
+
+jest.mock("../../config", () => {
+    const original = jest.requireActual("../../config");
+    return {
+        ...original, webpack_loader: "swc", additional_paths: [...original.additional_paths, 'node_modules/included'],
+    };
+})
+
+const createWebpackConfig = (file, use) => {
+    return {
+        entry: { file },
+        module: {
+            rules: [{
+                ...swcConfig,
+                use,
+            }]
+        },
+        output: {
+            path: "/",
+            filename: "scripts-bundled.js"
+        },
+    }
+}
+
+describe('swc', () => {
+    test('process source path', async () => {
+        const normalPath = `${app_javascript}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(normalPath, loader));
+        await compiler.run();
+        expect(tracked[normalPath]).toBeTruthy();
+    });
+
+    test('exclude node_modules', async () => {
+        const ignored = `${node_modules}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(ignored, loader));
+        await compiler.run();
+        expect(tracked[ignored]).toBeUndefined();
+    });
+
+    test('process included node_modules', async () => {
+        const included = `${node_modules_included}/a.js`
+        const [tracked, loader] = createTrackLoader();
+        const compiler = createTestCompiler(createWebpackConfig(included, loader));
+        await compiler.run();
+        expect(tracked[included]).toBeTruthy();
+    });
+
+});

package/rules/babel.js

@@ -1,24 +1,13 @@
-const { resolve } = require('path')
-const { realpathSync } = require('fs')
 const { loaderMatches } = require('../utils/helpers')
-
 const {
-  source_path: sourcePath,
-  additional_paths: additionalPaths,
   webpack_loader: webpackLoader
 } = require('../config')
 const { isProduction } = require('../env')
+const jscommon = require('./jscommon')
 
 module.exports = loaderMatches(webpackLoader, 'babel', () => ({
     test: /\.(js|jsx|mjs|ts|tsx|coffee)?(\.erb)?$/,
-    include: [sourcePath, ...additionalPaths].map((p) => {
-      try {
-        return realpathSync(p)
-      } catch (e) {
-        return resolve(p)
-      }
-    }),
-    exclude: /node_modules/,
+    ...jscommon,
     use: [
       {
         loader: require.resolve('babel-loader'),
@@ -29,4 +18,4 @@ module.exports = loaderMatches(webpackLoader, 'babel', () => ({
         }
       }
     ]
-  }))
+}))

package/rules/esbuild.js

@@ -1,23 +1,12 @@
-const { resolve } = require('path')
-const { realpathSync } = require('fs')
 const { loaderMatches } = require('../utils/helpers')
 const { getEsbuildLoaderConfig } = require('../esbuild')
-
 const {
-  source_path: sourcePath,
-  additional_paths: additionalPaths,
   webpack_loader: webpackLoader
 } = require('../config')
+const jscommon = require('./jscommon')
 
 module.exports = loaderMatches(webpackLoader, 'esbuild', () => ({
   test: /\.(ts|tsx|js|jsx|mjs|coffee)?(\.erb)?$/,
-  include: [sourcePath, ...additionalPaths].map((p) => {
-    try {
-      return realpathSync(p)
-    } catch (e) {
-      return resolve(p)
-    }
-  }),
-  exclude: /node_modules/,
+  ...jscommon,
   use: ({ resource }) => getEsbuildLoaderConfig(resource)
 }))

package/rules/jscommon.js

@@ -0,0 +1,26 @@
+const { resolve } = require('path')
+const { realpathSync } = require('fs')
+const {
+    source_path: sourcePath,
+    additional_paths: additionalPaths
+} = require('../config')
+
+const inclusions = [sourcePath, ...additionalPaths].map(p => {
+    try {
+        return realpathSync(p)
+    } catch (e) {
+        return resolve(p)
+    }
+})
+
+module.exports = {
+    include: inclusions,
+    exclude: [
+        {
+            // exclude all node_modules from running through babel-loader
+            and: [resolve('node_modules')],
+            // Do not exclude inclusions, as otherwise these won't be transpiled
+            not: [...inclusions]
+        }
+    ]
+}

package/rules/swc.js

@@ -1,23 +1,12 @@
-const { resolve } = require('path')
-const { realpathSync } = require('fs')
 const { loaderMatches } = require('../utils/helpers')
 const { getSwcLoaderConfig } = require('../swc')
-
 const {
-  source_path: sourcePath,
-  additional_paths: additionalPaths,
   webpack_loader: webpackLoader
 } = require('../config')
+const jscommon = require('./jscommon')
 
 module.exports = loaderMatches(webpackLoader, 'swc', () => ({
   test: /\.(ts|tsx|js|jsx|mjs|coffee)?(\.erb)?$/,
-  include: [sourcePath, ...additionalPaths].map((p) => {
-    try {
-      return realpathSync(p)
-    } catch (e) {
-      return resolve(p)
-    }
-  }),
-  exclude: /node_modules/,
+  ...jscommon,
   use: ({ resource }) => getSwcLoaderConfig(resource)
 }))