@fivepixels-js/react 0.2.9 → 0.2.10
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/components/icons/Icons.d.ts +3 -0
- package/dist/components/icons/Icons.d.ts.map +1 -1
- package/dist/components/icons/Icons.js +3 -0
- package/dist/components/icons/Icons.js.map +1 -1
- package/dist/components/overlay/DevicePreviewChrome.d.ts.map +1 -1
- package/dist/components/overlay/DevicePreviewChrome.js +119 -167
- package/dist/components/overlay/DevicePreviewChrome.js.map +1 -1
- package/dist/components/overlay/FloatingPinRail.d.ts.map +1 -1
- package/dist/components/overlay/FloatingPinRail.js +1 -0
- package/dist/components/overlay/FloatingPinRail.js.map +1 -1
- package/dist/components/panel/ReportControlPanel.d.ts.map +1 -1
- package/dist/components/panel/ReportControlPanel.js +7 -1
- package/dist/components/panel/ReportControlPanel.js.map +1 -1
- package/dist/components/report/FivePixels.d.ts.map +1 -1
- package/dist/components/report/FivePixels.js +5 -0
- package/dist/components/report/FivePixels.js.map +1 -1
- package/dist/components/report/ReportView.d.ts +1 -1
- package/dist/components/report/ReportView.d.ts.map +1 -1
- package/dist/components/report/ReportView.js +7 -1
- package/dist/components/report/ReportView.js.map +1 -1
- package/dist/components/ui/FloatingWindow.d.ts +1 -0
- package/dist/components/ui/FloatingWindow.d.ts.map +1 -1
- package/dist/components/ui/FloatingWindow.js +82 -6
- package/dist/components/ui/FloatingWindow.js.map +1 -1
- package/dist/hooks/report/assembleReportContextValue.d.ts.map +1 -1
- package/dist/hooks/report/useReportDraftSession.d.ts.map +1 -1
- package/dist/hooks/report/useReportDraftSession.js +11 -6
- package/dist/hooks/report/useReportDraftSession.js.map +1 -1
- package/dist/hooks/report/useReportMarkers.d.ts.map +1 -1
- package/dist/hooks/report/useReportMarkers.js +19 -18
- package/dist/hooks/report/useReportMarkers.js.map +1 -1
- package/dist/hooks/report/useReportState.d.ts.map +1 -1
- package/dist/hooks/useCurrentPathname.d.ts.map +1 -1
- package/dist/hooks/useCurrentPathname.js +10 -1
- package/dist/hooks/useCurrentPathname.js.map +1 -1
- package/dist/hooks/useDevicePreviewPreference.d.ts.map +1 -1
- package/dist/hooks/useDevicePreviewPreference.js +5 -1
- package/dist/hooks/useDevicePreviewPreference.js.map +1 -1
- package/dist/hooks/usePanelAutoRefresh.d.ts +1 -1
- package/dist/i18n/en.d.ts.map +1 -1
- package/dist/i18n/en.js +3 -0
- package/dist/i18n/en.js.map +1 -1
- package/dist/i18n/ko.d.ts.map +1 -1
- package/dist/i18n/ko.js +3 -0
- package/dist/i18n/ko.js.map +1 -1
- package/dist/i18n/types.d.ts +3 -0
- package/dist/i18n/types.d.ts.map +1 -1
- package/dist/providers/reportContext.d.ts.map +1 -1
- package/dist/styles/reportStylesheet.d.ts +1 -1
- package/dist/styles/reportStylesheet.d.ts.map +1 -1
- package/dist/styles/reportStylesheet.js +1 -1
- package/dist/styles/reportStylesheet.js.map +1 -1
- package/dist/utils/marker/coordinates.d.ts.map +1 -1
- package/dist/utils/marker/coordinates.js +41 -23
- package/dist/utils/marker/coordinates.js.map +1 -1
- package/dist/utils/marker/locateFeedback.d.ts.map +1 -1
- package/dist/utils/marker/locateFeedback.js +6 -3
- package/dist/utils/marker/locateFeedback.js.map +1 -1
- package/dist/utils/marker/targetSelector.d.ts.map +1 -1
- package/dist/utils/marker/targetSelector.js +6 -10
- package/dist/utils/marker/targetSelector.js.map +1 -1
- package/dist/utils/mention/elementMentions.d.ts.map +1 -1
- package/dist/utils/mention/elementMentions.js +9 -16
- package/dist/utils/mention/elementMentions.js.map +1 -1
- package/dist/utils/overlay/devicePreviewCapture.d.ts +1 -0
- package/dist/utils/overlay/devicePreviewCapture.d.ts.map +1 -1
- package/dist/utils/overlay/devicePreviewCapture.js +12 -1
- package/dist/utils/overlay/devicePreviewCapture.js.map +1 -1
- package/dist/utils/overlay/devicePreviewFrame.d.ts +31 -0
- package/dist/utils/overlay/devicePreviewFrame.d.ts.map +1 -0
- package/dist/utils/overlay/devicePreviewFrame.js +149 -0
- package/dist/utils/overlay/devicePreviewFrame.js.map +1 -0
- package/dist/utils/overlay/pageDocumentBridge.d.ts +43 -0
- package/dist/utils/overlay/pageDocumentBridge.d.ts.map +1 -0
- package/dist/utils/overlay/pageDocumentBridge.js +208 -0
- package/dist/utils/overlay/pageDocumentBridge.js.map +1 -0
- package/dist/utils/probe/pickProbeSession.d.ts.map +1 -1
- package/dist/utils/probe/pickProbeSession.js +3 -1
- package/dist/utils/probe/pickProbeSession.js.map +1 -1
- package/dist/utils/shared/dom.d.ts.map +1 -1
- package/dist/utils/shared/dom.js +34 -29
- package/dist/utils/shared/dom.js.map +1 -1
- package/dist/utils/shared/pathname.d.ts.map +1 -1
- package/dist/utils/shared/pathname.js +13 -0
- package/dist/utils/shared/pathname.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
import { FIVEPIXELS_HOST_ID } from "../../constants/overlayChrome.js";
|
|
2
|
+
export const DEVICE_PREVIEW_FRAME_ATTR = "data-fivepixels-device-preview-frame";
|
|
3
|
+
export const DEVICE_PREVIEW_FRAME_NAME = "fivepixels-device-preview-guest";
|
|
4
|
+
export const DEVICE_PREVIEW_GUEST_STYLE_ID = "fivepixels-device-preview-guest-style";
|
|
5
|
+
export const HTML_DEVICE_PREVIEW_ACTIVE_CLASS = "fivepixels-device-preview-active";
|
|
6
|
+
export const DEVICE_PREVIEW_HOST_STYLE_ID = "fivepixels-device-preview-host-style";
|
|
7
|
+
export function isInsideDevicePreviewFrame() {
|
|
8
|
+
if (typeof window === "undefined") {
|
|
9
|
+
return false;
|
|
10
|
+
}
|
|
11
|
+
try {
|
|
12
|
+
if (window.name === DEVICE_PREVIEW_FRAME_NAME) {
|
|
13
|
+
return true;
|
|
14
|
+
}
|
|
15
|
+
const frame = window.frameElement;
|
|
16
|
+
return frame instanceof HTMLIFrameElement && frame.hasAttribute(DEVICE_PREVIEW_FRAME_ATTR);
|
|
17
|
+
}
|
|
18
|
+
catch {
|
|
19
|
+
return window.name === DEVICE_PREVIEW_FRAME_NAME;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
export function getGuestWindow(iframe) {
|
|
23
|
+
if (!iframe) {
|
|
24
|
+
return null;
|
|
25
|
+
}
|
|
26
|
+
try {
|
|
27
|
+
return iframe.contentWindow;
|
|
28
|
+
}
|
|
29
|
+
catch {
|
|
30
|
+
return null;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
export function getGuestDocument(iframe) {
|
|
34
|
+
if (!iframe) {
|
|
35
|
+
return null;
|
|
36
|
+
}
|
|
37
|
+
try {
|
|
38
|
+
return iframe.contentDocument;
|
|
39
|
+
}
|
|
40
|
+
catch {
|
|
41
|
+
return null;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
export function getGuestCaptureRoot(iframe) {
|
|
45
|
+
const doc = getGuestDocument(iframe);
|
|
46
|
+
if (!doc) {
|
|
47
|
+
return null;
|
|
48
|
+
}
|
|
49
|
+
if (doc.body) {
|
|
50
|
+
return doc.body;
|
|
51
|
+
}
|
|
52
|
+
return doc.documentElement;
|
|
53
|
+
}
|
|
54
|
+
export function isGuestDocumentReady(iframe) {
|
|
55
|
+
const doc = getGuestDocument(iframe);
|
|
56
|
+
return Boolean(doc?.documentElement);
|
|
57
|
+
}
|
|
58
|
+
export function readGuestContentMetrics(iframe, fallbackWidth) {
|
|
59
|
+
const guestWindow = getGuestWindow(iframe);
|
|
60
|
+
const guestDocument = getGuestDocument(iframe);
|
|
61
|
+
const scrolling = guestDocument?.scrollingElement ?? guestDocument?.documentElement;
|
|
62
|
+
const rect = iframe?.getBoundingClientRect();
|
|
63
|
+
return {
|
|
64
|
+
scrollY: Math.round(guestWindow?.scrollY ?? scrolling?.scrollTop ?? 0),
|
|
65
|
+
scrollHeight: Math.round(scrolling?.scrollHeight ?? 0),
|
|
66
|
+
clientHeight: Math.round(guestWindow?.innerHeight ?? scrolling?.clientHeight ?? 0),
|
|
67
|
+
left: Math.round(rect?.left ?? 0),
|
|
68
|
+
top: Math.round(rect?.top ?? 0),
|
|
69
|
+
width: Math.round(rect?.width ?? fallbackWidth),
|
|
70
|
+
viewportWidth: typeof window !== "undefined" && window.innerWidth > 0 ? window.innerWidth : 1280,
|
|
71
|
+
viewportHeight: typeof window !== "undefined" && window.innerHeight > 0 ? window.innerHeight : 800,
|
|
72
|
+
};
|
|
73
|
+
}
|
|
74
|
+
export function buildDevicePreviewHostStyle(args) {
|
|
75
|
+
const { background, line, gridSize } = args;
|
|
76
|
+
const active = `html.${HTML_DEVICE_PREVIEW_ACTIVE_CLASS}`;
|
|
77
|
+
return `
|
|
78
|
+
${active},
|
|
79
|
+
${active} body {
|
|
80
|
+
height: 100% !important;
|
|
81
|
+
max-height: 100% !important;
|
|
82
|
+
overflow: hidden !important;
|
|
83
|
+
background-color: ${background} !important;
|
|
84
|
+
background-image: linear-gradient(${line} 1px, transparent 1px), linear-gradient(90deg, ${line} 1px, transparent 1px) !important;
|
|
85
|
+
background-size: ${gridSize}px ${gridSize}px !important;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
${active} body > :not(#${FIVEPIXELS_HOST_ID}) {
|
|
89
|
+
display: none !important;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
${active} #${FIVEPIXELS_HOST_ID} {
|
|
93
|
+
position: fixed !important;
|
|
94
|
+
inset: 0 !important;
|
|
95
|
+
width: 100vw !important;
|
|
96
|
+
height: 100vh !important;
|
|
97
|
+
max-width: none !important;
|
|
98
|
+
max-height: none !important;
|
|
99
|
+
margin: 0 !important;
|
|
100
|
+
pointer-events: none !important;
|
|
101
|
+
z-index: 2147483646 !important;
|
|
102
|
+
}
|
|
103
|
+
`;
|
|
104
|
+
}
|
|
105
|
+
export function syncGuestStatusBarStyle(doc, statusBarHeight) {
|
|
106
|
+
if (!doc) {
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
const safeHeight = Math.max(0, Math.round(statusBarHeight));
|
|
110
|
+
if (safeHeight <= 0) {
|
|
111
|
+
doc.getElementById(DEVICE_PREVIEW_GUEST_STYLE_ID)?.remove();
|
|
112
|
+
return;
|
|
113
|
+
}
|
|
114
|
+
let style = doc.getElementById(DEVICE_PREVIEW_GUEST_STYLE_ID);
|
|
115
|
+
if (!style) {
|
|
116
|
+
style = doc.createElement("style");
|
|
117
|
+
style.id = DEVICE_PREVIEW_GUEST_STYLE_ID;
|
|
118
|
+
doc.documentElement.append(style);
|
|
119
|
+
}
|
|
120
|
+
style.textContent = `
|
|
121
|
+
html {
|
|
122
|
+
padding-top: ${safeHeight}px !important;
|
|
123
|
+
box-sizing: border-box !important;
|
|
124
|
+
}
|
|
125
|
+
`;
|
|
126
|
+
}
|
|
127
|
+
export function clearGuestStatusBarStyle(doc) {
|
|
128
|
+
doc?.getElementById(DEVICE_PREVIEW_GUEST_STYLE_ID)?.remove();
|
|
129
|
+
}
|
|
130
|
+
export function readGuestPageHref(iframe) {
|
|
131
|
+
try {
|
|
132
|
+
const href = iframe?.contentWindow?.location.href;
|
|
133
|
+
if (!href || href.startsWith("about:")) {
|
|
134
|
+
return null;
|
|
135
|
+
}
|
|
136
|
+
return href;
|
|
137
|
+
}
|
|
138
|
+
catch {
|
|
139
|
+
return null;
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
export function closeDevicePreviewAndSyncGuestUrl(iframe, close) {
|
|
143
|
+
const guestHref = readGuestPageHref(iframe);
|
|
144
|
+
close();
|
|
145
|
+
if (guestHref && guestHref !== window.location.href) {
|
|
146
|
+
window.location.replace(guestHref);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
//# sourceMappingURL=devicePreviewFrame.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"devicePreviewFrame.js","sourceRoot":"","sources":["../../../src/utils/overlay/devicePreviewFrame.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
export type PageDocumentBridgeState = {
|
|
2
|
+
iframe: HTMLIFrameElement | null;
|
|
3
|
+
fitScale: number;
|
|
4
|
+
};
|
|
5
|
+
type BridgeListener = () => void;
|
|
6
|
+
export declare function notifyPageDocumentBridge(): void;
|
|
7
|
+
export declare function isHtmlElement(value: unknown): value is HTMLElement;
|
|
8
|
+
export declare function setPageDocumentBridge(next: {
|
|
9
|
+
iframe: HTMLIFrameElement | null;
|
|
10
|
+
fitScale?: number;
|
|
11
|
+
}): void;
|
|
12
|
+
export declare function clearPageDocumentBridge(): void;
|
|
13
|
+
export declare function subscribePageDocumentBridge(listener: BridgeListener): () => void;
|
|
14
|
+
export declare function getPageDocumentBridgeState(): PageDocumentBridgeState;
|
|
15
|
+
export declare function isPageDocumentBridged(): boolean;
|
|
16
|
+
export declare function getPageDocument(): Document;
|
|
17
|
+
export declare function getPageWindow(): Window;
|
|
18
|
+
export declare function getPageScrollY(): number;
|
|
19
|
+
export declare function getPageViewportSize(): {
|
|
20
|
+
width: number;
|
|
21
|
+
height: number;
|
|
22
|
+
};
|
|
23
|
+
export declare function getPagePathname(): string;
|
|
24
|
+
export declare function mapHostPointToPage(clientX: number, clientY: number): {
|
|
25
|
+
x: number;
|
|
26
|
+
y: number;
|
|
27
|
+
} | null;
|
|
28
|
+
export declare function mapPagePointToHost(pageX: number, pageY: number): {
|
|
29
|
+
x: number;
|
|
30
|
+
y: number;
|
|
31
|
+
};
|
|
32
|
+
export declare function mapPageRectToHost(rect: DOMRect | DOMRectReadOnly): DOMRectReadOnly;
|
|
33
|
+
export declare function getElementHostRect(element: Element): DOMRectReadOnly;
|
|
34
|
+
export declare function getPageElementsFromPoint(hostClientX: number, hostClientY: number): HTMLElement[];
|
|
35
|
+
export declare function queryPageSelector<T extends Element = Element>(selector: string): T | null;
|
|
36
|
+
export declare function queryPageSelectorAll<T extends Element = Element>(selector: string): T[];
|
|
37
|
+
/** Navigate inside the preview guest when bridged; otherwise use the host window. */
|
|
38
|
+
export declare function assignPageLocation(pathname: string): void;
|
|
39
|
+
/** Prefer guest navigation callback when preview is bridged. */
|
|
40
|
+
export declare function navigatePagePath(pathname: string, onNavigate?: (pathname: string) => void | Promise<void>): Promise<void>;
|
|
41
|
+
export declare function findDevicePreviewFrameElement(): HTMLIFrameElement | null;
|
|
42
|
+
export {};
|
|
43
|
+
//# sourceMappingURL=pageDocumentBridge.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pageDocumentBridge.d.ts","sourceRoot":"","sources":["../../../src/utils/overlay/pageDocumentBridge.ts"],"names":[],"mappings":"AAMA,MAAM,MAAM,uBAAuB,GAAG;IAClC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,QAAQ,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,KAAK,cAAc,GAAG,MAAM,IAAI,CAAC;AAejC,wBAAgB,wBAAwB,SAEvC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,WAAW,CAElE;AAED,wBAAgB,qBAAqB,CAAC,IAAI,EAAE;IAAE,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,QAUlG;AAED,wBAAgB,uBAAuB,SAOtC;AAED,wBAAgB,2BAA2B,CAAC,QAAQ,EAAE,cAAc,cAKnE;AAED,wBAAgB,0BAA0B,IAAI,uBAAuB,CAEpE;AAED,wBAAgB,qBAAqB,YAEpC;AAED,wBAAgB,eAAe,IAAI,QAAQ,CAE1C;AAED,wBAAgB,aAAa,IAAI,MAAM,CAEtC;AAED,wBAAgB,cAAc,WAQ7B;AAED,wBAAgB,mBAAmB;;;EAMlC;AAED,wBAAgB,eAAe,WAO9B;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAkBpG;AA8BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAazF;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,OAAO,GAAG,eAAe,GAAG,eAAe,CAelF;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,eAAe,CAEpE;AAED,wBAAgB,wBAAwB,CAAC,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,WAAW,EAAE,CAkBhG;AAED,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,GAAG,IAAI,CAOzF;AAED,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,EAAE,CAMvF;AAED,qFAAqF;AACrF,wBAAgB,kBAAkB,CAAC,QAAQ,EAAE,MAAM,QAQlD;AAED,gEAAgE;AAChE,wBAAsB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,iBAa/G;AAED,wBAAgB,6BAA6B,IAAI,iBAAiB,GAAG,IAAI,CAMxE"}
|
|
@@ -0,0 +1,208 @@
|
|
|
1
|
+
import { DEVICE_PREVIEW_FRAME_ATTR, getGuestDocument, getGuestWindow, } from "../../utils/overlay/devicePreviewFrame.js";
|
|
2
|
+
let bridgeState = {
|
|
3
|
+
iframe: null,
|
|
4
|
+
fitScale: 1,
|
|
5
|
+
};
|
|
6
|
+
const listeners = new Set();
|
|
7
|
+
function notifyBridgeListeners() {
|
|
8
|
+
for (const listener of listeners) {
|
|
9
|
+
listener();
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
export function notifyPageDocumentBridge() {
|
|
13
|
+
notifyBridgeListeners();
|
|
14
|
+
}
|
|
15
|
+
export function isHtmlElement(value) {
|
|
16
|
+
return typeof value === "object" && value !== null && value.nodeType === Node.ELEMENT_NODE && "getBoundingClientRect" in value;
|
|
17
|
+
}
|
|
18
|
+
export function setPageDocumentBridge(next) {
|
|
19
|
+
const fitScale = next.fitScale === undefined ? bridgeState.fitScale : Math.max(0.01, next.fitScale);
|
|
20
|
+
const iframe = next.iframe;
|
|
21
|
+
const changed = bridgeState.iframe !== iframe || bridgeState.fitScale !== fitScale;
|
|
22
|
+
bridgeState = { iframe, fitScale };
|
|
23
|
+
if (changed) {
|
|
24
|
+
notifyBridgeListeners();
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
export function clearPageDocumentBridge() {
|
|
28
|
+
if (!bridgeState.iframe && bridgeState.fitScale === 1) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
bridgeState = { iframe: null, fitScale: 1 };
|
|
32
|
+
notifyBridgeListeners();
|
|
33
|
+
}
|
|
34
|
+
export function subscribePageDocumentBridge(listener) {
|
|
35
|
+
listeners.add(listener);
|
|
36
|
+
return () => {
|
|
37
|
+
listeners.delete(listener);
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
export function getPageDocumentBridgeState() {
|
|
41
|
+
return bridgeState;
|
|
42
|
+
}
|
|
43
|
+
export function isPageDocumentBridged() {
|
|
44
|
+
return Boolean(bridgeState.iframe && getGuestDocument(bridgeState.iframe));
|
|
45
|
+
}
|
|
46
|
+
export function getPageDocument() {
|
|
47
|
+
return getGuestDocument(bridgeState.iframe) ?? document;
|
|
48
|
+
}
|
|
49
|
+
export function getPageWindow() {
|
|
50
|
+
return getGuestWindow(bridgeState.iframe) ?? window;
|
|
51
|
+
}
|
|
52
|
+
export function getPageScrollY() {
|
|
53
|
+
const pageWindow = getPageWindow();
|
|
54
|
+
if (Number.isFinite(pageWindow.scrollY)) {
|
|
55
|
+
return pageWindow.scrollY;
|
|
56
|
+
}
|
|
57
|
+
const scrolling = getPageDocument().scrollingElement ?? getPageDocument().documentElement;
|
|
58
|
+
return scrolling?.scrollTop ?? 0;
|
|
59
|
+
}
|
|
60
|
+
export function getPageViewportSize() {
|
|
61
|
+
const pageWindow = getPageWindow();
|
|
62
|
+
return {
|
|
63
|
+
width: pageWindow.innerWidth > 0 ? pageWindow.innerWidth : 1,
|
|
64
|
+
height: pageWindow.innerHeight > 0 ? pageWindow.innerHeight : 1,
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
export function getPagePathname() {
|
|
68
|
+
try {
|
|
69
|
+
const pathname = getPageWindow().location.pathname;
|
|
70
|
+
return pathname || "/";
|
|
71
|
+
}
|
|
72
|
+
catch {
|
|
73
|
+
return typeof window !== "undefined" ? window.location.pathname || "/" : "/";
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
export function mapHostPointToPage(clientX, clientY) {
|
|
77
|
+
const iframe = bridgeState.iframe;
|
|
78
|
+
if (!iframe || !getGuestDocument(iframe)) {
|
|
79
|
+
return { x: clientX, y: clientY };
|
|
80
|
+
}
|
|
81
|
+
const rect = iframe.getBoundingClientRect();
|
|
82
|
+
const scale = bridgeState.fitScale;
|
|
83
|
+
const x = (clientX - rect.left) / scale;
|
|
84
|
+
const y = (clientY - rect.top) / scale;
|
|
85
|
+
const width = iframe.offsetWidth || rect.width / scale;
|
|
86
|
+
const height = iframe.offsetHeight || rect.height / scale;
|
|
87
|
+
if (x < 0 || y < 0 || x > width || y > height) {
|
|
88
|
+
return null;
|
|
89
|
+
}
|
|
90
|
+
return { x, y };
|
|
91
|
+
}
|
|
92
|
+
function toReadOnlyRect(args) {
|
|
93
|
+
const right = args.left + args.width;
|
|
94
|
+
const bottom = args.top + args.height;
|
|
95
|
+
return {
|
|
96
|
+
x: args.left,
|
|
97
|
+
y: args.top,
|
|
98
|
+
left: args.left,
|
|
99
|
+
top: args.top,
|
|
100
|
+
width: args.width,
|
|
101
|
+
height: args.height,
|
|
102
|
+
right,
|
|
103
|
+
bottom,
|
|
104
|
+
toJSON() {
|
|
105
|
+
return {
|
|
106
|
+
x: args.left,
|
|
107
|
+
y: args.top,
|
|
108
|
+
left: args.left,
|
|
109
|
+
top: args.top,
|
|
110
|
+
width: args.width,
|
|
111
|
+
height: args.height,
|
|
112
|
+
right,
|
|
113
|
+
bottom,
|
|
114
|
+
};
|
|
115
|
+
},
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
export function mapPagePointToHost(pageX, pageY) {
|
|
119
|
+
const iframe = bridgeState.iframe;
|
|
120
|
+
if (!iframe || !getGuestDocument(iframe)) {
|
|
121
|
+
return { x: pageX, y: pageY };
|
|
122
|
+
}
|
|
123
|
+
const frameRect = iframe.getBoundingClientRect();
|
|
124
|
+
const scale = bridgeState.fitScale;
|
|
125
|
+
return {
|
|
126
|
+
x: frameRect.left + pageX * scale,
|
|
127
|
+
y: frameRect.top + pageY * scale,
|
|
128
|
+
};
|
|
129
|
+
}
|
|
130
|
+
export function mapPageRectToHost(rect) {
|
|
131
|
+
const iframe = bridgeState.iframe;
|
|
132
|
+
if (!iframe || !getGuestDocument(iframe)) {
|
|
133
|
+
return rect;
|
|
134
|
+
}
|
|
135
|
+
const frameRect = iframe.getBoundingClientRect();
|
|
136
|
+
const scale = bridgeState.fitScale;
|
|
137
|
+
return toReadOnlyRect({
|
|
138
|
+
left: frameRect.left + rect.left * scale,
|
|
139
|
+
top: frameRect.top + rect.top * scale,
|
|
140
|
+
width: rect.width * scale,
|
|
141
|
+
height: rect.height * scale,
|
|
142
|
+
});
|
|
143
|
+
}
|
|
144
|
+
export function getElementHostRect(element) {
|
|
145
|
+
return mapPageRectToHost(element.getBoundingClientRect());
|
|
146
|
+
}
|
|
147
|
+
export function getPageElementsFromPoint(hostClientX, hostClientY) {
|
|
148
|
+
const pagePoint = mapHostPointToPage(hostClientX, hostClientY);
|
|
149
|
+
if (!pagePoint) {
|
|
150
|
+
return [];
|
|
151
|
+
}
|
|
152
|
+
const pageDocument = getPageDocument();
|
|
153
|
+
if (typeof pageDocument.elementsFromPoint === "function") {
|
|
154
|
+
return pageDocument.elementsFromPoint(pagePoint.x, pagePoint.y).filter(isHtmlElement);
|
|
155
|
+
}
|
|
156
|
+
if (typeof pageDocument.elementFromPoint === "function") {
|
|
157
|
+
const hit = pageDocument.elementFromPoint(pagePoint.x, pagePoint.y);
|
|
158
|
+
return isHtmlElement(hit) ? [hit] : [];
|
|
159
|
+
}
|
|
160
|
+
return [];
|
|
161
|
+
}
|
|
162
|
+
export function queryPageSelector(selector) {
|
|
163
|
+
try {
|
|
164
|
+
const element = getPageDocument().querySelector(selector);
|
|
165
|
+
return element;
|
|
166
|
+
}
|
|
167
|
+
catch {
|
|
168
|
+
return null;
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
export function queryPageSelectorAll(selector) {
|
|
172
|
+
try {
|
|
173
|
+
return Array.from(getPageDocument().querySelectorAll(selector));
|
|
174
|
+
}
|
|
175
|
+
catch {
|
|
176
|
+
return [];
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
/** Navigate inside the preview guest when bridged; otherwise use the host window. */
|
|
180
|
+
export function assignPageLocation(pathname) {
|
|
181
|
+
const pageWindow = getPageWindow();
|
|
182
|
+
try {
|
|
183
|
+
pageWindow.location.assign(pathname);
|
|
184
|
+
}
|
|
185
|
+
catch {
|
|
186
|
+
window.location.assign(pathname);
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
/** Prefer guest navigation callback when preview is bridged. */
|
|
190
|
+
export async function navigatePagePath(pathname, onNavigate) {
|
|
191
|
+
if (isPageDocumentBridged()) {
|
|
192
|
+
assignPageLocation(pathname);
|
|
193
|
+
notifyPageDocumentBridge();
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
196
|
+
if (onNavigate) {
|
|
197
|
+
await onNavigate(pathname);
|
|
198
|
+
return;
|
|
199
|
+
}
|
|
200
|
+
assignPageLocation(pathname);
|
|
201
|
+
}
|
|
202
|
+
export function findDevicePreviewFrameElement() {
|
|
203
|
+
if (typeof document === "undefined") {
|
|
204
|
+
return null;
|
|
205
|
+
}
|
|
206
|
+
return document.querySelector(`iframe[${DEVICE_PREVIEW_FRAME_ATTR}]`);
|
|
207
|
+
}
|
|
208
|
+
//# sourceMappingURL=pageDocumentBridge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pageDocumentBridge.js","sourceRoot":"","sources":["../../../src/utils/overlay/pageDocumentBridge.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pickProbeSession.d.ts","sourceRoot":"","sources":["../../../src/utils/probe/pickProbeSession.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"pickProbeSession.d.ts","sourceRoot":"","sources":["../../../src/utils/probe/pickProbeSession.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAO9I,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,qBAAqB,EAAE,OAAO,GAAG,WAAW,GAAG,aAAa,GAAG,YAAY,CAAC,CAAC;AAErH,wBAAgB,+BAA+B,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,oBAAoB,QAqBnG;AAED,wBAAgB,qBAAqB,WAEpC;AAED,wBAAgB,sBAAsB,CAAC,OAAO,EAAE,WAAW,UAQ1D;AAED,wBAAgB,qBAAqB,CAAC,UAAU,EAAE,MAAM,sBAiBvD;AAED,wBAAgB,4BAA4B,CAAC,OAAO,EAAE,WAAW,GAAG,qBAAqB,CASxF;AAED,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,GAAG,kBAAkB,GAAG,IAAI,CAoB7G;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,kBAAkB,sBAuBlE;AAED,wBAAgB,2BAA2B,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,eAAe,QAuBvF;AAED,wBAAgB,qBAAqB,CACjC,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,eAAe,EACzB,OAAO,EAAE,eAAe,EACxB,aAAa,EAAE,MAAM,GAAG,IAAI,EAC5B,mBAAmB,EAAE,MAAM,GAAG,IAAI,EAClC,QAAQ,CAAC,EAAE,eAAe,EAC1B,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,EACjC,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,GACnC,eAAe,CAUjB;AAED,wBAAgB,0BAA0B,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,QAEvF;AAED,wBAAgB,+BAA+B,CAC3C,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,EACtC,IAAI,EAAE,oBAAoB,QAS7B"}
|
|
@@ -2,6 +2,7 @@ import { applyPickProbeCompareMode, applyPickProbeValues } from "./pickProbe.js"
|
|
|
2
2
|
import { getFeedbackTargetSelector, resolveReportType } from "../shared/dom.js";
|
|
3
3
|
import { shouldInspectFontStyle } from "./pickTargetInspect.js";
|
|
4
4
|
import { findElementByTargetSelector, generateCssSelector } from "../marker/targetSelector.js";
|
|
5
|
+
import { isHtmlElement, queryPageSelector } from "../overlay/pageDocumentBridge.js";
|
|
5
6
|
export function restoreProbeElementFromSnapshot(element, snapshot) {
|
|
6
7
|
if (snapshot.style === null) {
|
|
7
8
|
element.removeAttribute("style");
|
|
@@ -37,7 +38,8 @@ export function findElementByProbeKey(elementKey) {
|
|
|
37
38
|
if (!reportId || !reportType) {
|
|
38
39
|
return null;
|
|
39
40
|
}
|
|
40
|
-
|
|
41
|
+
const element = queryPageSelector(getFeedbackTargetSelector(reportId, reportType));
|
|
42
|
+
return isHtmlElement(element) ? element : null;
|
|
41
43
|
}
|
|
42
44
|
if (elementKey.startsWith("selector:")) {
|
|
43
45
|
return findElementByTargetSelector(elementKey.slice("selector:".length));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pickProbeSession.js","sourceRoot":"","sources":["../../../src/utils/probe/pickProbeSession.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACjF,OAAO,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,EAAE,2BAA2B,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"pickProbeSession.js","sourceRoot":"","sources":["../../../src/utils/probe/pickProbeSession.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../src/utils/shared/dom.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,KAAK,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../src/utils/shared/dom.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,KAAK,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAC;AA0BhF,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,UAE5C;AAED,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,WAAW,GAAG,gBAAgB,CAExE;AAED,wBAAgB,yBAAyB,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,gBAAgB,UAQvF;AAuBD,wBAAgB,wBAAwB,CAAC,OAAO,EAAE,WAAW,WAY5D;AAED,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,WAAW,WA4B3D;AAiDD,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,EAAE,IAAI,EAAE,cAAc,GAAG,IAAI,WAuB7F;AAED,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,WAAW,WAErD;AAED,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,cAAc,GAAG,IAAI,CA4B1F;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,cAAc,GAAG,IAAI,CAiB7E;AAED,wBAAgB,6BAA6B,CAAC,aAAa,EAAE,WAAW,GAAG,cAAc,GAAG,IAAI,CAc/F;AAED,wBAAgB,iBAAiB,CAAC,WAAW,EAAE,WAAW,GAAG,IAAI,sBAyBhE;AAMD,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,WAAW,GAAG,WAAW,GAAG,IAAI,CAgBlF;AAID,wBAAgB,yBAAyB,CAAC,eAAe,EAAE,WAAW,GAAG,MAAM,CAU9E;AAED,wBAAgB,2BAA2B,CAAC,WAAW,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAEnF;AAED,wBAAgB,yBAAyB,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,QAuBvG;AAED,wBAAgB,oBAAoB,qBAKnC;AAgED,wBAAgB,cAAc,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,cAAc,GAAG,IAAI,CAiBjF;AAED,wBAAgB,qBAAqB,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,sBA2BrG;AAED,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,sBAqCjG;AAQD,wBAAgB,mBAAmB,IAAI,WAAW,CAQjD;AAED,wBAAgB,2BAA2B,IAAI,QAAQ,GAAG,UAAU,CAEnE;AAED,wBAAgB,wBAAwB,IAAI,WAAW,CAuBtD;AAED,wBAAgB,2BAA2B,CAAC,UAAU,EAAE,OAAO,GAAG,MAAM,QASvE;AAED,wBAAgB,oBAAoB,IAAI,WAAW,CAElD"}
|
package/dist/utils/shared/dom.js
CHANGED
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import { TARGET_SELECTOR } from "../../constants/report.js";
|
|
2
2
|
import { getPickTargetBoxStyle, getPickTargetFontStyle, getPickTargetReportIdAttribute, getPickTargetTagName } from "../probe/pickTargetInspect.js";
|
|
3
3
|
import { createAutoPickReportId, generateCssSelector, generateSuggestedReportId, isPickableElement, } from "../marker/targetSelector.js";
|
|
4
|
+
import { getElementHostRect, getPageElementsFromPoint, getPageViewportSize, getPageWindow, isHtmlElement, queryPageSelector, queryPageSelectorAll, } from "../overlay/pageDocumentBridge.js";
|
|
5
|
+
function getElementWindow(element) {
|
|
6
|
+
return element.ownerDocument.defaultView ?? getPageWindow();
|
|
7
|
+
}
|
|
8
|
+
function getElementDocumentElement(element) {
|
|
9
|
+
return element.ownerDocument.documentElement;
|
|
10
|
+
}
|
|
4
11
|
export function escapeAttribute(value) {
|
|
5
12
|
return value.split("\\").join("\\\\").split('"').join('\\"');
|
|
6
13
|
}
|
|
@@ -27,12 +34,13 @@ function intersectsViewport(rect) {
|
|
|
27
34
|
if (rect.width <= 0 || rect.height <= 0) {
|
|
28
35
|
return false;
|
|
29
36
|
}
|
|
30
|
-
|
|
37
|
+
const viewport = getPageViewportSize();
|
|
38
|
+
return rect.right > 0 && rect.bottom > 0 && rect.left < viewport.width && rect.top < viewport.height;
|
|
31
39
|
}
|
|
32
40
|
export function hasFixedPositionAncestor(element) {
|
|
33
41
|
let node = element.parentElement;
|
|
34
|
-
while (node && node !==
|
|
35
|
-
if (
|
|
42
|
+
while (node && node !== getElementDocumentElement(node)) {
|
|
43
|
+
if (getElementWindow(node).getComputedStyle(node).position === "fixed") {
|
|
36
44
|
return true;
|
|
37
45
|
}
|
|
38
46
|
node = node.parentElement;
|
|
@@ -47,8 +55,8 @@ export function isFeedbackTargetVisible(element) {
|
|
|
47
55
|
}
|
|
48
56
|
else {
|
|
49
57
|
let node = element;
|
|
50
|
-
while (node && node !==
|
|
51
|
-
if (isStyleHidden(
|
|
58
|
+
while (node && node !== getElementDocumentElement(node)) {
|
|
59
|
+
if (isStyleHidden(getElementWindow(node).getComputedStyle(node))) {
|
|
52
60
|
return false;
|
|
53
61
|
}
|
|
54
62
|
node = node.parentElement;
|
|
@@ -152,15 +160,15 @@ export function toSnapshot(element) {
|
|
|
152
160
|
return {
|
|
153
161
|
id: reportId,
|
|
154
162
|
type: resolveReportType(element),
|
|
155
|
-
rect: element
|
|
163
|
+
rect: getElementHostRect(element),
|
|
156
164
|
isTagged: true,
|
|
157
165
|
};
|
|
158
166
|
}
|
|
159
167
|
export function resolveFeedbackDocumentAnchor(targetElement) {
|
|
160
168
|
let node = targetElement.parentElement;
|
|
161
|
-
while (node && node !==
|
|
169
|
+
while (node && node !== getElementDocumentElement(node)) {
|
|
162
170
|
const reportId = node.dataset.reportId?.trim();
|
|
163
|
-
if (reportId &&
|
|
171
|
+
if (reportId && getElementWindow(node).getComputedStyle(node).position !== "fixed") {
|
|
164
172
|
return toSnapshot(node);
|
|
165
173
|
}
|
|
166
174
|
node = node.parentElement;
|
|
@@ -192,8 +200,8 @@ function isScrollableOverflow(value) {
|
|
|
192
200
|
}
|
|
193
201
|
export function getNearestScrollContainer(element) {
|
|
194
202
|
let node = element.parentElement;
|
|
195
|
-
while (node && node !==
|
|
196
|
-
const style =
|
|
203
|
+
while (node && node !== getElementDocumentElement(node)) {
|
|
204
|
+
const style = getElementWindow(node).getComputedStyle(node);
|
|
197
205
|
const canScrollY = isScrollableOverflow(style.overflowY) && node.scrollHeight > node.clientHeight + 1;
|
|
198
206
|
const canScrollX = isScrollableOverflow(style.overflowX) && node.scrollWidth > node.clientWidth + 1;
|
|
199
207
|
if (canScrollY || canScrollX) {
|
|
@@ -214,7 +222,7 @@ export function getScrollContainerClampId(scrollContainer) {
|
|
|
214
222
|
return id;
|
|
215
223
|
}
|
|
216
224
|
export function getScrollContainerByClampId(containerId) {
|
|
217
|
-
return
|
|
225
|
+
return queryPageSelector(`[${SCROLL_CLAMP_ATTR}="${containerId}"]`);
|
|
218
226
|
}
|
|
219
227
|
export function scrollContainerTowardEdge(containerId, edge) {
|
|
220
228
|
const container = getScrollContainerByClampId(containerId);
|
|
@@ -238,23 +246,17 @@ export function scrollContainerTowardEdge(containerId, edge) {
|
|
|
238
246
|
}
|
|
239
247
|
}
|
|
240
248
|
export function getSelectableTargets() {
|
|
241
|
-
return
|
|
249
|
+
return queryPageSelectorAll(TARGET_SELECTOR)
|
|
250
|
+
.filter(isHtmlElement)
|
|
242
251
|
.map((element) => toSnapshot(element))
|
|
243
252
|
.filter((snapshot) => snapshot !== null);
|
|
244
253
|
}
|
|
245
254
|
function getElementsFromPoint(clientX, clientY) {
|
|
246
|
-
|
|
247
|
-
return document.elementsFromPoint(clientX, clientY).filter((node) => node instanceof HTMLElement);
|
|
248
|
-
}
|
|
249
|
-
if (typeof document.elementFromPoint === "function") {
|
|
250
|
-
const hitElement = document.elementFromPoint(clientX, clientY);
|
|
251
|
-
return hitElement instanceof HTMLElement ? [hitElement] : [];
|
|
252
|
-
}
|
|
253
|
-
return [];
|
|
255
|
+
return getPageElementsFromPoint(clientX, clientY);
|
|
254
256
|
}
|
|
255
257
|
function isAriaHiddenSubtree(element) {
|
|
256
258
|
let node = element;
|
|
257
|
-
while (node && node !==
|
|
259
|
+
while (node && node !== getElementDocumentElement(node)) {
|
|
258
260
|
if (node.getAttribute("aria-hidden") === "true") {
|
|
259
261
|
return true;
|
|
260
262
|
}
|
|
@@ -272,26 +274,29 @@ function isSelectableFeedbackTarget(target) {
|
|
|
272
274
|
return true;
|
|
273
275
|
}
|
|
274
276
|
function isPointerEventBlockingLayer(element, clientX, clientY) {
|
|
275
|
-
const
|
|
277
|
+
const pageWindow = getElementWindow(element);
|
|
278
|
+
const style = pageWindow.getComputedStyle(element);
|
|
276
279
|
if (style.pointerEvents === "none" || isStyleHidden(style)) {
|
|
277
280
|
return false;
|
|
278
281
|
}
|
|
279
282
|
if (style.position !== "fixed" && style.position !== "sticky") {
|
|
280
283
|
return false;
|
|
281
284
|
}
|
|
282
|
-
const
|
|
283
|
-
const isPointInside = clientX >=
|
|
285
|
+
const hostRect = getElementHostRect(element);
|
|
286
|
+
const isPointInside = clientX >= hostRect.left && clientX <= hostRect.right && clientY >= hostRect.top && clientY <= hostRect.bottom;
|
|
284
287
|
if (!isPointInside) {
|
|
285
288
|
return false;
|
|
286
289
|
}
|
|
287
|
-
const
|
|
288
|
-
const
|
|
290
|
+
const pageRect = element.getBoundingClientRect();
|
|
291
|
+
const viewport = getPageViewportSize();
|
|
292
|
+
const viewportArea = viewport.width * viewport.height;
|
|
293
|
+
const elementArea = pageRect.width * pageRect.height;
|
|
289
294
|
const coverageRatio = viewportArea > 0 ? elementArea / viewportArea : 0;
|
|
290
|
-
const nearlyFullscreen =
|
|
295
|
+
const nearlyFullscreen = pageRect.width >= viewport.width * 0.9 && pageRect.height >= viewport.height * 0.9;
|
|
291
296
|
const looksModalLayer = element.getAttribute("aria-modal") === "true" || element.getAttribute("role") === "dialog";
|
|
292
297
|
// Treat only broad overlays/modal shells as blockers.
|
|
293
298
|
// Small fixed headers/toolbars should not block target picking.
|
|
294
|
-
return (
|
|
299
|
+
return (pageRect.width > 0 && pageRect.height > 0 && coverageRatio >= 0.35) || nearlyFullscreen || looksModalLayer;
|
|
295
300
|
}
|
|
296
301
|
export function toPickSnapshot(element) {
|
|
297
302
|
if (!element) {
|
|
@@ -303,7 +308,7 @@ export function toPickSnapshot(element) {
|
|
|
303
308
|
return {
|
|
304
309
|
id: reportId ?? createAutoPickReportId(selector),
|
|
305
310
|
type: reportId ? resolveReportType(element) : "item",
|
|
306
|
-
rect: element
|
|
311
|
+
rect: getElementHostRect(element),
|
|
307
312
|
isTagged: Boolean(reportId),
|
|
308
313
|
targetSelector: selector,
|
|
309
314
|
suggestedReportId,
|