edge-functions 2.2.0-stage.1 → 2.2.0-stage.2

package/lib/build/bundlers/webpack/plugins/node-polyfills/index.js

@@ -0,0 +1,65 @@
+/* eslint-disable no-param-reassign,class-methods-use-this */
+import { generateWebpackBanner } from '#utils';
+import PolyfillsManager from '../../../polyfills/polyfills-manager.js';
+
+class NodePolyfillPlugin {
+  apply(compiler) {
+    const polyfillsManager = PolyfillsManager.buildPolyfills();
+
+    if (!compiler.options.plugins?.length) {
+      compiler.options.plugins = [];
+    }
+
+    // additional plugin to handle "node:" URIs
+    compiler.options.plugins.push(
+      new compiler.webpack.NormalModuleReplacementPlugin(
+        /node:/,
+        (resource) => {
+          const mod = resource.request.replace(/^node:/, '');
+          resource.request = mod;
+        },
+      ),
+    );
+    // globals
+    compiler.options.plugins.push(
+      new compiler.webpack.ProvidePlugin({
+        Buffer: ['buffer', 'Buffer'],
+        process: polyfillsManager.globals.get('process'),
+      }),
+    );
+
+    // env
+    compiler.options.plugins.push(
+      new compiler.webpack.EnvironmentPlugin({
+        NEXT_RUNTIME: 'edge',
+        NEXT_COMPUTE_JS: true,
+      }),
+    );
+
+    compiler.options.plugins.push(
+      new compiler.webpack.BannerPlugin({
+        banner: generateWebpackBanner([
+          polyfillsManager.globals.get('navigator'),
+          polyfillsManager.globals.get('performance'),
+        ]),
+        raw: true,
+      }),
+    );
+
+    compiler.options.resolve.alias = {
+      ...Object.fromEntries(
+        [...polyfillsManager.alias].map(([key, value]) => [key, value]),
+      ),
+      ...compiler.options.resolve.alias,
+    };
+
+    compiler.options.resolve.fallback = {
+      ...Object.fromEntries(
+        [...polyfillsManager.libs].map(([key, value]) => [key, value]),
+      ),
+      ...compiler.options.resolve.fallback,
+    };
+  }
+}
+
+export default NodePolyfillPlugin;

package/lib/build/bundlers/webpack/plugins/node-polyfills/index.test.js

@@ -0,0 +1,55 @@
+import { promisify } from 'util';
+import webpack from 'webpack';
+import fs from 'fs';
+import tmp from 'tmp';
+import NodePolyfillPlugin from './index.js';
+
+describe('Webpack Node Plugin', () => {
+  let tmpDir;
+  let tmpEntry;
+  let tmpOutput;
+
+  beforeAll(async () => {
+    tmpDir = tmp.dirSync();
+    tmpEntry = tmp.fileSync({
+      postfix: '.js',
+      dir: tmpDir.name,
+      name: 'entry.js',
+    });
+    tmpOutput = tmp.fileSync({
+      postfix: '.js',
+      dir: tmpDir.name,
+      name: 'output.js',
+    });
+  });
+
+  afterAll(async () => {
+    tmpEntry.removeCallback();
+    tmpOutput.removeCallback();
+    tmpDir.removeCallback();
+  });
+
+  it('should check the (NODE_ENV) in Environment and resolve module crypto', async () => {
+    const code = `import crypto from 'crypto';console.log(process.env.NODE_ENV);`;
+    await fs.promises.writeFile(tmpEntry.name, code);
+
+    const runWebpack = promisify(webpack);
+
+    await runWebpack({
+      entry: tmpEntry.name,
+      mode: 'production',
+      optimization: {
+        minimize: false,
+      },
+      output: {
+        path: tmpDir.name,
+        filename: 'output.js',
+      },
+      target: ['webworker', 'es2022'],
+      plugins: [new NodePolyfillPlugin()],
+    });
+    const bundle = fs.readFileSync(tmpOutput.name, 'utf-8');
+    expect(bundle).toContain('console.log("production")');
+    expect(bundle).toContain('./lib/build/bundlers/polyfills/node/crypto.js');
+  }, 20000);
+});

