VirgilSecurity / virgil-e3kit-js

E3Kit is a security framework that simplifies work with Virgil services and presents the easiest way to add full end-to-end security to your chat application to become HIPAA and GDPR compliant and more.
https://virgilsecurity.com/e3kit/
BSD 3-Clause "New" or "Revised" License
58 stars 19 forks source link

Encryption error ReferenceError: Buffer is not defined at new SubDown (browser.es.js:14144:1) #175

Closed thecannabisapp closed 2 months ago

thecannabisapp commented 5 months ago

Describe the bug I'm trying to upgrade my React 18 app using @virgilsecurity/e3kit-browser": "3.0.5" coming from v3.0.0 but now I've updated the package, I'm getting the following error when running my application.

universalModuleDefinition:1 Encryption error ReferenceError: Buffer is not defined
    at new SubDown (browser.es.js:14144:1)
    at SubDown (browser.es.js:14130:1)
    at module.exports (browser.es.js:15357:1)
    at new GroupLocalStorage (browser.es.js:16926:1)
    at new AbstractEThree (browser.es.js:17065:1)
    at new EThree (browser.es.js:19227:1)
    at initialize (browser.es.js:19258:1)
    at async initializeEncryption (EncryptionProvider.tsx:90:1)

Running on react-app-rewired here's my config-overide.js for reference.

// config-overrides.js
const webpack = require("webpack");

module.exports = {
  webpack: function override(config, _env) {
    config.experiments = {
      asyncWebAssembly: true,
      syncWebAssembly: true,
    };
    config.module.rules[
      config.module.rules.findIndex((rule) => rule.oneOf)
    ].oneOf.unshift(
      {
        test: /\.wasm$/,
        type: "javascript/auto",
        loader: "file-loader",
        options: {
          outputPath: "static/wasm/",
        },
      },
      {
        test: /\.(js|mjs|jsx)$/,
        enforce: "pre",
        loader: require.resolve("source-map-loader"),
        resolve: {
          fullySpecified: false,
        },
      }
    );

    // https://github.com/nodejs/readable-stream#usage-in-browsers
    config.plugins.push(
      new webpack.ProvidePlugin({
        process: "process/browser.js",
      })
    );
    config.resolve.fallback = {
      stream: false,
    };

    return config;
  },
};

To Reproduce Steps to reproduce the behavior:

  1. Upgrade from v3.0.0 to v3.0.5

Expected behavior No errors in Chrome console.

Screenshots

Screenshot 2024-04-12 at 11 01 03

Desktop (please complete the following information):

thecannabisapp commented 2 months ago

Updated to 3.0.6 and edited my config-override.js

    config.plugins.push(
      new webpack.ProvidePlugin({
        process: "process/browser.js",
        Buffer: ["buffer", "Buffer"],
      })
    );

    config.resolve.fallback = {
      stream: false,
      buffer: require.resolve("buffer/"),
    };