dop-wallet-v6 1.2.13 → 1.2.15

package/issuev3.md

@@ -1,78 +1,93 @@
-Integrating dop-wallet-v6 into a React Native 0.81 (new architecture) app consistently fails during Metro bundling before the app can run. All failures vanish if dop-wallet-v6 is removed. The errors originate from transitive deps brought in by dop-wallet-v6 (notably ffjavascript, web-worker, wasmcurves, wasmbuilder) that expect Node.js or Web Worker environments. React Native’s Metro/Hermes does not provide those environments by default.
+React Native Integration Report for dopwallet-v6
+
+Summary
+
+Integrating dop-wallet-v6 into a React Native 0.81 (new architecture) app consistently fails during Metro bundling before the app can run. All failures vanish if dop-wallet-v6 is removed. The errors originate from transitive deps brought in by dop-wallet-v6 (notably ffjavascript, webworker, wasmcurves, wasmbuilder) that expect Node.js or Web Worker environments. React Native’s Metro/Hermes does not provide those environments by default.
 
 Key blockers observed:
 
 • ffjavascript does require('os') → Metro can’t resolve Node core module os.
+
 • After stubbing/aliasing os, Metro hits web-worker/cjs/node.js and fails on import(mod) (dynamic import in CJS path), which is incompatible in this RN+Metro context.
+
 • Prior to this, we also had to polyfill other Node core modules (assert, events, process, buffer) just to progress to the next error.
+
 When dop-wallet-v6 is uninstalled (and its import commented out), the app runs normally.
 
- 
 Environment
 
 • Platform: React Native 0.81.x (New Architecture enabled)
+
 • Bundler/Engine: Metro + Hermes (RN default)
+
 • OS/Dev machine: macOS (Intel)
+
 • Crypto/Polyfills used in app:
-o react-native-quick-crypto (polyfills Node crypto)
-o react-native-get-random-values
-o Manual/global polyfills for process, Buffer, stream, util, assert, events
-o Local “os” stub (details below)
-Note: RN ≥0.76 no longer ships Node polyfills automatically. Metro requires explicit polyfills or aliases for Node core modules.
+
+o react-native-quick-crypto (polyfills Node crypto) o react-native-get-random-values o Manual/global polyfills for process, Buffer, stream, util, assert, events o Local “os” stub (details below) Note: RN ≥0.76 no longer ships Node polyfills automatically. Metro requires explicit polyfills or aliases for Node core modules.
 
 Some Code Snippets
 
 Added polyfills.js and import it at the very top of index.js:
-// polyfills.js
-import 'react-native-get-random-values';
-import 'react-native-quick-crypto';
- 
+
+// polyfills.js import 'react-native-get-random-values'; import 'react-native-quick-crypto';
+
 if (typeof global.process === 'undefined') global.process = require('process');
+
 if (typeof global.Buffer === 'undefined') global.Buffer = require('buffer').Buffer;
- 
-// Minimal 'os' ponyfill to get past ffjavascript's 'require("os")'
-// (Note: a global doesn’t satisfy require('os'); see metro alias below)
-global.os = {
- platform: () => 'react-native',
- homedir: () => '/',
- tmpdir: () => '/tmp',
-};
- 
+
+// Minimal 'os' ponyfill to get past ffjavascript's 'require("os")' // (Note: a global doesn’t satisfy require('os'); see metro alias below) global.os = { platform: () => 'react-native', homedir: () => '/', tmpdir: () => '/tmp', };
+
 global.stream = require('stream-browserify');
+
 global.util = require('util');
+
 global.assert = require('assert');
+
 global.events = require('events');
 
 In metro.config.js, alias Node core os to our stub (this is what actually satisfies require('os') at bundle-time):
-// force `require('os')` to hit our stub file
-   os: require.resolve('./polyfills.js'),
 
- 
+// force `require('os')` to hit our stub file os: require.resolve('./polyfills.js'),
+
 Errors & Logs