package/lib/build/bundlers/webpack/webpack.config.js

@@ -1,6 +1,9 @@
 import webpack from 'webpack';
 import { join } from 'path';
 import { fileURLToPath } from 'url';
+import { createRequire } from 'module';
+
+const require = createRequire(import.meta.url);
 
 const projectRoot = process.cwd();
 const isWindows = process.platform === 'win32';
@@ -12,9 +15,35 @@ export default {
   output: {
     path: outputPath,
     filename: 'worker.js',
-    globalObject: 'this',
+    globalObject: 'globalThis',
+  },
+  resolve: {
+    extensions: ['.tsx', '.ts', '.js'],
+    mainFields: ['browser', 'main', 'module'],
+  },
+  // loaders
+  module: {
+    rules: [
+      {
+        test: /\.ts?$/,
+        use: [
+          {
+            loader: require.resolve('ts-loader'),
+            options: {
+              transpileOnly: true,
+            },
+          },
+        ],
+        exclude: /node_modules/,
+      },
+    ],
   },
   mode: 'production',
   target: ['webworker', 'es2022'],
-  plugins: [new webpack.ProgressPlugin()],
+  plugins: [
+    new webpack.ProgressPlugin(),
+    new webpack.optimize.LimitChunkCountPlugin({
+      maxChunks: 1,
+    }),
+  ],
 };

package/lib/build/dispatcher/dispatcher.js

