@impakers/debug 1.4.8 → 1.4.9

package/dist/react.js

@@ -1569,70 +1569,14 @@ function findNearestComponentSource(element, maxAncestors = 10) {
 }
 
 // src/utils/capture-element.ts
-var UNSUPPORTED_RE = /\b(?:oklab|oklch|color-mix|(?<![\w-])lab|(?<![\w-])lch)\s*\(/i;
-var COLOR_PROPS = [
-  "color",
-  "background-color",
-  "background-image",
-  "background",
-  "border-color",
-  "border-top-color",
-  "border-right-color",
-  "border-bottom-color",
-  "border-left-color",
-  "outline-color",
-  "text-decoration-color",
-  "box-shadow",
-  "text-shadow",
-  "caret-color",
-  "column-rule-color",
-  "fill",
-  "stroke",
-  "stop-color",
-  "flood-color",
-  "lighting-color"
-];
-function sanitizeUnsupportedColors(clonedDoc) {
-  const allEls = clonedDoc.querySelectorAll("*");
-  for (let i = 0; i < allEls.length; i++) {
-    const el = allEls[i];
-    if (!el.style) continue;
-    let cs = null;
-    for (const prop of COLOR_PROPS) {
-      const inlineVal = el.style.getPropertyValue(prop);
-      if (inlineVal && UNSUPPORTED_RE.test(inlineVal)) {
-        el.style.setProperty(prop, getFallback(prop));
-        continue;
-      }
-      if (!cs) {
-        try {
-          cs = clonedDoc.defaultView.getComputedStyle(el);
-        } catch {
-          break;
-        }
-      }
-      const val = cs.getPropertyValue(prop);
-      if (val && UNSUPPORTED_RE.test(val)) {
-        el.style.setProperty(prop, getFallback(prop));
-      }
-    }
-  }
-}
-function getFallback(prop) {
-  if (prop === "background-image" || prop === "background") return "none";
-  if (prop === "box-shadow" || prop === "text-shadow") return "none";
-  if (prop === "color") return "inherit";
-  return "transparent";
-}
 async function captureElement(el, options = {}) {
   const { quality = 0.7, maxScale = 2 } = options;
-  const html2canvas = (await import("html2canvas")).default;
+  const html2canvas = (await import("html2canvas-pro")).default;
   const canvas = await html2canvas(el, {
     useCORS: true,
     allowTaint: true,
     scale: Math.min(window.devicePixelRatio, maxScale),
-    logging: false,
-    onclone: (clonedDoc) => sanitizeUnsupportedColors(clonedDoc)
+    logging: false
   });
   return canvas.toDataURL("image/jpeg", quality);
 }
@@ -1643,15 +1587,14 @@ async function captureFullPage(options = {}) {
   const hiddenEls = document.querySelectorAll(allSelectors.join(", "));
   try {
     hiddenEls.forEach((el) => el.style.visibility = "hidden");
-    const html2canvas = (await import("html2canvas")).default;
+    const html2canvas = (await import("html2canvas-pro")).default;
     const canvas = await html2canvas(document.body, {
       useCORS: true,
       allowTaint: true,
       scale: 1,
       logging: false,
       width: window.innerWidth,
-      height: window.innerHeight,
-      onclone: (clonedDoc) => sanitizeUnsupportedColors(clonedDoc)
+      height: window.innerHeight
     });
     return canvas.toDataURL("image/jpeg", quality);
   } catch {
@@ -3938,10 +3881,10 @@ function DebugWidget({ endpoint, getUser, onHide }) {
         if (routeMatch?.context) {
           metadata.routeDebug = routeMatch.context;
         }
-        const descriptionParts = [comment];
+        const debugParts = [];
         if (debugTargets.length > 0) {
-          descriptionParts.push(
-            "\n\n---\n**\uB514\uBC84\uAE45 \uD0C0\uAC9F \uD30C\uC77C**:",
+          debugParts.push(
+            "**\uB514\uBC84\uAE45 \uD0C0\uAC9F \uD30C\uC77C**:",
             ...debugTargets.map((target) => {
               const suffix = target.line ? `:${target.line}${typeof target.column === "number" ? `:${target.column}` : ""}` : "";
               return `- [${target.kind}] \`${target.file}${suffix}\` (${target.reason})`;
@@ -3976,29 +3919,29 @@ function DebugWidget({ endpoint, getUser, onHide }) {
           elementInfo.push(`**\uC811\uADFC\uC131**: ${pendingAnnotation.accessibility}`);
         }
         if (elementInfo.length > 0) {
-          descriptionParts.push(`
-
+          debugParts.push(`
 ---
 ${elementInfo.join("\n")}`);
         }
         if (metadata.consoleErrors?.length) {
-          descriptionParts.push(`
+          debugParts.push(`
 **\uCD5C\uADFC \uCF58\uC194 \uC5D0\uB7EC**:`);
-          metadata.consoleErrors.slice(-10).forEach((e) => descriptionParts.push(`- \`${e.slice(0, 200)}\``));
+          metadata.consoleErrors.slice(-10).forEach((e) => debugParts.push(`- \`${e.slice(0, 200)}\``));
         }
         if (metadata.consoleLogs?.length) {
           const recentLogs = metadata.consoleLogs.filter((l) => l.level === "error" || l.level === "warn").slice(-10);
           if (recentLogs.length > 0) {
-            descriptionParts.push(`
+            debugParts.push(`
 **\uCD5C\uADFC \uCF58\uC194 \uB85C\uADF8**:`);
-            recentLogs.forEach((l) => descriptionParts.push(`- [${l.level}] \`${l.message.slice(0, 200)}\``));
+            recentLogs.forEach((l) => debugParts.push(`- [${l.level}] \`${l.message.slice(0, 200)}\``));
           }
         }
         const result = await submitFeedback(endpoint, {
           title: comment.slice(0, 100),
-          description: descriptionParts.join("\n"),
+          description: comment,
           priority: "medium",
           metadata,
+          debugInfo: debugParts.length > 0 ? debugParts.join("\n") : void 0,
           screenshot,
           feedbackUrl: window.location.pathname,
           feedbackMarker: {