-➢ Missing Node core module (os):
-BUNDLE  ./index.js
-ERROR  Error: Unable to resolve module os from node_modules/ffjavascript/build/main.cjs:
-os could not be found within the project or in these directories: node_modules
- 
- 3 | var crypto = require('crypto');
- 4 | var wasmcurves = require('wasmcurves');
+
+➢
+
+Missing Node core module (os):
+
+BUNDLE ./index.js ERROR Error: Unable to resolve module os from node_modules/ffjavascript/build/main.cjs: os could not be found within the project or in these directories: node_modules
+
+3 | var crypto = require('crypto');
+
+4 | var wasmcurves = require('wasmcurves');
+
 > 5 | var os = require('os');
-     ^
- 6 | var Worker = require('web-worker');
+
+^
+
+6 | var Worker = require('web-worker');
+
 • Root: ffjavascript requires the Node core module os.
+
 • Workaround tried:
+
 • Setting global.os = { ... } alone is not enough because require('os') needs a module, not a global.
+
 • Aliasing os to a local stub in metro.config.js resolves bundling past this point.
- 
 
- 
+➢
+
+Next blocker from web-worker:
 
-➢ Next blocker from web-worker:
 ERROR node_modules/web-worker/cjs/node.js: node_modules/web-worker/cjs/node.js: Invalid call at line 201: import(mod)
 
 Analysis (why this breaks on RN)
 
 1. Node core deps in transitive packages (ffjavascript → require('os')) aren’t available in RN. We can alias some, but it’s brittle and incomplete.
+
 2. Web Worker dependency (web-worker, wasmbuilder) assumes either Node (worker threads / dynamic loading) or browser (DOM Workers). React Native has neither by default. Metro/Hermes do not support those code paths out of the box.
+
 3. Dynamic import in a CJS Node path (web-worker/cjs/node.js → import(mod)) is not compatible with RN/Metro bundle stage in this context.
+
 4. Potential WASM assets (wasmcurves, wasmbuilder) usually require Metro config for *.wasm and a runtime that supports WASM in Hermes (partial/experimental). Even if we get past web-worker, WASM loading likely becomes the next blocker unless the SDK ships an RN-ready path.

package/metro.config.react-native.example.js

