@impakers/debug 1.4.7 → 1.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react.js +14 -69
- package/dist/react.js.map +1 -1
- package/dist/react.mjs +14 -69
- package/dist/react.mjs.map +1 -1
- package/package.json +2 -2
package/dist/react.js
CHANGED
|
@@ -1569,68 +1569,14 @@ function findNearestComponentSource(element, maxAncestors = 10) {
|
|
|
1569
1569
|
}
|
|
1570
1570
|
|
|
1571
1571
|
// src/utils/capture-element.ts
|
|
1572
|
-
var UNSUPPORTED_RE = /oklab|oklch|color-mix/i;
|
|
1573
|
-
function sanitizeUnsupportedColors(clonedDoc) {
|
|
1574
|
-
try {
|
|
1575
|
-
for (let i = 0; i < clonedDoc.styleSheets.length; i++) {
|
|
1576
|
-
try {
|
|
1577
|
-
const sheet = clonedDoc.styleSheets[i];
|
|
1578
|
-
const rules = sheet.cssRules || sheet.rules;
|
|
1579
|
-
if (!rules) continue;
|
|
1580
|
-
sanitizeCSSRules(sheet, rules);
|
|
1581
|
-
} catch {
|
|
1582
|
-
}
|
|
1583
|
-
}
|
|
1584
|
-
} catch {
|
|
1585
|
-
}
|
|
1586
|
-
clonedDoc.querySelectorAll("style").forEach((styleEl) => {
|
|
1587
|
-
const text = styleEl.textContent || "";
|
|
1588
|
-
if (UNSUPPORTED_RE.test(text)) {
|
|
1589
|
-
styleEl.textContent = text.replace(
|
|
1590
|
-
/[^{};\n]+:\s*[^;{}]*(?:oklab|oklch|color-mix|lch|lab)\([^)]*(?:\([^)]*\))*[^)]*\)[^;{}]*/gi,
|
|
1591
|
-
""
|
|
1592
|
-
);
|
|
1593
|
-
}
|
|
1594
|
-
});
|
|
1595
|
-
clonedDoc.querySelectorAll("*").forEach((el) => {
|
|
1596
|
-
const s = el.style;
|
|
1597
|
-
if (!s?.cssText) return;
|
|
1598
|
-
if (UNSUPPORTED_RE.test(s.cssText)) {
|
|
1599
|
-
s.cssText = s.cssText.replace(
|
|
1600
|
-
/[^;]*(?:oklab|oklch|color-mix|lch|lab)\([^)]*(?:\([^)]*\))*[^)]*\)[^;]*/gi,
|
|
1601
|
-
""
|
|
1602
|
-
);
|
|
1603
|
-
}
|
|
1604
|
-
});
|
|
1605
|
-
}
|
|
1606
|
-
function sanitizeCSSRules(sheet, rules) {
|
|
1607
|
-
for (let j = rules.length - 1; j >= 0; j--) {
|
|
1608
|
-
const rule = rules[j];
|
|
1609
|
-
if ("cssRules" in rule && rule.cssRules) {
|
|
1610
|
-
sanitizeCSSRules(sheet, rule.cssRules);
|
|
1611
|
-
continue;
|
|
1612
|
-
}
|
|
1613
|
-
if (rule instanceof CSSStyleRule) {
|
|
1614
|
-
const style = rule.style;
|
|
1615
|
-
for (let k = style.length - 1; k >= 0; k--) {
|
|
1616
|
-
const prop = style[k];
|
|
1617
|
-
const val = style.getPropertyValue(prop);
|
|
1618
|
-
if (UNSUPPORTED_RE.test(val)) {
|
|
1619
|
-
style.setProperty(prop, "transparent");
|
|
1620
|
-
}
|
|
1621
|
-
}
|
|
1622
|
-
}
|
|
1623
|
-
}
|
|
1624
|
-
}
|
|
1625
1572
|
async function captureElement(el, options = {}) {
|
|
1626
1573
|
const { quality = 0.7, maxScale = 2 } = options;
|
|
1627
|
-
const html2canvas = (await import("html2canvas")).default;
|
|
1574
|
+
const html2canvas = (await import("html2canvas-pro")).default;
|
|
1628
1575
|
const canvas = await html2canvas(el, {
|
|
1629
1576
|
useCORS: true,
|
|
1630
1577
|
allowTaint: true,
|
|
1631
1578
|
scale: Math.min(window.devicePixelRatio, maxScale),
|
|
1632
|
-
logging: false
|
|
1633
|
-
onclone: (clonedDoc) => sanitizeUnsupportedColors(clonedDoc)
|
|
1579
|
+
logging: false
|
|
1634
1580
|
});
|
|
1635
1581
|
return canvas.toDataURL("image/jpeg", quality);
|
|
1636
1582
|
}
|
|
@@ -1641,15 +1587,14 @@ async function captureFullPage(options = {}) {
|
|
|
1641
1587
|
const hiddenEls = document.querySelectorAll(allSelectors.join(", "));
|
|
1642
1588
|
try {
|
|
1643
1589
|
hiddenEls.forEach((el) => el.style.visibility = "hidden");
|
|
1644
|
-
const html2canvas = (await import("html2canvas")).default;
|
|
1590
|
+
const html2canvas = (await import("html2canvas-pro")).default;
|
|
1645
1591
|
const canvas = await html2canvas(document.body, {
|
|
1646
1592
|
useCORS: true,
|
|
1647
1593
|
allowTaint: true,
|
|
1648
1594
|
scale: 1,
|
|
1649
1595
|
logging: false,
|
|
1650
1596
|
width: window.innerWidth,
|
|
1651
|
-
height: window.innerHeight
|
|
1652
|
-
onclone: (clonedDoc) => sanitizeUnsupportedColors(clonedDoc)
|
|
1597
|
+
height: window.innerHeight
|
|
1653
1598
|
});
|
|
1654
1599
|
return canvas.toDataURL("image/jpeg", quality);
|
|
1655
1600
|
} catch {
|
|
@@ -3936,10 +3881,10 @@ function DebugWidget({ endpoint, getUser, onHide }) {
|
|
|
3936
3881
|
if (routeMatch?.context) {
|
|
3937
3882
|
metadata.routeDebug = routeMatch.context;
|
|
3938
3883
|
}
|
|
3939
|
-
const
|
|
3884
|
+
const debugParts = [];
|
|
3940
3885
|
if (debugTargets.length > 0) {
|
|
3941
|
-
|
|
3942
|
-
"
|
|
3886
|
+
debugParts.push(
|
|
3887
|
+
"**\uB514\uBC84\uAE45 \uD0C0\uAC9F \uD30C\uC77C**:",
|
|
3943
3888
|
...debugTargets.map((target) => {
|
|
3944
3889
|
const suffix = target.line ? `:${target.line}${typeof target.column === "number" ? `:${target.column}` : ""}` : "";
|
|
3945
3890
|
return `- [${target.kind}] \`${target.file}${suffix}\` (${target.reason})`;
|
|
@@ -3974,29 +3919,29 @@ function DebugWidget({ endpoint, getUser, onHide }) {
|
|
|
3974
3919
|
elementInfo.push(`**\uC811\uADFC\uC131**: ${pendingAnnotation.accessibility}`);
|
|
3975
3920
|
}
|
|
3976
3921
|
if (elementInfo.length > 0) {
|
|
3977
|
-
|
|
3978
|
-
|
|
3922
|
+
debugParts.push(`
|
|
3979
3923
|
---
|
|
3980
3924
|
${elementInfo.join("\n")}`);
|
|
3981
3925
|
}
|
|
3982
3926
|
if (metadata.consoleErrors?.length) {
|
|
3983
|
-
|
|
3927
|
+
debugParts.push(`
|
|
3984
3928
|
**\uCD5C\uADFC \uCF58\uC194 \uC5D0\uB7EC**:`);
|
|
3985
|
-
metadata.consoleErrors.slice(-10).forEach((e) =>
|
|
3929
|
+
metadata.consoleErrors.slice(-10).forEach((e) => debugParts.push(`- \`${e.slice(0, 200)}\``));
|
|
3986
3930
|
}
|
|
3987
3931
|
if (metadata.consoleLogs?.length) {
|
|
3988
3932
|
const recentLogs = metadata.consoleLogs.filter((l) => l.level === "error" || l.level === "warn").slice(-10);
|
|
3989
3933
|
if (recentLogs.length > 0) {
|
|
3990
|
-
|
|
3934
|
+
debugParts.push(`
|
|
3991
3935
|
**\uCD5C\uADFC \uCF58\uC194 \uB85C\uADF8**:`);
|
|
3992
|
-
recentLogs.forEach((l) =>
|
|
3936
|
+
recentLogs.forEach((l) => debugParts.push(`- [${l.level}] \`${l.message.slice(0, 200)}\``));
|
|
3993
3937
|
}
|
|
3994
3938
|
}
|
|
3995
3939
|
const result = await submitFeedback(endpoint, {
|
|
3996
3940
|
title: comment.slice(0, 100),
|
|
3997
|
-
description:
|
|
3941
|
+
description: comment,
|
|
3998
3942
|
priority: "medium",
|
|
3999
3943
|
metadata,
|
|
3944
|
+
debugInfo: debugParts.length > 0 ? debugParts.join("\n") : void 0,
|
|
4000
3945
|
screenshot,
|
|
4001
3946
|
feedbackUrl: window.location.pathname,
|
|
4002
3947
|
feedbackMarker: {
|