@@ -23,42 +23,6 @@ import {
 
 const isWindows = process.platform === 'win32';
 
-/**
- * Check if the project has a package.json file and if it has dependencies or
- * devDependencies, it then checks if the node_modules folder exists and exits the process if it
- * doesn't.
- * @returns {Promise<void>} The function does not have an explicit return statement. Therefore, it does not return any
- * value.
- */
-async function checkNodeModules() {
-  let projectJson;
-  try {
-    projectJson = getProjectJsonFile('package.json');
-  } catch (error) {
-    if (error.code === 'ENOENT') {
-      return;
-    }
-
-    feedback.prebuild.error(error);
-    process.exit(1);
-  }
-
-  if (
-    projectJson &&
-    (projectJson.dependencies || projectJson.devDependencies)
-  ) {
-    const pkgManager = await getPackageManager();
-    const existNodeModules = await folderExistsInProject('node_modules');
-
-    if (!existNodeModules) {
-      feedback.prebuild.error(
-        Messages.build.error.install_dependencies_failed(pkgManager),
-      );
-      process.exit(1);
-    }
-  }
-}
-
 /**
  * Class representing a Dispatcher for build operations.
  * @example
@@ -90,10 +54,10 @@ class Dispatcher {
     this.entry = config.entry;
     this.builder = config.builder;
     this.preset = config.preset;
-    this.useNodePolyfills =
-      config.useNodePolyfills === 'true' || config.useNodePolyfills === true;
-    this.useOwnWorker =
-      config.useOwnWorker === 'true' || config.useOwnWorker === true;
+    this.useNodePolyfills = Dispatcher.checkBooleanValue(
+      config.useNodePolyfills,
+    );
+    this.useOwnWorker = Dispatcher.checkBooleanValue(config.useOwnWorker);
     this.memoryFS = config.memoryFS;
     this.custom = config.custom;
     /* generate */
@@ -101,6 +65,42 @@ class Dispatcher {
     this.vulcanLibPath = vulcanLibPath;
   }
 
+  /**
+   * Check if the project has a package.json file and if it has dependencies or
+   * devDependencies, it then checks if the node_modules folder exists and exits the process if it
+   * doesn't.
+   * @returns {Promise<void>} The function does not have an explicit return statement. Therefore, it does not return any
+   * value.
+   */
+  static async checkNodeModules() {
+    let projectJson;
+    try {
+      projectJson = getProjectJsonFile('package.json');
+    } catch (error) {
+      if (error.code === 'ENOENT') {
+        return;
+      }
+
+      feedback.prebuild.error(error);
+      process.exit(1);
+    }
+
+    if (
+      projectJson &&
+      (projectJson.dependencies || projectJson.devDependencies)
+    ) {
+      const pkgManager = await getPackageManager();
+      const existNodeModules = await folderExistsInProject('node_modules');
+
+      if (!existNodeModules) {
+        feedback.prebuild.error(
+          Messages.build.error.install_dependencies_failed(pkgManager),
+        );
+        process.exit(1);
+      }
+    }
+  }
+
   /**
    * Get a build context based on arguments
    * @returns {object} - Preset files
@@ -236,107 +236,192 @@ class Dispatcher {
   }
 
   /**
-   * Run the build process.
+   * Checks whether the input value is a boolean `true` or a string 'true'.
+   * @param {boolean|string} value - The value to be checked.
+   * @returns {boolean} - Returns `true` if the value is a boolean `true` or a string 'true', otherwise `false`.
    */
-  async run() {
-    await checkNodeModules();
+  static checkBooleanValue(value) {
+    return value === true || value === 'true';
+  }
+
+  /**
+   * Configures the build based on the provided configuration.
+   * @param {object} currentConfig - The configuration object.
+   * @param {string} currentConfig.build - The current build id.
+   * @param {boolean} currentConfig.useNodePolyfills - The current useNodePolyfills.
+   * @param {boolean} currentConfig.useOwnWorker - The current useOwnWorker.
+   * @param {object} currentConfig.preset - The current preset.
+   * @param {object} currentConfig.localCustom - The current localCustom.
+   * @param {object} currentConfig.memoryFS - The current memoryFS.
+   * @param {object} config - The configuration object.
+   * @typedef {object} BuildConfig
+   * @property {string} buildId - Identifier for the build.
+   * @property {boolean} useNodePolyfills - Indicates whether to use Node polyfills.
+   * @property {boolean} useOwnWorker - Indicates whether to use a custom worker.
+   * @property {*} localCustom - Custom configuration specific to the local environment.
+   * @property {*} preset - Preset configuration for the build.
+   * @property {string} entry - Path to the temporary entry file for the build.
+   * @returns {BuildConfig} - Returns the configured build object.
+   */
+  static configureBuild(currentConfig, config) {
+    const {
+      buildId,
+      useNodePolyfills,
+      useOwnWorker,
+      preset,
+      localCustom,
+      memoryFS,
+    } = currentConfig;
+    const buildConfig = { ...config };
+
+    buildConfig.buildId = buildId;
+    // include config preset to priority
+    buildConfig.useNodePolyfills =
+      Dispatcher.checkBooleanValue(useNodePolyfills) ||
+      Dispatcher.checkBooleanValue(buildConfig?.useNodePolyfills);
+    // include config preset to priority
+    buildConfig.useOwnWorker =
+      Dispatcher.checkBooleanValue(useOwnWorker) ||
+      Dispatcher.checkBooleanValue(buildConfig?.useOwnWorker);
+    buildConfig.localCustom = localCustom;
+    buildConfig.preset = preset;
+    buildConfig.memoryFS = memoryFS || buildConfig?.memoryFS;
+
+    const currentDir = process.cwd();
+    let tempEntryFile = `vulcan-${buildId}.temp.`;
+    tempEntryFile += preset.name === 'typescript' ? 'ts' : 'js';
+    const tempBuilderEntryPath = join(currentDir, tempEntryFile);
+
+    buildConfig.entry = tempBuilderEntryPath;
 
-    // Load files from preset
-    const { handler, prebuild, config } = await this.loadPreset();
+    return buildConfig;
+  }
 
-    const context = {
-      buildId: this.buildId,
-      entry: this.entry,
-      useNodePolyfills: this.useNodePolyfills,
-      useOwnWorker: this.useOwnWorker,
-      memoryFS: this.memoryFS,
+  /**
+   * Runs prebuild tasks using the provided context and build configuration.
+   * @param {object} context - The context for prebuilding.
+   * @param {string} context.builId - The build id.
+   * @param {string} context.handler - The handler preset file.
+   * @param {string} context.prebuild - The prebuild preset file.
+   * @param {BuildConfig} buildConfig - The build configuration object.
+   * @returns {Promise<object>} - A promise that resolves to an object containing the prebuild context.
+   */
+  static async runPrebuild(context, buildConfig) {
+    const { buildId, handler, prebuild } = context;
+    const prebuildContext = {
+      buildId,
+      entry: buildConfig.entry,
+      useNodePolyfills: buildConfig.useNodePolyfills,
+      useOwnWorker: buildConfig.useOwnWorker,
+      memoryFS: buildConfig.memoryFS,
       preset: {
-        name: this.preset.name,
-        mode: this.preset.mode,
+        name: buildConfig.preset.name,
+        mode: buildConfig.preset.mode,
         files: {
           handler,
-          config,
+          config: buildConfig,
           prebuild,
         },
       },
     };
+    feedback.prebuild.info(Messages.build.info.prebuild_starting);
+    await prebuild(prebuildContext);
+    createDotEnvFile(buildId, isWindows);
+    feedback.prebuild.success(Messages.build.success.prebuild_succeeded);
+
+    feedback.build.info(Messages.build.info.vulcan_build_starting);
+
+    const { injectionDirs, removePathPrefix } = buildConfig.memoryFS;
+    if (injectionDirs && injectionDirs.length > 0) {
+      const content = await injectFilesInMem(injectionDirs);
+
+      const prefix =
+        removePathPrefix &&
+        typeof removePathPrefix === 'string' &&
+        removePathPrefix !== ''
+          ? `'${removePathPrefix}'`
+          : `''`;
+
+      // eslint-disable-next-line
+      buildConfig.contentToInject = `globalThis.vulcan = {}; globalThis.vulcan.FS_PATH_PREFIX_TO_REMOVE = ${prefix};\n${content}`;
+    }
+    return Promise.resolve({ prebuildContext });
+  }
 
-    const currentDir = process.cwd();
-    let tempEntryFile = `vulcan-${this.buildId}.temp.`;
-    tempEntryFile += this.preset.name === 'typescript' ? 'ts' : 'js';
-    const tempBuilderEntryPath = join(currentDir, tempEntryFile);
+  /**
+   * Executes the build process based on the provided build configuration.
+   * @param {string} originalEntry - The original entry e.g ./index.js.
+   * @param {string} builderCurrent - The builder current e.g esbuild.
+   * @param {BuildConfig} buildConfig - The build configuration object.
+   * @returns {Promise<void>} - A promise that resolves when the build process is completed.
+   */
+  static async executeBuild(originalEntry, builderCurrent, buildConfig) {
+    const builderSelected = builderCurrent || buildConfig.builder;
+    let builder;
+    switch (builderSelected) {
+      case 'webpack':
+        builder = new Webpack(buildConfig);
+        break;
+      case 'esbuild':
+        builder = new Esbuild(buildConfig);
+        break;
+      default:
+        builder = new Webpack(buildConfig);
+        break;
+    }
 
-    writeFileSync(tempBuilderEntryPath, handler);
+    // Run common build
+    await builder.run();
 
-    // Run prebuild actions
-    try {
-      feedback.prebuild.info(Messages.build.info.prebuild_starting);
-      await prebuild(context);
-      createDotEnvFile(this.buildId, isWindows);
-      feedback.prebuild.success(Messages.build.success.prebuild_succeeded);
-
-      feedback.build.info(Messages.build.info.vulcan_build_starting);
-
-      // builder entry
-      config.entry = tempBuilderEntryPath;
-      config.buildId = this.buildId;
-      config.useNodePolyfills = this.useNodePolyfills;
-      config.useOwnWorker = this.useOwnWorker;
-      config.localCustom = this.custom;
-
-      const builderSelected = this.builder || config.builder;
-
-      const { injectionDirs, removePathPrefix } = this.memoryFS;
-      if (injectionDirs && injectionDirs.length > 0) {
-        const content = await injectFilesInMem(injectionDirs);
-
-        const prefix =
-          removePathPrefix &&
-          typeof removePathPrefix === 'string' &&
-          removePathPrefix !== ''
-            ? `'${removePathPrefix}'`
-            : `''`;
-
-        config.contentToInject = `globalThis.vulcan = {}; globalThis.vulcan.FS_PATH_PREFIX_TO_REMOVE = ${prefix};\n${content}`;
-      }
+    // delete .temp files
+    rmSync(buildConfig.entry);
 
-      let builder;
-      switch (builderSelected) {
-        case 'webpack':
-          builder = new Webpack(config);
-          break;
-        case 'esbuild':
-          builder = new Esbuild(config);
-          break;
-        default:
-          builder = new Webpack(config);
-          break;
-      }
+    await vulcan.createVulcanEnv(
+      {
+        entry: originalEntry, // original entry
+        preset: buildConfig.preset.name,
+        mode: buildConfig.preset.mode,
+        useNodePolyfills: buildConfig.useNodePolyfills,
+        useOwnWorker: buildConfig.useOwnWorker,
+      },
+      'local',
+    );
+  }
 
-      // Run common build
-      await builder.run();
+  /**
+   * Run the build process.
+   */
+  async run() {
+    let buildEntryTemp;
+    try {
+      await Dispatcher.checkNodeModules();
 
-      // delete .temp files
-      rmSync(tempBuilderEntryPath);
+      // Load files from preset
+      const { handler, prebuild, config } = await this.loadPreset();
 
-      await vulcan.createVulcanEnv(
+      const buildConfig = Dispatcher.configureBuild(
         {
-          entry: this.entry,
-          preset: this.preset.name,
-          mode: this.preset.mode,
-          ...(this.useNodePolyfills && {
-            useNodePolyfills: this.useNodePolyfills,
-          }),
-          ...(this.useOwnWorker && {
-            useOwnWorker: this.useOwnWorker,
-          }),
+          buildId: this.buildId,
+          localCustom: this.custom,
+          preset: this.preset,
+          useNodePolyfills: this.useNodePolyfills,
+          useOwnWorker: this.useOwnWorker,
+          memoryFS: this.memoryFS,
         },
-        'local',
+        config,
       );
+      buildEntryTemp = buildConfig.entry;
+      // temp entry
+      writeFileSync(buildConfig?.entry, handler);
 
+      await Dispatcher.runPrebuild(
+        { buildId: this.buildId, handler, prebuild },
+        buildConfig,
+      );
+      await Dispatcher.executeBuild(this.entry, this.builder, buildConfig);
       feedback.build.success(Messages.build.success.vulcan_build_succeeded);
     } catch (error) {
-      rmSync(tempBuilderEntryPath);
+      rmSync(buildEntryTemp);
       feedback.build.error(error);
       process.exit(1);
     }

package/lib/build/dispatcher/dispatcher.test.js

@@ -66,7 +66,6 @@ describe('dispatcher', () => {
       mockGenerateTimestamp(),
       getAbsoluteLibDirPath(),
     );
-    newDispatcher.loadPreset();
     expect(newDispatcher).toBeInstanceOf(Dispatcher);
     expect(newDispatcher).toEqual(expectedDispatcher);
   });

package/lib/constants/messages/build.messages.js

@@ -23,6 +23,10 @@ const build = {
     install_dependencies_failed: (pckManager) =>
       `Please run command to install dependencies. e.g ${pckManager} install.`,
   },
+  warning: {
+    use_node_polyfill_mode_deliver:
+      'The use of useNodePolyfills is not available for this deliver mode preset.',
+  },
 };
 
 export default build;

package/lib/presets/custom/next/compute/config.js

@@ -1,96 +1,11 @@
-// import path from 'path';
-import webpack from 'webpack';
-
-import { createRequire } from 'module';
-
-import { getAbsoluteLibDirPath, generateWebpackBanner } from '#utils';
-
-const require = createRequire(import.meta.url);
-const libDirPath = getAbsoluteLibDirPath();
-const polyfillsPath = `${libDirPath}/build/polyfills`;
-const nodePolyfillsPath = `${polyfillsPath}/node`;
-const nextNodePresetPath = `${libDirPath}/presets/custom/next/compute/node`;
-
 /**
  * Config to be used in build context.
  */
 const config = {
   builder: 'webpack',
-  useNodePolyfills: false,
+  useNodePolyfills: true,
   custom: {
-    experiments: {
-      topLevelAwait: true,
-    },
-    optimization: {
-      minimize: true,
-    },
-    module: {
-      // Asset modules are modules that allow the use asset files (fonts, icons, etc)
-      // without additional configuration or dependencies.
-      rules: [
-        // asset/source exports the source code of the asset.
-        // Usage: e.g., import notFoundPage from "./page_404.html"
-        {
-          test: /\.(txt|html)/,
-          type: 'asset/source',
-        },
-      ],
-    },
-    plugins: [
-      // Polyfills go here.
-      // Used for, e.g., any cross-platform WHATWG,
-      // or core nodejs modules needed for your application.
-      new webpack.ProvidePlugin({
-        Buffer: ['buffer', 'Buffer'],
-      }),
-      new webpack.BannerPlugin({
-        banner: generateWebpackBanner([
-          `${nodePolyfillsPath}/globals/navigator.js`,
-          `${nodePolyfillsPath}/globals/performance.js`,
-          `${nodePolyfillsPath}/globals/process.js`,
-        ]),
-        raw: true,
-      }),
-      new webpack.EnvironmentPlugin({
-        NEXT_RUNTIME: 'edge',
-        NEXT_COMPUTE_JS: true,
-      }),
-      new webpack.optimize.LimitChunkCountPlugin({
-        maxChunks: 1,
-      }),
-    ],
-    resolve: {
-      mainFields: ['browser', 'main', 'module'],
-      alias: {
-        util: require.resolve('util/'),
-      },
-      fallback: {
-        async_hooks: false,
-        tls: false,
-        net: false,
-        child_process: false,
-        https: require.resolve('https-browserify'),
-        tty: require.resolve('tty-browserify'),
-        http: require.resolve('stream-http'),
-        buffer: require.resolve('buffer/'),
-        crypto: require.resolve('crypto-browserify/'),
-        events: require.resolve('events/'),
-        os: require.resolve('os-browserify/browser'),
-        path: require.resolve('path-browserify'),
-        querystring: require.resolve('querystring-es3'),
-        stream: require.resolve('stream-browserify'),
-        url: require.resolve('url/'),
-        zlib: require.resolve('browserify-zlib'),
-        dns: `${nodePolyfillsPath}/dns.js`,
-        http2: `${nodePolyfillsPath}/http2.js`,
-        module: `${nodePolyfillsPath}/module.js`,
-        fs: `${nodePolyfillsPath}/fs.js`,
-        'next/dist/compiled/etag': `${nextNodePresetPath}/custom-server/12.3.1/util/etag.js`,
-        '@fastly/http-compute-js': require.resolve('@fastly/http-compute-js'),
-        accepts: require.resolve('accepts'),
-        string_decoder: require.resolve('string_decoder/'),
-      },
-    },
+    plugins: [],
   },
 };
 

package/lib/presets/custom/next/compute/node/custom-server/12.3.1/server/require.js

@@ -150,6 +150,9 @@ export function readAssetManifest(assets, path, dir) {
 export function readAssetModule(assets, path, dir) {
   const relativePath = relative(dir, path);
   const file = assets[`/${relativePath}`];
+  if (file.module instanceof Promise) {
+    return Promise.resolve(file.module?.default || file.module);
+  }
   return file.module;
 }