@@ -22,13 +22,14 @@ const config = {
       'stream': require.resolve('stream-browserify'),
       'buffer': require.resolve('buffer'),
       'events': require.resolve('events'),
-      'util': require.resolve('util'),
+      'util': require.resolve('./node-polyfills/util-polyfill.js'),
       'assert': require.resolve('assert'),
-      'process': require.resolve('process/browser'),
+      'process': require.resolve('./node-polyfills/process-polyfill.js'),
       
       // Additional modules that might be needed
-      'path': require.resolve('path-browserify'),
-      'url': require.resolve('url'),
+      'path': require.resolve('./node-polyfills/path-polyfill.js'),
+      'url': require.resolve('./node-polyfills/url-polyfill.js'),
+      'fs': require.resolve('./node-polyfills/fs-polyfill.js'),
       'querystring': require.resolve('querystring-es3'),
       'http': require.resolve('stream-http'),
       'https': require.resolve('https-browserify'),
@@ -51,11 +52,12 @@ const config = {
       'stream': require.resolve('stream-browserify'),
       'buffer': require.resolve('buffer'),
       'events': require.resolve('events'),
-      'util': require.resolve('util'),
+      'util': require.resolve('./node-polyfills/util-polyfill.js'),
       'assert': require.resolve('assert'),
-      'process': require.resolve('process/browser'),
-      'path': require.resolve('path-browserify'),
-      'url': require.resolve('url'),
+      'process': require.resolve('./node-polyfills/process-polyfill.js'),
+      'path': require.resolve('./node-polyfills/path-polyfill.js'),
+      'url': require.resolve('./node-polyfills/url-polyfill.js'),
+      'fs': require.resolve('./node-polyfills/fs-polyfill.js'),
       'querystring': require.resolve('querystring-es3'),
       'http': require.resolve('stream-http'),
       'https': require.resolve('https-browserify'),

package/node-polyfills/fs-polyfill.js

@@ -0,0 +1,54 @@
+/**
+ * File System (fs) polyfill for React Native
+ * 
+ * This addresses the usage of 'fs' module in test files and prevents
+ * any accidental Node.js fs usage in production React Native code.
+ */
+
+console.warn('fs polyfill: File system operations are not supported in React Native.');
+
+// Mock fs operations that might be called
+const throwError = (operation) => {
+  throw new Error(`fs.${operation}() is not supported in React Native environment. Use AsyncStorage or RNFS instead.`);
+};
+
+module.exports = {
+  // Common fs methods that might be imported
+  readFile: () => throwError('readFile'),
+  readFileSync: () => throwError('readFileSync'),
+  writeFile: () => throwError('writeFile'),
+  writeFileSync: () => throwError('writeFileSync'),
+  exists: () => throwError('exists'),
+  existsSync: () => throwError('existsSync'),
+  mkdir: () => throwError('mkdir'),
+  mkdirSync: () => throwError('mkdirSync'),
+  rmdir: () => throwError('rmdir'),
+  rmdirSync: () => throwError('rmdirSync'),
+  unlink: () => throwError('unlink'),
+  unlinkSync: () => throwError('unlinkSync'),
+  rmSync: () => throwError('rmSync'),
+  stat: () => throwError('stat'),
+  statSync: () => throwError('statSync'),
+  
+  // Mock fs constants that might be referenced
+  constants: {
+    F_OK: 0,
+    R_OK: 4,
+    W_OK: 2,
+    X_OK: 1,
+  },
+  
+  // Mock createReadStream and createWriteStream
+  createReadStream: () => throwError('createReadStream'),
+  createWriteStream: () => throwError('createWriteStream'),
+  
+  // Promises namespace
+  promises: {
+    readFile: () => throwError('promises.readFile'),
+    writeFile: () => throwError('promises.writeFile'),
+    mkdir: () => throwError('promises.mkdir'),
+    rmdir: () => throwError('promises.rmdir'),
+    unlink: () => throwError('promises.unlink'),
+    stat: () => throwError('promises.stat'),
+  }
+};

package/node-polyfills/path-polyfill.js

@@ -0,0 +1,36 @@
+/**
+ * Path module polyfill for React Native
+ * 
+ * This provides a minimal path module implementation that works in React Native.
+ * Uses path-browserify for most functionality but adds React Native specific handling.
+ */
+
+const pathBrowserify = require('path-browserify');
+
+console.warn('path polyfill: Using browserify path implementation for React Native.');
+
+// Export all path-browserify functionality
+module.exports = {
+  ...pathBrowserify,
+  
+  // Override or add any React Native specific path handling if needed
+  resolve: (...paths) => {
+    // In React Native, we don't have access to process.cwd()
+    // so we handle relative paths differently
+    return pathBrowserify.resolve(...paths);
+  },
+  
+  // Ensure we handle React Native bundle paths correctly
+  join: (...paths) => {
+    return pathBrowserify.join(...paths);
+  },
+  
+  // React Native specific helpers
+  isAbsolute: (path) => {
+    // In React Native, absolute paths might start with different prefixes
+    return pathBrowserify.isAbsolute(path) || 
+           path.startsWith('file://') || 
+           path.startsWith('bundle://') ||
+           path.startsWith('content://');
+  },
+};

package/node-polyfills/process-polyfill.js

@@ -0,0 +1,61 @@
+/**
+ * Process polyfill for React Native
+ * 
+ * This extends the basic process polyfill with React Native specific environment handling.
+ */
+
+const processPolyfill = require('process/browser');
+
+// Enhance the basic process polyfill for React Native
+const enhancedProcess = {
+  ...processPolyfill,
+  
+  // React Native specific environment
+  platform: 'react-native',
+  
+  // Ensure we have proper environment variables
+  env: {
+    ...processPolyfill.env,
+    NODE_ENV: processPolyfill.env.NODE_ENV || 'production',
+    // React Native specific environment indicators
+    REACT_NATIVE: true,
+    REACT_NATIVE_DEBUGGER: typeof __DEV__ !== 'undefined' && __DEV__,
+  },
+  
+  // React Native doesn't have these, so provide safe defaults
+  cwd: () => '/',
+  chdir: () => {
+    console.warn('process.chdir() is not supported in React Native');
+  },
+  
+  // Add React Native detection
+  versions: {
+    ...processPolyfill.versions,
+    'react-native': '0.70.0', // Indicate React Native environment
+  },
+  
+  // Override stdout/stderr for React Native
+  stdout: {
+    write: (data) => console.log(data),
+    isTTY: false,
+  },
+  stderr: {
+    write: (data) => console.error(data),
+    isTTY: false,
+  },
+  
+  // Add hrtime polyfill for React Native
+  hrtime: (time) => {
+    const now = Date.now() * 1e-3;
+    if (time) {
+      const [seconds, nanoseconds] = time;
+      const diff = now - (seconds + nanoseconds * 1e-9);
+      const diffSeconds = Math.floor(diff);
+      const diffNanoseconds = Math.floor((diff - diffSeconds) * 1e9);
+      return [diffSeconds, diffNanoseconds];
+    }
+    return [Math.floor(now), Math.floor((now % 1) * 1e9)];
+  },
+};
+
+module.exports = enhancedProcess;

package/node-polyfills/url-polyfill.js

@@ -0,0 +1,32 @@
+/**
+ * URL module polyfill for React Native
+ * 
+ * This provides URL parsing functionality for React Native using the 'url' package.
+ */
+
+// Use the existing url package which should work in React Native
+const url = require('url');
+
+console.warn('url polyfill: Using url package for React Native URL parsing.');
+
+// Export the url module functionality
+module.exports = {
+  ...url,
+  
+  // Ensure URL and URLSearchParams are available as globals if needed
+  URL: typeof URL !== 'undefined' ? URL : require('url').URL,
+  URLSearchParams: typeof URLSearchParams !== 'undefined' ? URLSearchParams : require('url').URLSearchParams,
+  
+  // Add React Native specific URL handling if needed
+  parse: (urlString, parseQueryString, slashesDenoteHost) => {
+    return url.parse(urlString, parseQueryString, slashesDenoteHost);
+  },
+  
+  format: (urlObject) => {
+    return url.format(urlObject);
+  },
+  
+  resolve: (from, to) => {
+    return url.resolve(from, to);
+  },
+};

package/node-polyfills/util-polyfill.js

@@ -0,0 +1,76 @@
+/**
+ * Util module polyfill for React Native
+ * 
+ * This provides Node.js util functionality for React Native.
+ */
+
+// Use the util package which should work in React Native  
+const util = require('util');
+
+console.warn('util polyfill: Using util package for React Native.');
+
+// Ensure promisify is available - this is critical for crypto operations
+const promisify = util.promisify || ((fn) => {
+  return function promisified(...args) {
+    return new Promise((resolve, reject) => {
+      fn.call(this, ...args, (err, result) => {
+        if (err) reject(err);
+        else resolve(result);
+      });
+    });
+  };
+});
+
+// Export util functionality with React Native enhancements
+module.exports = {
+  ...util,
+  
+  // Ensure promisify is always available
+  promisify,
+  
+  // Add React Native safe implementations
+  inspect: (obj, options = {}) => {
+    // In React Native, we might not have full util.inspect capabilities
+    if (typeof obj === 'object' && obj !== null) {
+      try {
+        return JSON.stringify(obj, null, options.depth || 2);
+      } catch (error) {
+        return '[Object object]';
+      }
+    }
+    return String(obj);
+  },
+  
+  // Provide format function
+  format: util.format || ((f, ...args) => {
+    let index = 0;
+    return f.replace(/%[sdj%]/g, (match) => {
+      if (index >= args.length) return match;
+      switch (match) {
+        case '%s': return String(args[index++]);
+        case '%d': return Number(args[index++]);
+        case '%j':
+          try {
+            return JSON.stringify(args[index++]);
+          } catch (error) {
+            return '[Circular]';
+          }
+        case '%%': return '%';
+        default:
+          return match;
+      }
+    });
+  }),
+  
+  // Provide deprecate function
+  deprecate: util.deprecate || ((fn, msg) => {
+    let warned = false;
+    return function deprecated(...args) {
+      if (!warned) {
+        console.warn(msg);
+        warned = true;
+      }
+      return fn.apply(this, args);
+    };
+  }),
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dop-wallet-v6",
-  "version": "1.2.13",
+  "version": "1.2.15",
   "description": "DOP Wallet SDK, compatible with mobile, browser and nodejs environments.",
   "main": "dist/index.js",
   "license": "MIT",
@@ -14,6 +14,7 @@
   ],
   "exports": {
     ".": "./dist/index.js",
+    "./react-native": "./react-native.js",
     "./react-native-shims": "./react-native-shims.js"
   },
   "scripts": {
@@ -29,7 +30,8 @@
     "eslint": "eslint src/**/* --ext .ts,.tsx --ignore-pattern **/*.graphql --fix",
     "lint": "npm run check-circular-deps && npm run eslint && npm run tsc && npm run tsc-test",
     "prepare": "npm run build",
-    "postinstall": "node postinstall.js"
+    "postinstall": "node postinstall.js",
+    "verify-rn-compatibility": "node verify-react-native-compatibility.cjs"
   },
   "dependencies": {
     "@graphql-mesh/cross-helpers": "^0.3.4",
@@ -44,6 +46,7 @@
     "@noble/ed25519": "^1.7.1",
     "@react-native-async-storage/async-storage": "^1.24.0",
     "@whatwg-node/fetch": "^0.8.4",
+    "@zk-kit/eddsa-poseidon": "^1.1.0",
     "assert": "2.0.0",
     "axios": "1.7.2",
     "brotli": "^1.3.3",
@@ -57,6 +60,7 @@
     "events": "3.3.0",
     "graphql": "^16.6.0",
     "memdown": "^6.1.1",
+    "poseidon-lite": "^0.3.0",
     "stream-browserify": "3.0.0"
   },
   "devDependencies": {
@@ -87,16 +91,23 @@
     "typescript": "^4.9.4"
   },
   "peerDependencies": {
+    "@iden3/react-native-rapidsnark": "^0.0.1-beta.1",
     "@react-native-async-storage/async-storage": "^1.24.0"
   },
   "peerDependenciesMeta": {
     "@react-native-async-storage/async-storage": {
       "optional": false
+    },
+    "@iden3/react-native-rapidsnark": {
+      "optional": true
     }
   },
   "react-native": {
     "crypto": false,
-    "util": false
+    "util": false,
+    "fs": false,
+    "path": false,
+    "os": false
   },
   "resolutions": {
     "ethers": "6.13.1"

package/problem.md

@@ -0,0 +1,41 @@
+1.3 Mnemonic Handling
+Docs suggested passing undefined to createDopWallet so it would generate a mnemonic automatically:
+
+const wallet = await createDopWallet(encryptionKey, undefined, creationBlockNumbers);
+
+However, in React Native this failed with:
+[wallet] failed: Error: Invalid mnemonic type: undefined

Resolution:
 Instead of relying on auto-generation, we had to supply a valid 12-word Metamask seed phrase directly.
+1.4 Encryption Key & Wallet Creation (merged with 3)
+This was the biggest blocker.
+Issue: Wrong Encryption Key Format
+When trying plain strings (like "abcdefghijklmnopqrstuvwxyzabcdqa..."), the engine threw:
+[wallet] failed: Error: encryptionKey must be a 32-byte string
+Even when using a 64-character hex string (which visually looked correct length), the SDK still rejected it.
+Root Cause:
+The DOP engine expects a raw 32-byte Uint8Array, not a text string.
+"abcd..." → string length, not raw bytes
+"4b22bfaa2cd4826c04efa..." (64 hex chars) → still a string, needed conversion
+Fix: Convert Hex → Bytes
+We converted to Buffer / Uint8Array before passing:
+
+import { Buffer } from 'buffer';

const encryptionKeyHex = '4b22bfaa2cd4826c04efa1beb5c3debf8a534223200ce50ce3ca979af93911c1';
const encryptionKey = Buffer.from(encryptionKeyHex, 'hex'); // 32 bytes
+
+Validated with:

+console.log(Buffer.from(encryptionKeyHex, 'hex').length); // 32
+
+
+✅ Now the key passed validation. But still there was some issue, issue explained below-
+Issue: Wallet Creation “Stuck”
+At times, wallet creation froze after:
+DOP Engine initialized successfully
Calling createNewWallet...
Creating new wallet with encryption key...
+and never returned.


+Supposed Root Causes:
+Passing undefined mnemonic (engine waited indefinitely).
+Wrong encryption key type (string instead of raw bytes).
+Heavy sync overhead (engine scanning entire chain).
+Tried Fixes:
+Passed a valid mnemonic instead of undefined.
+Correctly used a raw 32-byte Uint8Array for encryptionKey.
+Added:
+const skipMerkletreeScans = true;
const creationBlockNumbers = { [NetworkName.EthereumSepolia]: 6000000 };

+to reduce sync load during testing.

After trying all fixes and debugging, now there were no errors in logs, but the wallet creation never succeded, it always seemed to be stuck, but showed no errors.

package/react-native-shims.js

@@ -29,10 +29,12 @@ global.crypto.subtle.digest ??= (algorithm, data) => {
   return cryptoBrowserify.createHash(algo).update(data).digest();
 };
 
-// CRITICAL FIX: Force circomlibjs to use synchronous mode in React Native
+// CRITICAL FIX: Force optimal crypto libraries for React Native
 // This prevents hanging during wallet creation due to Web Worker incompatibility
 if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
-  // Disable Web Workers and WebAssembly for circomlibjs
+  console.log('🔧 Applying React Native crypto optimizations...');
+  
+  // Disable Web Workers and WebAssembly for circomlibjs fallback
   global.Worker = undefined;
   global.WebAssembly = undefined;
   
@@ -65,18 +67,33 @@ if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
     }
     return originalSetTimeout.apply(this, arguments);
   };
+  
+  console.log('✅ React Native crypto optimizations applied');
 }
 
 /**
+ * React Native Compatibility Information:
+ * 
+ * This SDK now uses lightweight crypto alternatives for React Native:
+ * - poseidon-lite: Lightweight poseidon hash (replaces circomlibjs poseidon)
+ * - @zk-kit/eddsa-poseidon: EdDSA operations (replaces circomlibjs eddsa)
+ * - @iden3/react-native-rapidsnark: Fast proof generation (optional, recommended)
+ * 
+ * Benefits:
+ * - Faster initialization and smaller bundle size
+ * - No Web Worker dependencies
+ * - Better mobile performance
+ * - Native iOS/Android compilation support via rapidsnark
+ * 
+ * Installation for React Native projects:
+ * npm install @react-native-async-storage/async-storage react-native-get-random-values
+ * npm install @iden3/react-native-rapidsnark  # Optional but recommended
+ * 
  * Other package.json dependencies and why we need them:
- * - assert:
- *   - engine uses circomlibjs which uses assert
- * - events:
- *   - engine uses EventEmitter;
- *   - engine uses levelup which uses EventEmitter
- * - stream-browserify:
- *   - engine uses AES encryption, which we shim with browserify-aes, which
- *     needs cipher-base, which needs stream
+ * - assert: engine uses circomlibjs which uses assert (now uses lightweight alternatives)
+ * - events: engine uses EventEmitter; engine uses levelup which uses EventEmitter
+ * - stream-browserify: engine uses AES encryption, which we shim with browserify-aes,
+ *   which needs cipher-base, which needs stream
  * 
  * AsyncStorage Compatibility Note:
  * - This wallet SDK is compatible with React Native 0.60+ which moved AsyncStorage

package/react-native.js

@@ -0,0 +1,12 @@
+/**
+ * React Native specific entry point for DOP Wallet SDK
+ * 
+ * This file provides React Native-specific initialization and polyfill setup.
+ * Import this before importing the main SDK to ensure proper React Native compatibility.
+ */
+
+// Apply React Native shims first
+require('./react-native-shims');
+
+// Re-export the main SDK
+module.exports = require('./dist/index.js');