chore: don't include babel compiled files in webpack bundles (#9491)

babel.config.json

@@ -12,7 +12,6 @@
     "@babel/plugin-transform-modules-commonjs"
   ],
   "ignore": [
-    "**/*.d.ts",
+    "**/*.d.ts"
-    "packages/playwright-core/src/injected/**/*"
   ]
 }

package-lock.json

@@ -11382,9 +11382,6 @@
       "bin": {
         "playwright": "cli.js"
       },
-      "devDependencies": {
-        "@zip.js/zip.js": "^2.3.17"
-      },
       "engines": {
         "node": ">=12"
       }
@@ -17948,7 +17945,6 @@
     "playwright-core": {
       "version": "file:packages/playwright-core",
       "requires": {
-        "@zip.js/zip.js": "^2.3.17",
         "commander": "^8.2.0",
         "debug": "^4.1.1",
         "extract-zip": "^2.0.1",

packages/playwright-core/src/server/supplements/recorder/recorderApp.ts

@@ -59,7 +59,7 @@ export class RecorderApp extends EventEmitter {
     await this._page._setServerRequestInterceptor(async route => {
       if (route.request().url().startsWith('https://playwright/')) {
         const uri = route.request().url().substring('https://playwright/'.length);
-        const file = require.resolve('../../../web/recorder/' + uri);
+        const file = require.resolve('../../../webpack/recorder/' + uri);
         const buffer = await fs.promises.readFile(file);
         await route.fulfill({
           status: 200,

packages/playwright-core/src/server/trace/viewer/traceViewer.ts

@@ -38,7 +38,7 @@ export async function showTraceViewer(traceUrl: string, browserName: string, hea
 
   server.routePrefix('/', (request, response) => {
     const relativePath = new URL('http://localhost' + request.url!).pathname;
-    const absolutePath = path.join(__dirname, '..', '..', '..', 'web', 'traceViewer', ...relativePath.split('/'));
+    const absolutePath = path.join(__dirname, '..', '..', '..', 'webpack', 'traceViewer', ...relativePath.split('/'));
     return server.serveFile(response, absolutePath);
   });
 

packages/playwright-core/src/web/htmlReport/webpack.config.js

@@ -15,7 +15,7 @@ module.exports = {
   output: {
     globalObject: 'self',
     filename: '[name].bundle.js',
-    path: path.resolve(__dirname, '../../../lib/web/htmlReport')
+    path: path.resolve(__dirname, '../../../lib/webpack/htmlReport')
   },
   module: {
     rules: [

packages/playwright-core/src/web/recorder/webpack.config.js

@@ -15,7 +15,7 @@ module.exports = {
   output: {
     globalObject: 'self',
     filename: '[name].bundle.js',
-    path: path.resolve(__dirname, '../../../lib/web/recorder')
+    path: path.resolve(__dirname, '../../../lib/webpack/recorder')
   },
   module: {
     rules: [

packages/playwright-core/src/web/traceViewer/webpack-sw.config.js

@@ -13,7 +13,7 @@ module.exports = {
   output: {
     globalObject: 'self',
     filename: '[name].bundle.js',
-    path: path.resolve(__dirname, '../../../lib/web/traceViewer')
+    path: path.resolve(__dirname, '../../../lib/webpack/traceViewer')
   },
   module: {
     rules: [

packages/playwright-core/src/web/traceViewer/webpack.config.js

@@ -15,7 +15,7 @@ module.exports = {
   output: {
     globalObject: 'self',
     filename: '[name].bundle.js',
-    path: path.resolve(__dirname, '../../../lib/web/traceViewer')
+    path: path.resolve(__dirname, '../../../lib/webpack/traceViewer')
   },
   module: {
     rules: [
@@ -45,7 +45,7 @@ module.exports = {
       patterns: [
         {
           from: path.resolve(__dirname, '../../../../../node_modules/@zip.js/zip.js/dist/zip-no-worker-inflate.min.js'),
-          to: path.resolve(__dirname, '../../../lib/web/traceViewer/zip.min.js')
+          to: 'zip.min.js'
         },
       ],
     }),

packages/playwright-test/src/reporters/html.ts

@@ -151,12 +151,12 @@ class HtmlBuilder {
     fs.mkdirSync(this._dataFolder, { recursive: true });
 
     // Copy app.
-    const appFolder = path.join(require.resolve('playwright-core'), '..', 'lib', 'web', 'htmlReport');
+    const appFolder = path.join(require.resolve('playwright-core'), '..', 'lib', 'webpack', 'htmlReport');
     for (const file of fs.readdirSync(appFolder))
       fs.copyFileSync(path.join(appFolder, file), path.join(this._reportFolder, file));
 
     // Copy trace viewer.
-    const traceViewerFolder = path.join(require.resolve('playwright-core'), '..', 'lib', 'web', 'traceViewer');
+    const traceViewerFolder = path.join(require.resolve('playwright-core'), '..', 'lib', 'webpack', 'traceViewer');
     const traceViewerTargetFolder = path.join(this._reportFolder, 'trace');
     fs.mkdirSync(traceViewerTargetFolder, { recursive: true });
     // TODO (#9471): remove file filter when the babel build is fixed.

utils/build/build.js

@@ -143,7 +143,13 @@ for (const packageDir of packages) {
     continue;
   steps.push({
     command: 'npx',
-    args: ['babel', ...(watchMode ? ['-w', '--source-maps'] : []), '--extensions', '.ts', '--out-dir', path.join(packageDir, 'lib'), path.join(packageDir, 'src')],
+    args: [
+      'babel',
+      ...(watchMode ? ['-w', '--source-maps'] : []),
+      '--extensions', '.ts',
+      '--out-dir', path.join(packageDir, 'lib'),
+      '--ignore', 'packages/playwright-core/src/server/injected/**/*',
+      path.join(packageDir, 'src')],
     shell: true,
   });
 }