fix(misc): address comments

Author: mandarini

packages/core/supabase-js/test/bundle-hermes-compat.test.cjs

@@ -1,11 +1,15 @@
 /**
- * Hermes Compatibility Test
+ * Hermes + CSP Compatibility Test
  *
- * Asserts dist/index.cjs contains no bare import() expressions.
- * hermesc (React Native bytecode compiler) rejects import() at parse time —
- * before dead-code elimination — so the syntax must be physically absent.
- * The only allowed occurrence is inside a new Function() string body, which
- * is opaque to all static parsers including hermesc.
+ * Asserts dist/index.cjs contains:
+ *   - No import() expressions  -> hermesc (React Native bytecode compiler) rejects
+ *     import() at parse time, before dead-code elimination.
+ *   - No new Function() calls  -> browsers with a strict Content-Security-Policy
+ *     (no 'unsafe-eval') block new Function() identically to eval() at runtime.
+ *
+ * Both constraints are satisfied by pointing the CJS bundle at the TypeScript
+ * CommonJS-compiled output of @supabase/tracing (dist/main/), where import()
+ * has already been downcompiled to require() by tsc.
  *
  * Run with: node test/bundle-hermes-compat.test.cjs
  */
@@ -14,31 +18,25 @@ const assert = require('assert')
 const fs = require('fs')
 const path = require('path')
 
-console.log('Testing Hermes (React Native) compatibility...\n')
+console.log('Testing Hermes + CSP compatibility of dist/index.cjs...\n')
 
 const cjsPath = path.join(__dirname, '../dist/index.cjs')
 const cjs = fs.readFileSync(cjsPath, 'utf8')
-const lines = cjs.split('\n')
 
-let bareImportCount = 0
-for (let i = 0; i < lines.length; i++) {
-  const line = lines[i]
-  if (!line.includes('import(')) continue
-  if (!line.includes('new Function(')) {
-    bareImportCount++
-    console.error(
-      `❌ Bare import() at line ${i + 1}:\n   ${line.trim()}\n` +
-        `   This breaks hermesc (Hermes bytecode compiler for React Native).`
-    )
-  }
-}
+// Check 1: no import() expressions (breaks hermesc / React Native)
+assert.ok(
+  !cjs.includes('import('),
+  'dist/index.cjs contains import() — breaks hermesc (Hermes bytecode compiler for React Native)'
+)
+console.log('1. No import() expressions in dist/index.cjs')
+console.log('   Hermes-safe (React Native compatible)\n')
 
-assert.strictEqual(
-  bareImportCount,
-  0,
-  `${bareImportCount} bare import() expression(s) in dist/index.cjs — breaks React Native Hermes builds.`
+// Check 2: no new Function() (breaks browser strict CSP)
+assert.ok(
+  !cjs.includes('new Function('),
+  'dist/index.cjs contains new Function() — breaks browser strict Content-Security-Policy (unsafe-eval)'
 )
+console.log('2. No new Function() in dist/index.cjs')
+console.log('   CSP-safe (no unsafe-eval required)\n')
 
-console.log('1. No bare import() expressions in dist/index.cjs')
-console.log('   ✅ Hermes-safe (React Native compatible)\n')
-console.log('🎉 Hermes compatibility test passed!')
+console.log('All Hermes + CSP compatibility checks passed.')

packages/core/supabase-js/tsdown.config.ts

@@ -1,4 +1,5 @@
 import { defineConfig } from 'tsdown'
+import { createRequire } from 'module'
 import { fileURLToPath } from 'url'
 import { dirname, join } from 'path'
 
@@ -26,6 +27,23 @@ export default defineConfig([
     fixedExtension: true,
     hash: false,
     target: 'es2017',
+    inputOptions: (_options, format) => {
+      if (format === 'cjs') {
+        // Rolldown always resolves @supabase/tracing via its 'import' export
+        // condition (ESM source) even for CJS output — so import() ends up in
+        // index.cjs. hermesc (Hermes bytecode compiler for React Native) rejects
+        // import() at parse time; browser strict CSP blocks new Function() at
+        // runtime. Aliasing to the package's 'main' field (dist/main/) gives us
+        // TypeScript's CJS-compiled require() — safe for both constraints.
+        return {
+          resolve: {
+            alias: {
+              '@supabase/tracing': createRequire(import.meta.url).resolve('@supabase/tracing'),
+            },
+          },
+        }
+      }
+    },
   },
   // IIFE build for CDN (jsdelivr/unpkg) - bundles EVERYTHING
   {

packages/shared/tracing/src/extract.ts

@@ -14,18 +14,9 @@ let otelModulePromise: Promise<any | null> | null = null
 // be installed in the consumer app; we look it up purely at runtime.
 const OTEL_PKG = '@opentelemetry/api'
 
-// Wrap import() in a Function constructor so the import() expression is
-// never present as syntax in the bundled output. hermesc (the Hermes bytecode
-// compiler used by React Native release builds) rejects import() at parse
-// time — before any dead-code elimination — so the syntax must be physically
-// absent from the bundle. new Function() bodies are opaque strings to all
-// static parsers, including hermesc.
-// eslint-disable-next-line no-new-func
-const _dynamicImport = new Function('p', 'return import(p)') as (pkg: string) => Promise<any>
-
 function loadOtel(): Promise<any | null> {
   if (otelModulePromise === null) {
-    otelModulePromise = _dynamicImport(OTEL_PKG).catch(() => null)
+    otelModulePromise = (import(OTEL_PKG) as Promise<any>).catch(() => null)
   }
   return otelModulePromise
 }