@watchforge/browser 0.1.15 → 0.1.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@watchforge/browser",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "main": "./src/index.js",
   "types": "./src/index.d.ts",
   "description": "WatchForge JavaScript SDK for browser JavaScript, Next.js, React, Node.js, and Express.js",

package/src/client.js

@@ -25,6 +25,7 @@ let CAPTURE_CONSOLE_ERRORS = true;
 let CAPTURE_RESOURCE_ERRORS = true;
 let CAPTURE_FAILED_REQUESTS = true;
 let CAPTURE_NODE_WARNINGS = false;
+let CAPTURE_NODE_MULTIPLE_RESOLVES = false;
 
 // Detect environment
 const isBrowser = typeof window !== "undefined";
@@ -594,6 +595,7 @@ export function register({
   captureResourceErrors = true,
   captureFailedRequests = true,
   captureNodeWarnings = false,
+  captureNodeMultipleResolves = false,
   projectRoot = null,
 }) {
   const nextBrowserRegisterKey = isBrowser
@@ -626,6 +628,7 @@ export function register({
   CAPTURE_RESOURCE_ERRORS = Boolean(captureResourceErrors);
   CAPTURE_FAILED_REQUESTS = Boolean(captureFailedRequests);
   CAPTURE_NODE_WARNINGS = Boolean(captureNodeWarnings);
+  CAPTURE_NODE_MULTIPLE_RESOLVES = Boolean(captureNodeMultipleResolves);
   setProjectRoot(
     projectRoot ||
       (isNode ? process.env.WATCHFORGE_PROJECT_ROOT || process.env.INIT_CWD : null)
@@ -682,11 +685,23 @@ export function register({
     });
 
     process.on("multipleResolves", (type, promise, reason) => {
+      addBreadcrumb({
+        type: "error",
+        level: "warning",
+        category: "process.multipleResolves",
+        message: `Node.js promise multipleResolves: ${type}`,
+        data: {
+          type,
+          reason: reason?.message || String(reason || ""),
+        },
+      });
+
+      if (!CAPTURE_NODE_MULTIPLE_RESOLVES) return;
       void captureException(
         normalizeException(reason, `Node.js promise multipleResolves: ${type}`),
         {
           tags: {
-            handled: false,
+            handled: true,
             mechanism: "process.multipleResolves",
             type,
           },

package/src/index.d.ts

@@ -13,6 +13,7 @@ export interface WatchForgeRegisterOptions {
   captureResourceErrors?: boolean;
   captureFailedRequests?: boolean;
   captureNodeWarnings?: boolean;
+  captureNodeMultipleResolves?: boolean;
   projectRoot?: string | null;
 }
 

package/src/stacktrace.js

@@ -122,6 +122,219 @@ function getUndefinedIdentifier(message) {
   return match?.[1] || null;
 }
 
+function getReadPropertyName(message) {
+  if (!message || typeof message !== "string") return null;
+  const match = message.match(/Cannot read properties of (?:null|undefined) \(reading ['"]([^'"]+)['"]\)/);
+  return match?.[1] || null;
+}
+
+function isJsonParseError(message) {
+  if (!message || typeof message !== "string") return false;
+  return (
+    /in JSON at position/i.test(message) ||
+    /Unexpected token .* in JSON/i.test(message) ||
+    (/SyntaxError/i.test(message) && /JSON/i.test(message))
+  );
+}
+
+function isUriError(message) {
+  if (!message || typeof message !== "string") return false;
+  return /URI(?:Error| malformed)/i.test(message) || /decodeURIComponent/i.test(message);
+}
+
+function isInvalidArrayLengthError(message) {
+  if (!message || typeof message !== "string") return false;
+  return /Invalid array length/i.test(message);
+}
+
+function lineHasJsonParse(line) {
+  return Boolean(line && /JSON\.parse\s*\(/.test(line));
+}
+
+function lineHasDecodeUriComponent(line) {
+  return Boolean(line && /decodeURIComponent\s*\(/.test(line));
+}
+
+function lineHasNewArray(line) {
+  return Boolean(line && /new Array\s*\(/.test(line));
+}
+
+function lineHasInvalidArrayLiteral(line) {
+  return Boolean(line && /new Array\s*\(\s*-/.test(line));
+}
+
+function isInsideSetTimeout(sourceLines, lineIndex, scopeStart = 0) {
+  for (let i = lineIndex; i >= Math.max(scopeStart, lineIndex - 12); i--) {
+    if (/setTimeout\s*\(/.test(sourceLines[i])) return true;
+  }
+  return false;
+}
+
+function lineLooksLikeJsxRender(line) {
+  if (!line || typeof line !== "string") return false;
+  const trimmed = line.trim();
+  return (
+    trimmed.startsWith("return (") ||
+    trimmed.startsWith("return <") ||
+    trimmed.startsWith("<") ||
+    /^<\//.test(trimmed)
+  );
+}
+
+function getFunctionScopeStart(sourceLines, functionName) {
+  if (!sourceLines?.length || !functionName) return -1;
+
+  const normalized = String(functionName).replace(/\.useEffect$/, "");
+  const patterns = [];
+
+  if (functionName.includes("useEffect")) {
+    patterns.push(/useEffect\s*\(/);
+  }
+  if (normalized && normalized !== "<anonymous>") {
+    const escaped = normalized.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    patterns.push(new RegExp(`\\b${escaped}\\s*=\\s*(?:async\\s*)?\\(`));
+    patterns.push(new RegExp(`function\\s+${escaped}\\s*\\(`));
+  }
+
+  for (const pattern of patterns) {
+    for (let i = 0; i < sourceLines.length; i++) {
+      if (pattern.test(sourceLines[i])) return i;
+    }
+  }
+
+  return -1;
+}
+
+function getUseEffectBodyRange(sourceLines, scopeStart) {
+  if (scopeStart < 0 || !sourceLines?.length) return null;
+
+  for (let i = scopeStart + 1; i < sourceLines.length; i++) {
+    if (/^\s*\}\s*,\s*\[/.test(sourceLines[i])) {
+      return { start: scopeStart, end: i };
+    }
+  }
+
+  return null;
+}
+
+function isInsideUseEffectBody(sourceLines, lineIndex, scopeStart) {
+  const range = getUseEffectBodyRange(sourceLines, scopeStart);
+  if (!range || lineIndex < 0) return scopeStart >= 0 ? lineIndex >= scopeStart : true;
+  return lineIndex >= range.start && lineIndex <= range.end;
+}
+
+function filterCandidatesToScope(sourceLines, candidates, scopeStart, functionName) {
+  if (!candidates.length) return candidates;
+  if (!functionName?.includes("useEffect") || scopeStart < 0) return candidates;
+
+  const inBody = candidates.filter((idx) =>
+    isInsideUseEffectBody(sourceLines, idx, scopeStart)
+  );
+  return inBody.length ? inBody : candidates;
+}
+
+function pickCandidateNearScope(sourceLines, candidates, scopeStart, functionName) {
+  if (!candidates.length) return null;
+
+  const scoped = filterCandidatesToScope(sourceLines, candidates, scopeStart, functionName);
+  if (scopeStart < 0) return scoped[0] + 1;
+
+  const afterStart = scoped.filter((idx) => idx >= scopeStart);
+  const pool = afterStart.length ? afterStart : scoped;
+  return pool[0] + 1;
+}
+
+function pickCandidatePreferringSetTimeout(sourceLines, candidates, scopeStart, functionName) {
+  if (!candidates.length) return null;
+
+  const scoped = filterCandidatesToScope(sourceLines, candidates, scopeStart, functionName);
+  const pool =
+    scopeStart >= 0
+      ? scoped.filter((idx) => idx >= scopeStart).length
+        ? scoped.filter((idx) => idx >= scopeStart)
+        : scoped
+      : scoped;
+
+  const inSetTimeout = pool.filter((idx) =>
+    isInsideSetTimeout(sourceLines, idx, scopeStart)
+  );
+  if (inSetTimeout.length) return inSetTimeout[0] + 1;
+
+  return pool[0] + 1;
+}
+
+function inferJsonParseLine(frame, sourceLines) {
+  if (!isJsonParseError(frame.error_message) || !sourceLines?.length) return null;
+
+  const candidates = [];
+  for (let i = 0; i < sourceLines.length; i++) {
+    if (lineHasJsonParse(sourceLines[i])) candidates.push(i);
+  }
+
+  const scopeStart = getFunctionScopeStart(sourceLines, frame.function);
+  return pickCandidatePreferringSetTimeout(
+    sourceLines,
+    candidates,
+    scopeStart,
+    frame.function
+  );
+}
+
+function inferUriErrorLine(frame, sourceLines) {
+  if (!isUriError(frame.error_message) || !sourceLines?.length) return null;
+
+  const candidates = [];
+  for (let i = 0; i < sourceLines.length; i++) {
+    if (lineHasDecodeUriComponent(sourceLines[i])) candidates.push(i);
+  }
+
+  const scopeStart = getFunctionScopeStart(sourceLines, frame.function);
+  return pickCandidatePreferringSetTimeout(
+    sourceLines,
+    candidates,
+    scopeStart,
+    frame.function
+  );
+}
+
+function inferInvalidArrayLengthLine(frame, sourceLines) {
+  if (!isInvalidArrayLengthError(frame.error_message) || !sourceLines?.length) return null;
+
+  const scopeStart = getFunctionScopeStart(sourceLines, frame.function);
+  const candidates = [];
+  for (let i = 0; i < sourceLines.length; i++) {
+    if (lineHasNewArray(sourceLines[i])) candidates.push(i);
+  }
+  if (!candidates.length) return null;
+
+  const scoped = scopeStart >= 0 ? candidates.filter((idx) => idx >= scopeStart) : candidates;
+  const pool = scoped.length ? scoped : candidates;
+
+  const negativeLiteral = pool.filter((idx) =>
+    lineHasInvalidArrayLiteral(sourceLines[idx])
+  );
+  if (negativeLiteral.length) return negativeLiteral[0] + 1;
+
+  const inSetTimeout = pool.filter((idx) =>
+    isInsideSetTimeout(sourceLines, idx, scopeStart)
+  );
+  if (inSetTimeout.length) return inSetTimeout[0] + 1;
+
+  return pool[0] + 1;
+}
+
+function lineHasToken(line, token) {
+  if (!line || !token) return false;
+  const tokenPattern = new RegExp(`\\b${token.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}\\b`);
+  return tokenPattern.test(line);
+}
+
+function lineHasPropertyAccess(line, property) {
+  if (!line || !property) return false;
+  const escaped = property.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  return new RegExp(`(?:\\.${escaped}\\b|\\[['"]${escaped}['"]\\]|\\["${escaped}"\\])`).test(line);
+}
+
 function inferLineFromErrorMessage(frame, sourceLines) {
   const identifier = getUndefinedIdentifier(frame.error_message);
   if (!identifier || !sourceLines?.length) return null;
@@ -155,6 +368,100 @@ function inferLineFromErrorMessage(frame, sourceLines) {
   return candidates[0] + 1;
 }
 
+function inferPropertyLineFromErrorMessage(frame, sourceLines) {
+  const property = getReadPropertyName(frame.error_message);
+  if (!property || !sourceLines?.length) return null;
+
+  for (let i = 0; i < sourceLines.length; i++) {
+    if (lineHasPropertyAccess(sourceLines[i], property)) {
+      return i + 1;
+    }
+  }
+
+  return null;
+}
+
+function setFrameLineFromSource(frame, sourceLines, lineno, tokenForColumn) {
+  if (!lineno || !sourceLines[lineno - 1]) return lineno;
+
+  frame.lineno = lineno;
+  if (tokenForColumn) {
+    const col = sourceLines[lineno - 1].indexOf(tokenForColumn);
+    if (col >= 0) frame.colno = col + 1;
+  }
+  return lineno;
+}
+
+function adjustLineFromErrorMessage(frame, sourceLines, lineno) {
+  if (!sourceLines?.length) return lineno;
+
+  const currentLine = lineno ? sourceLines[lineno - 1] : null;
+  const scopeStart = getFunctionScopeStart(sourceLines, frame.function);
+  const mappedOutsideUseEffect =
+    frame.function?.includes("useEffect") &&
+    lineno &&
+    !isInsideUseEffectBody(sourceLines, lineno - 1, scopeStart);
+  const mappedToRenderLine =
+    lineLooksLikeJsxRender(currentLine) &&
+    (frame.function?.includes("useEffect") || frame.function?.includes("setTimeout"));
+  const shouldReinfer = mappedToRenderLine || mappedOutsideUseEffect;
+
+  const identifier = getUndefinedIdentifier(frame.error_message);
+  if (identifier && (shouldReinfer || !lineHasToken(currentLine, identifier))) {
+    const inferredLine = inferLineFromErrorMessage(frame, sourceLines);
+    if (inferredLine) {
+      return setFrameLineFromSource(frame, sourceLines, inferredLine, identifier);
+    }
+  }
+
+  const property = getReadPropertyName(frame.error_message);
+  if (property && (shouldReinfer || !lineHasPropertyAccess(currentLine, property))) {
+    const inferredLine = inferPropertyLineFromErrorMessage(frame, sourceLines);
+    if (inferredLine) {
+      return setFrameLineFromSource(frame, sourceLines, inferredLine, `.${property}`);
+    }
+  }
+
+  if (isJsonParseError(frame.error_message) && (shouldReinfer || !lineHasJsonParse(currentLine))) {
+    const inferredLine = inferJsonParseLine(frame, sourceLines);
+    if (inferredLine) {
+      return setFrameLineFromSource(frame, sourceLines, inferredLine, "JSON.parse");
+    }
+  }
+
+  if (isUriError(frame.error_message) && (shouldReinfer || !lineHasDecodeUriComponent(currentLine))) {
+    const inferredLine = inferUriErrorLine(frame, sourceLines);
+    if (inferredLine) {
+      return setFrameLineFromSource(frame, sourceLines, inferredLine, "decodeURIComponent");
+    }
+  }
+
+  if (isInvalidArrayLengthError(frame.error_message)) {
+    const inferredLine = inferInvalidArrayLengthLine(frame, sourceLines);
+    if (inferredLine) {
+      const inferredSourceLine = sourceLines[inferredLine - 1];
+      const shouldReplace =
+        shouldReinfer ||
+        !lineHasNewArray(currentLine) ||
+        (lineHasInvalidArrayLiteral(inferredSourceLine) &&
+          !lineHasInvalidArrayLiteral(currentLine)) ||
+        (frame.function?.includes("useEffect") &&
+          isInsideSetTimeout(sourceLines, inferredLine - 1) &&
+          !isInsideSetTimeout(
+            sourceLines,
+            lineno ? lineno - 1 : -1,
+            getFunctionScopeStart(sourceLines, frame.function)
+          ));
+
+      if (shouldReplace) {
+        return setFrameLineFromSource(frame, sourceLines, inferredLine, "new Array");
+      }
+    }
+  }
+
+  return lineno;
+}
+
 function normalizeSourcePath(source) {
   if (!source) return "";
 
@@ -392,6 +699,8 @@ function resolveFrameLine(frame, lines) {
   let lineno = frame.lineno;
   if (!lines?.length || !lineno) return lineno;
 
+  lineno = adjustLineFromErrorMessage(frame, lines, lineno);
+
   if (lineno > lines.length) {
     const inferredLine = inferLineFromErrorMessage(frame, lines);
     if (inferredLine) {
@@ -569,6 +878,53 @@ function findInlineSourceMap(sourceText) {
   return null;
 }
 
+function isOriginalSourceFrame(frame) {
+  const normalized = normalizeSourcePath(frame.abs_path || frame.module || frame.raw_abs_path);
+  if (!normalized) return false;
+
+  if (/^_next\//.test(normalized) || /\/_next\//.test(normalized)) return false;
+  if (/\.(?:m?js|css)(?:\.map)?$/.test(normalized) && !/\.(?:tsx?|jsx?)$/.test(normalized)) {
+    return false;
+  }
+
+  return (
+    /(?:^|\/)src\/.+\.(?:tsx?|jsx?)$/.test(normalized) ||
+    /\.(?:tsx?|jsx?)$/.test(normalized)
+  );
+}
+
+function getSourceMapContentForFrame(frame, sourceMap) {
+  if (!sourceMap || !Array.isArray(sourceMap.sources)) return null;
+
+  const sourceIndex = sourceMap.sources.findIndex((source) =>
+    sourceMatchesFrame(source, frame.abs_path || frame.module || frame.raw_abs_path)
+  );
+  if (sourceIndex < 0) return null;
+
+  const content = Array.isArray(sourceMap.sourcesContent)
+    ? sourceMap.sourcesContent[sourceIndex]
+    : null;
+  if (!content) return null;
+
+  return {
+    source: sourceMap.sources[sourceIndex],
+    lines: content.split("\n"),
+  };
+}
+
+function applyOriginalSourceFrameContext(frame, sourceMap) {
+  if (!isOriginalSourceFrame(frame) || !frame.lineno) return false;
+
+  const sourceContent = getSourceMapContentForFrame(frame, sourceMap);
+  if (!sourceContent?.lines?.length) return false;
+  if (frame.lineno > sourceContent.lines.length) return false;
+
+  frame.abs_path = sourceContent.source;
+  frame.filename = normalizeSourcePath(sourceContent.source).split("/").pop() || frame.filename;
+  applySourceContext(frame, sourceContent.lines, frame.lineno);
+  return Boolean(frame.context_line);
+}
+
 async function findSourceMapForFrame(frame) {
   const wanted = normalizeSourcePath(frame.abs_path || frame.module);
   const scriptUrls = [];
@@ -615,29 +971,13 @@ async function findSourceMapForFrame(frame) {
 
 async function applySourceMapToFrame(frame, sourceMap) {
   try {
+    if (applyOriginalSourceFrameContext(frame, sourceMap)) {
+      return true;
+    }
+
     const SourceMapConsumer = await getSourceMapConsumer();
     if (!SourceMapConsumer) return false;
 
-    const sources = Array.isArray(sourceMap.sources) ? sourceMap.sources : [];
-    const contents = Array.isArray(sourceMap.sourcesContent)
-      ? sourceMap.sourcesContent
-      : [];
-    const matchedSourceIndex = sources.findIndex((candidate) =>
-      sourceMatchesFrame(candidate, frame.abs_path || frame.module || frame.raw_abs_path)
-    );
-
-    if (matchedSourceIndex >= 0 && contents[matchedSourceIndex]) {
-      const source = sources[matchedSourceIndex];
-      const sourceLines = contents[matchedSourceIndex].split("\n");
-      const originalLine = frame.lineno;
-      if (originalLine && originalLine <= sourceLines.length) {
-        frame.abs_path = source;
-        frame.filename = normalizeSourcePath(source).split("/").pop() || frame.filename;
-        applySourceContext(frame, sourceLines, originalLine);
-        if (frame.context_line) return true;
-      }
-    }
-
     const consumer = await new SourceMapConsumer(sourceMap);
     let source = null;
     let lineno = frame.lineno;
@@ -655,7 +995,7 @@ async function applySourceMapToFrame(frame, sourceMap) {
       }
     }
 
-    if (!source) {
+    if (!source && sourceMap.sources?.length) {
       source = sourceMap.sources?.find((candidate) =>
         sourceMatchesFrame(candidate, frame.abs_path)
       );
@@ -674,11 +1014,15 @@ async function applySourceMapToFrame(frame, sourceMap) {
 
     if (!content) return false;
 
+    const sourceLines = content.split("\n");
+    lineno = adjustLineFromErrorMessage(frame, sourceLines, lineno);
+    colno = frame.colno ?? colno;
+
     frame.abs_path = source;
     frame.filename = normalizeSourcePath(source).split("/").pop() || frame.filename;
     frame.lineno = lineno;
     frame.colno = colno;
-    applySourceContext(frame, content.split("\n"), lineno);
+    applySourceContext(frame, sourceLines, lineno);
     return Boolean(frame.context_line);
   } catch {
     return false;
@@ -737,20 +1081,30 @@ function getWebpackFrameArtifacts(frame) {
 async function enrichFrameWithBrowserSource(frame) {
   if (!frame.in_app || !frame.lineno) return;
 
+  if (isOriginalSourceFrame(frame)) {
+    const lines = await fetchBrowserSourceLines(frame.abs_path, frame.raw_abs_path);
+    if (lines) {
+      applySourceContext(frame, lines, frame.lineno);
+      if (frame.context_line) return;
+    }
+  }
+
   const webpackArtifacts = getWebpackFrameArtifacts(frame);
   if (webpackArtifacts?.sourceMap) {
     const applied = await applySourceMapToFrame(frame, webpackArtifacts.sourceMap);
     if (applied) return;
   }
 
-  if (webpackArtifacts?.lines) {
-    applySourceContext(frame, webpackArtifacts.lines, frame.lineno);
+  if (webpackArtifacts?.lines && !webpackArtifacts?.sourceMap) {
+    const lineno = resolveFrameLine(frame, webpackArtifacts.lines);
+    applySourceContext(frame, webpackArtifacts.lines, lineno);
     if (frame.context_line) return;
   }
 
   const lines = await fetchBrowserSourceLines(frame.abs_path, frame.raw_abs_path);
   if (lines) {
-    applySourceContext(frame, lines, frame.lineno);
+    const lineno = resolveFrameLine(frame, lines);
+    applySourceContext(frame, lines, lineno);
     if (frame.context_line) return;
   }