[BUG] Polyfilled fetch prevents use in chrome extension

[tombeckenham]

Current Behavior

There's a polyfill being used in the webpack configuration that prevents the latest version of the fcl libary from being used in chrome extensions. This is to do with how cross-fetch works. It's calling XMLHttpRequest which is unavailable in Chrome service workers. I discovered this when upgrading the fcl libaries in the Flow Reference Wallet extension. It previously used 1.5.0-alpha.1 of the transport-http library. Upgrading that libary to 1.10.2 prevents the wallet from connecting to flow.

The issue is caused by the polyfill to http and https used in the webpack configuration in fcl-js/packages/fcl-bundle/src/webpack.config.js:

module.exports = function getWebpackConfig(options = {}) {
  return {
    mode: options.mode || "production",
    entry: options.entry,
    output: {
      filename: options.filename,
      path: options.path,
      library: options.library,
      libraryTarget: options.libraryTarget || "umd",
      globalObject: options.globalObject || "this",
    },
    resolve: {
      fallback: {
        http: require.resolve("stream-http"),        // Problematic polyfill
        https: require.resolve("https-browserify"),   // Problematic polyfill
        crypto: require.resolve("crypto-browserify"),
        stream: require.resolve("stream-browserify"),
        os: require.resolve("os-browserify/browser"),
        url: require.resolve("url/"),
        assert: require.resolve("assert/"),
        buffer: require.resolve("buffer")
      }
    },
    plugins: [
      new webpack.ProvidePlugin({
        process: "process/browser",
        Buffer: ["buffer", "Buffer"]
      })
    ]
  }
}

I managed to resolve the issue in the extension (temporarily) by including cross-fetch directly, forcing that version to be used by all libaries, then turning off the polyfills explicitly.

resolve: {
  alias: {
    // Forces all cross-fetch imports to use the same instance
    'cross-fetch': require.resolve('cross-fetch'),
  },
  fallback: {
    // Removes polyfills that were interfering with native fetch
    http: false,
    https: false,
  }
}

Expected Behavior

I shouldn't have to modify webpack to use the latest version of the fcl libaries

Steps To Reproduce

Build and run the flow reference wallet with this sha 9dbbc58

You can see the (temporary) fix in the commit after this one: f65ac2f

Environment

- OS: macOS 
- Node: 22
- npm: pnpm 9

What are you currently working on that this is blocking?

I'm working on the Flow Reference Wallet chrome extension

[jribbink]

Thanks for the bug report @tombeckenham :)

It looks like this has been resolved in cross-fetch v4 lquixada/cross-fetch#78. I will look into updating this library today.