@abbox/inspector 0.4.12 → 0.4.14
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/host/client-bridge.d.ts.map +1 -1
- package/dist/host/client-bridge.js +3 -0
- package/dist/host/host-bridge.d.ts +1 -0
- package/dist/host/host-bridge.d.ts.map +1 -1
- package/dist/host/host-bridge.js +3 -0
- package/dist/protocol.d.ts +6 -1
- package/dist/protocol.d.ts.map +1 -1
- package/dist/runtime/bootstrap.d.ts.map +1 -1
- package/dist/runtime/bootstrap.js +4 -3
- package/dist/runtime/inspector.d.ts +1 -0
- package/dist/runtime/inspector.d.ts.map +1 -1
- package/dist/runtime/inspector.js +162 -56
- package/dist/runtime/metadata.d.ts.map +1 -1
- package/dist/runtime/metadata.js +3 -1
- package/dist/runtime/overlay.js +3 -3
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client-bridge.d.ts","sourceRoot":"","sources":["../../src/host/client-bridge.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,6EAA6E;IAC7E,kBAAkB,EAAE,SAAS,MAAM,EAAE,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,sBAAsB,GAC9B,eAAe,
|
|
1
|
+
{"version":3,"file":"client-bridge.d.ts","sourceRoot":"","sources":["../../src/host/client-bridge.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,6EAA6E;IAC7E,kBAAkB,EAAE,SAAS,MAAM,EAAE,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,sBAAsB,GAC9B,eAAe,CA4EjB"}
|
|
@@ -41,6 +41,9 @@ export function createInspectorClient(options) {
|
|
|
41
41
|
onChangeMarkerSelected: (changeId) => {
|
|
42
42
|
send({ ...base(), type: "CHANGE_MARKER_SELECTED", changeId });
|
|
43
43
|
},
|
|
44
|
+
onRouteChange: (path) => {
|
|
45
|
+
send({ ...base(), type: "ROUTE_CHANGED", path });
|
|
46
|
+
},
|
|
44
47
|
});
|
|
45
48
|
const onMessage = (event) => {
|
|
46
49
|
const msg = validateIncomingMessage(event.data, event.origin, {
|
|
@@ -19,6 +19,7 @@ export type InspectorHostHandlers = {
|
|
|
19
19
|
onSelect?: (payload: SelectPayload) => void;
|
|
20
20
|
onCleared?: () => void;
|
|
21
21
|
onChangeMarkerSelected?: (changeId: string) => void;
|
|
22
|
+
onRouteChange?: (path: string) => void;
|
|
22
23
|
onError?: (code: string, message: string) => void;
|
|
23
24
|
};
|
|
24
25
|
export type InspectorHost = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"host-bridge.d.ts","sourceRoot":"","sources":["../../src/host/host-bridge.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,mBAAmB,EAGzB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,aAAa,EAAE,MAAM,CAAC;IACtB,mDAAmD;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;CACvC,CAAC;AAEF,KAAK,YAAY,GAAG,OAAO,CACzB,mBAAmB,EACnB;IAAE,IAAI,EAAE,iBAAiB,CAAA;CAAE,CAC5B,CAAC,SAAS,CAAC,CAAC;AACb,KAAK,aAAa,GAAG,OAAO,CAC1B,mBAAmB,EACnB;IAAE,IAAI,EAAE,kBAAkB,CAAA;CAAE,CAC7B,CAAC,SAAS,CAAC,CAAC;AAEb,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,sBAAsB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,kBAAkB,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IACtD,0EAA0E;IAC1E,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,oBAAoB,EAC7B,QAAQ,EAAE,qBAAqB,GAC9B,aAAa,
|
|
1
|
+
{"version":3,"file":"host-bridge.d.ts","sourceRoot":"","sources":["../../src/host/host-bridge.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,mBAAmB,EAGzB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,aAAa,EAAE,MAAM,CAAC;IACtB,mDAAmD;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;CACvC,CAAC;AAEF,KAAK,YAAY,GAAG,OAAO,CACzB,mBAAmB,EACnB;IAAE,IAAI,EAAE,iBAAiB,CAAA;CAAE,CAC5B,CAAC,SAAS,CAAC,CAAC;AACb,KAAK,aAAa,GAAG,OAAO,CAC1B,mBAAmB,EACnB;IAAE,IAAI,EAAE,kBAAkB,CAAA;CAAE,CAC7B,CAAC,SAAS,CAAC,CAAC;AAEb,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,sBAAsB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,kBAAkB,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IACtD,0EAA0E;IAC1E,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,oBAAoB,EAC7B,QAAQ,EAAE,qBAAqB,GAC9B,aAAa,CAkEf"}
|
package/dist/host/host-bridge.js
CHANGED
|
@@ -35,6 +35,9 @@ export function createInspectorHost(options, handlers) {
|
|
|
35
35
|
if (msg.type === "CHANGE_MARKER_SELECTED") {
|
|
36
36
|
handlers.onChangeMarkerSelected?.(msg.changeId);
|
|
37
37
|
}
|
|
38
|
+
if (msg.type === "ROUTE_CHANGED") {
|
|
39
|
+
handlers.onRouteChange?.(msg.path);
|
|
40
|
+
}
|
|
38
41
|
if (msg.type === "INSPECTOR_ERROR") {
|
|
39
42
|
handlers.onError?.(msg.code, msg.message);
|
|
40
43
|
}
|
package/dist/protocol.d.ts
CHANGED
|
@@ -109,12 +109,17 @@ export type ChangeMarkerSelectedMessage = InspectorMessageBase & {
|
|
|
109
109
|
type: "CHANGE_MARKER_SELECTED";
|
|
110
110
|
changeId: string;
|
|
111
111
|
};
|
|
112
|
+
/** The preview navigated (client-side or full load) to a new path. */
|
|
113
|
+
export type RouteChangedMessage = InspectorMessageBase & {
|
|
114
|
+
type: "ROUTE_CHANGED";
|
|
115
|
+
path: string;
|
|
116
|
+
};
|
|
112
117
|
export type ApplyChangeMarkersMessage = InspectorMessageBase & {
|
|
113
118
|
type: "APPLY_CHANGE_MARKERS";
|
|
114
119
|
markers: ChangeMarker[];
|
|
115
120
|
};
|
|
116
121
|
export type HostToClientMessage = InspectorEnableMessage | InspectorDisableMessage | InspectorHostHelloMessage | ApplyChangeMarkersMessage;
|
|
117
|
-
export type ClientToHostMessage = InspectorReadyMessage | ElementHoveredMessage | ElementSelectedMessage | ElementClearedMessage | ChangeMarkerSelectedMessage | InspectorErrorMessage;
|
|
122
|
+
export type ClientToHostMessage = InspectorReadyMessage | ElementHoveredMessage | ElementSelectedMessage | ElementClearedMessage | ChangeMarkerSelectedMessage | RouteChangedMessage | InspectorErrorMessage;
|
|
118
123
|
export type InspectorMessage = HostToClientMessage | ClientToHostMessage;
|
|
119
124
|
export declare function isInspectorMessage(value: unknown): value is InspectorMessage;
|
|
120
125
|
//# sourceMappingURL=protocol.d.ts.map
|
package/dist/protocol.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"protocol.d.ts","sourceRoot":"","sources":["../src/protocol.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"protocol.d.ts","sourceRoot":"","sources":["../src/protocol.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bootstrap.d.ts","sourceRoot":"","sources":["../../src/runtime/bootstrap.ts"],"names":[],"mappings":"AAuCA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACzD,CAAC;AA8CF;;;;GAIG;AACH,wBAAgB,yBAAyB,CACvC,OAAO,GAAE,gBAAqB,GAC7B,IAAI,
|
|
1
|
+
{"version":3,"file":"bootstrap.d.ts","sourceRoot":"","sources":["../../src/runtime/bootstrap.ts"],"names":[],"mappings":"AAuCA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACzD,CAAC;AA8CF;;;;GAIG;AACH,wBAAgB,yBAAyB,CACvC,OAAO,GAAE,gBAAqB,GAC7B,IAAI,CAkDN;AAED,4CAA4C;AAC5C,wBAAgB,+BAA+B,IAAI,IAAI,CAMtD"}
|
|
@@ -75,9 +75,10 @@ export function bootstrapInspectorPreview(options = {}) {
|
|
|
75
75
|
// In Next.js 13+ RSC, window.location.search may be empty. Fallback to passed searchParams.
|
|
76
76
|
let params;
|
|
77
77
|
if (options.searchParams) {
|
|
78
|
-
params =
|
|
79
|
-
|
|
80
|
-
|
|
78
|
+
params =
|
|
79
|
+
options.searchParams instanceof URLSearchParams
|
|
80
|
+
? options.searchParams
|
|
81
|
+
: new URLSearchParams(options.searchParams);
|
|
81
82
|
}
|
|
82
83
|
else {
|
|
83
84
|
params = new URLSearchParams(win.location.search);
|
|
@@ -6,6 +6,7 @@ export type InspectorRuntimeOptions = {
|
|
|
6
6
|
onSelect?: (payload: ElementHoverPayload) => void;
|
|
7
7
|
onClear?: () => void;
|
|
8
8
|
onChangeMarkerSelected?: (changeId: string) => void;
|
|
9
|
+
onRouteChange?: (path: string) => void;
|
|
9
10
|
};
|
|
10
11
|
export type InspectorRuntime = {
|
|
11
12
|
enable: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inspector.d.ts","sourceRoot":"","sources":["../../src/runtime/inspector.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"inspector.d.ts","sourceRoot":"","sources":["../../src/runtime/inspector.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAyCxE,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,sBAAsB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB,gBAAgB,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IACpD,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,GAAG,IAAI,CAAC;IACrD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,sBAAsB,CACpC,OAAO,EAAE,uBAAuB,GAC/B,gBAAgB,CA2UlB"}
|
|
@@ -1,6 +1,23 @@
|
|
|
1
1
|
import { runtimeElementRefFor } from "./element-ref.js";
|
|
2
2
|
import { extractMetadata, findSourceLocation, sourceKeyFor, sourceMappingStatus, } from "./metadata.js";
|
|
3
3
|
import { createOverlay, hideHighlight, hideSelectedHighlight, positionHighlight, positionSelectedHighlight, rectForElement, renderChangeMarkers, } from "./overlay.js";
|
|
4
|
+
const SOURCE_LINE_TOLERANCE = 2;
|
|
5
|
+
function parseSourceKey(raw) {
|
|
6
|
+
const m = raw ? /^(.*?):(\d+)(?::\d+)?$/.exec(raw) : null;
|
|
7
|
+
return m?.[1] ? { file: m[1], line: Number(m[2]) } : null;
|
|
8
|
+
}
|
|
9
|
+
function sameFile(a, b) {
|
|
10
|
+
return a === b || a.endsWith(`/${b}`) || b.endsWith(`/${a}`);
|
|
11
|
+
}
|
|
12
|
+
const SWALLOWED_EVENTS = [
|
|
13
|
+
"pointerup",
|
|
14
|
+
"mousedown",
|
|
15
|
+
"mouseup",
|
|
16
|
+
"click",
|
|
17
|
+
"dblclick",
|
|
18
|
+
"auxclick",
|
|
19
|
+
"contextmenu",
|
|
20
|
+
];
|
|
4
21
|
export function createInspectorRuntime(options) {
|
|
5
22
|
const { document: doc, window: win } = options;
|
|
6
23
|
const overlay = createOverlay(doc);
|
|
@@ -16,6 +33,22 @@ export function createInspectorRuntime(options) {
|
|
|
16
33
|
win.removeEventListener("mousemove", onMove, true);
|
|
17
34
|
win.removeEventListener("pointerdown", onPointerDownCapture, true);
|
|
18
35
|
doc.removeEventListener("mouseout", onLeave, true);
|
|
36
|
+
for (const type of SWALLOWED_EVENTS) {
|
|
37
|
+
win.removeEventListener(type, swallowAppInteraction, true);
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
const isChangeMarker = (target) => target instanceof Element &&
|
|
41
|
+
target.closest("[data-abbox-change-marker]") !== null;
|
|
42
|
+
/**
|
|
43
|
+
* While inspecting, a click only selects. Cancelling pointerdown alone does
|
|
44
|
+
* not stop the mousedown/mouseup/click that follow, so the app would still
|
|
45
|
+
* react (navigate, submit, open modals).
|
|
46
|
+
*/
|
|
47
|
+
const swallowAppInteraction = (event) => {
|
|
48
|
+
if (!enabled || isChangeMarker(event.target))
|
|
49
|
+
return;
|
|
50
|
+
event.preventDefault();
|
|
51
|
+
event.stopImmediatePropagation();
|
|
19
52
|
};
|
|
20
53
|
/** No mousemove fires once the pointer leaves the iframe, so clear hover here. */
|
|
21
54
|
const onLeave = (event) => {
|
|
@@ -50,13 +83,12 @@ export function createInspectorRuntime(options) {
|
|
|
50
83
|
const onPointerDownCapture = (event) => {
|
|
51
84
|
if (!enabled)
|
|
52
85
|
return;
|
|
53
|
-
if (event.
|
|
54
|
-
return;
|
|
55
|
-
if (event.target instanceof Element &&
|
|
56
|
-
event.target.closest("[data-abbox-change-marker]"))
|
|
86
|
+
if (isChangeMarker(event.target))
|
|
57
87
|
return;
|
|
58
88
|
event.preventDefault();
|
|
59
|
-
event.
|
|
89
|
+
event.stopImmediatePropagation();
|
|
90
|
+
if (event.button !== 0)
|
|
91
|
+
return;
|
|
60
92
|
const target = deepestElementAt(doc, event.clientX, event.clientY, event.target);
|
|
61
93
|
if (!target || !doc.body.contains(target))
|
|
62
94
|
return;
|
|
@@ -93,59 +125,143 @@ export function createInspectorRuntime(options) {
|
|
|
93
125
|
positionHighlight(overlay.highlight, rectForElement(el));
|
|
94
126
|
options.onHover?.(payloadFor(el));
|
|
95
127
|
}
|
|
128
|
+
let reportedSize = "";
|
|
129
|
+
const sizeKey = (el) => {
|
|
130
|
+
const rect = el.getBoundingClientRect();
|
|
131
|
+
return `${Math.round(rect.width)}x${Math.round(rect.height)}`;
|
|
132
|
+
};
|
|
133
|
+
/** Re-sends the selection when its size changes (viewport resize, reflow). */
|
|
134
|
+
const sizeObserver = typeof ResizeObserver === "undefined"
|
|
135
|
+
? null
|
|
136
|
+
: new ResizeObserver(() => {
|
|
137
|
+
if (!selected?.isConnected || sizeKey(selected) === reportedSize)
|
|
138
|
+
return;
|
|
139
|
+
reportedSize = sizeKey(selected);
|
|
140
|
+
positionSelectedHighlight(overlay.selectedHighlight, rectForElement(selected));
|
|
141
|
+
options.onSelect?.(payloadFor(selected));
|
|
142
|
+
});
|
|
96
143
|
function select(el) {
|
|
97
144
|
selected = el;
|
|
98
145
|
hovered = el;
|
|
99
146
|
positionSelectedHighlight(overlay.selectedHighlight, rectForElement(el));
|
|
100
147
|
positionHighlight(overlay.highlight, rectForElement(el));
|
|
148
|
+
sizeObserver?.disconnect();
|
|
149
|
+
reportedSize = sizeKey(el);
|
|
150
|
+
sizeObserver?.observe(el);
|
|
101
151
|
options.onSelect?.(payloadFor(el));
|
|
102
152
|
}
|
|
103
|
-
|
|
153
|
+
const onCurrentRoute = (marker) => !marker.route ||
|
|
154
|
+
win.location.pathname.replace(/\/$/, "") ===
|
|
155
|
+
marker.route.replace(/\/$/, "");
|
|
156
|
+
function resolveMarkerElement(marker) {
|
|
104
157
|
const isRendered = (node) => {
|
|
105
158
|
const rect = node.getBoundingClientRect();
|
|
106
159
|
return node.isConnected && rect.width > 0 && rect.height > 0;
|
|
107
160
|
};
|
|
161
|
+
const target = parseSourceKey(marker.sourceKeyPrefix);
|
|
162
|
+
const byLine = new Map();
|
|
163
|
+
if (target) {
|
|
164
|
+
for (const node of Array.from(doc.querySelectorAll("[data-abbox-src]"))) {
|
|
165
|
+
const src = parseSourceKey(node.getAttribute("data-abbox-src"));
|
|
166
|
+
if (!src || !sameFile(src.file, target.file))
|
|
167
|
+
continue;
|
|
168
|
+
const distance = Math.abs(src.line - target.line);
|
|
169
|
+
if (distance > SOURCE_LINE_TOLERANCE || !isRendered(node))
|
|
170
|
+
continue;
|
|
171
|
+
byLine.set(distance, [...(byLine.get(distance) ?? []), node]);
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
const nearestDistance = Math.min(...byLine.keys());
|
|
175
|
+
const sourceCandidates = byLine.get(nearestDistance) ?? [];
|
|
176
|
+
const hint = marker.textHint?.trim();
|
|
177
|
+
const hasHint = (node) => node.textContent?.trim() === hint;
|
|
178
|
+
const sourceTextCandidates = hint ? sourceCandidates.filter(hasHint) : [];
|
|
179
|
+
const textCandidates = hint
|
|
180
|
+
? Array.from(doc.querySelectorAll("body *")).filter((node) => node.children.length === 0 &&
|
|
181
|
+
isRendered(node) &&
|
|
182
|
+
hasHint(node) &&
|
|
183
|
+
!node.closest("[data-abbox-inspector]"))
|
|
184
|
+
: [];
|
|
185
|
+
if (sourceTextCandidates.length === 1)
|
|
186
|
+
return sourceTextCandidates[0] ?? null;
|
|
187
|
+
if (sourceCandidates.length === 1)
|
|
188
|
+
return sourceCandidates[0] ?? null;
|
|
189
|
+
if (textCandidates.length === 1)
|
|
190
|
+
return textCandidates[0] ?? null;
|
|
191
|
+
return null;
|
|
192
|
+
}
|
|
193
|
+
function resolveMarkerElements(next) {
|
|
108
194
|
for (const marker of next) {
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
marker.route.replace(/\/$/, ""))
|
|
195
|
+
const cached = refIdToElement.get(marker.elementRefId);
|
|
196
|
+
if (cached?.isConnected && onCurrentRoute(marker))
|
|
112
197
|
continue;
|
|
113
|
-
|
|
198
|
+
refIdToElement.delete(marker.elementRefId);
|
|
199
|
+
if (!onCurrentRoute(marker))
|
|
114
200
|
continue;
|
|
115
|
-
const
|
|
116
|
-
? `${marker.sourceKeyPrefix}:`
|
|
117
|
-
: null;
|
|
118
|
-
const sourceCandidates = sourceKey
|
|
119
|
-
? Array.from(doc.querySelectorAll("[data-abbox-src]")).filter((node) => {
|
|
120
|
-
const raw = node.getAttribute("data-abbox-src") ?? "";
|
|
121
|
-
return (isRendered(node) &&
|
|
122
|
-
(raw.startsWith(sourceKey) || raw.endsWith(`/${sourceKey}`)));
|
|
123
|
-
})
|
|
124
|
-
: [];
|
|
125
|
-
const hint = marker.textHint?.trim();
|
|
126
|
-
const textCandidates = hint
|
|
127
|
-
? Array.from(doc.querySelectorAll("body *")).filter((node) => node.children.length === 0 &&
|
|
128
|
-
isRendered(node) &&
|
|
129
|
-
node.textContent?.trim() === hint &&
|
|
130
|
-
!node.closest("[data-abbox-inspector]"))
|
|
131
|
-
: [];
|
|
132
|
-
const sourceTextCandidates = hint
|
|
133
|
-
? sourceCandidates.filter((node) => node.textContent?.trim() === hint)
|
|
134
|
-
: [];
|
|
135
|
-
const match = sourceTextCandidates.length === 1
|
|
136
|
-
? sourceTextCandidates[0]
|
|
137
|
-
: textCandidates.length === 1
|
|
138
|
-
? textCandidates[0]
|
|
139
|
-
: !hint && sourceCandidates.length === 1
|
|
140
|
-
? sourceCandidates[0]
|
|
141
|
-
: null;
|
|
201
|
+
const match = resolveMarkerElement(marker);
|
|
142
202
|
if (match)
|
|
143
203
|
refIdToElement.set(marker.elementRefId, match);
|
|
144
204
|
}
|
|
145
205
|
}
|
|
206
|
+
/** Selects the element of the change the host focused, once it renders. */
|
|
207
|
+
function focusPulsedMarker() {
|
|
208
|
+
const focused = markers.find((marker) => marker.pulse && refIdToElement.has(marker.elementRefId));
|
|
209
|
+
if (!focused) {
|
|
210
|
+
if (!markers.some((marker) => marker.pulse))
|
|
211
|
+
focusedMarkerId = null;
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
214
|
+
if (focused.elementRefId === focusedMarkerId)
|
|
215
|
+
return;
|
|
216
|
+
focusedMarkerId = focused.elementRefId;
|
|
217
|
+
const el = refIdToElement.get(focused.elementRefId);
|
|
218
|
+
if (!el)
|
|
219
|
+
return;
|
|
220
|
+
el.scrollIntoView?.({ block: "center", inline: "nearest" });
|
|
221
|
+
select(el);
|
|
222
|
+
}
|
|
223
|
+
function refreshMarkers() {
|
|
224
|
+
resolveMarkerElements(markers);
|
|
225
|
+
focusPulsedMarker();
|
|
226
|
+
renderChangeMarkers(overlay.markerLayer, markers, (id) => refIdToElement.get(id) ?? null, options.onChangeMarkerSelected);
|
|
227
|
+
if (selected?.isConnected) {
|
|
228
|
+
positionSelectedHighlight(overlay.selectedHighlight, rectForElement(selected));
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
let lastPath = win.location.pathname;
|
|
232
|
+
let refreshFrame = 0;
|
|
233
|
+
/** SPA navigation and async data swap the DOM after markers arrive. */
|
|
234
|
+
const scheduleRefresh = () => {
|
|
235
|
+
if (refreshFrame)
|
|
236
|
+
return;
|
|
237
|
+
refreshFrame = win.requestAnimationFrame(() => {
|
|
238
|
+
refreshFrame = 0;
|
|
239
|
+
if (win.location.pathname !== lastPath) {
|
|
240
|
+
lastPath = win.location.pathname;
|
|
241
|
+
options.onRouteChange?.(lastPath);
|
|
242
|
+
}
|
|
243
|
+
if (markers.length)
|
|
244
|
+
refreshMarkers();
|
|
245
|
+
});
|
|
246
|
+
};
|
|
247
|
+
const observer = typeof MutationObserver === "undefined"
|
|
248
|
+
? null
|
|
249
|
+
: new MutationObserver((records) => {
|
|
250
|
+
const ownChange = records.every((record) => record.target instanceof Element &&
|
|
251
|
+
record.target.closest("[data-abbox-inspector]") !== null);
|
|
252
|
+
if (!ownChange)
|
|
253
|
+
scheduleRefresh();
|
|
254
|
+
});
|
|
255
|
+
observer?.observe(doc.body, {
|
|
256
|
+
childList: true,
|
|
257
|
+
subtree: true,
|
|
258
|
+
characterData: true,
|
|
259
|
+
});
|
|
260
|
+
win.addEventListener("popstate", scheduleRefresh);
|
|
146
261
|
function clearSelection() {
|
|
147
262
|
hovered = null;
|
|
148
263
|
selected = null;
|
|
264
|
+
sizeObserver?.disconnect();
|
|
149
265
|
hideHighlight(overlay.highlight);
|
|
150
266
|
hideSelectedHighlight(overlay.selectedHighlight);
|
|
151
267
|
options.onClear?.();
|
|
@@ -160,6 +276,9 @@ export function createInspectorRuntime(options) {
|
|
|
160
276
|
win.addEventListener("mousemove", onMove, true);
|
|
161
277
|
win.addEventListener("pointerdown", onPointerDownCapture, true);
|
|
162
278
|
doc.addEventListener("mouseout", onLeave, true);
|
|
279
|
+
for (const type of SWALLOWED_EVENTS) {
|
|
280
|
+
win.addEventListener(type, swallowAppInteraction, true);
|
|
281
|
+
}
|
|
163
282
|
},
|
|
164
283
|
disable: () => {
|
|
165
284
|
if (!enabled)
|
|
@@ -176,25 +295,7 @@ export function createInspectorRuntime(options) {
|
|
|
176
295
|
markers = next;
|
|
177
296
|
for (const marker of next)
|
|
178
297
|
refIdToElement.delete(marker.elementRefId);
|
|
179
|
-
|
|
180
|
-
const focused = next.find((marker) => marker.pulse && refIdToElement.has(marker.elementRefId));
|
|
181
|
-
if (focused && focused.elementRefId !== focusedMarkerId) {
|
|
182
|
-
refIdToElement
|
|
183
|
-
.get(focused.elementRefId)
|
|
184
|
-
?.scrollIntoView?.({ block: "center", inline: "nearest" });
|
|
185
|
-
}
|
|
186
|
-
focusedMarkerId = focused?.elementRefId ?? null;
|
|
187
|
-
const unresolved = next.filter((marker) => (!marker.route ||
|
|
188
|
-
marker.route.replace(/\/$/, "") ===
|
|
189
|
-
win.location.pathname.replace(/\/$/, "")) &&
|
|
190
|
-
!refIdToElement.has(marker.elementRefId));
|
|
191
|
-
if (unresolved.length) {
|
|
192
|
-
console.warn("[abbox-inspector] change markers could not be matched to rendered elements", {
|
|
193
|
-
route: win.location.pathname,
|
|
194
|
-
changeIds: unresolved.map((marker) => marker.elementRefId),
|
|
195
|
-
});
|
|
196
|
-
}
|
|
197
|
-
renderChangeMarkers(overlay.markerLayer, markers, (id) => refIdToElement.get(id) ?? null, options.onChangeMarkerSelected);
|
|
298
|
+
refreshMarkers();
|
|
198
299
|
},
|
|
199
300
|
getElementByRefId: (id) => refIdToElement.get(id) ?? null,
|
|
200
301
|
destroy: () => {
|
|
@@ -204,6 +305,11 @@ export function createInspectorRuntime(options) {
|
|
|
204
305
|
}
|
|
205
306
|
win.removeEventListener("scroll", onScrollOrResize, true);
|
|
206
307
|
win.removeEventListener("resize", onScrollOrResize);
|
|
308
|
+
win.removeEventListener("popstate", scheduleRefresh);
|
|
309
|
+
observer?.disconnect();
|
|
310
|
+
sizeObserver?.disconnect();
|
|
311
|
+
if (refreshFrame)
|
|
312
|
+
win.cancelAnimationFrame(refreshFrame);
|
|
207
313
|
hovered = null;
|
|
208
314
|
hideHighlight(overlay.highlight);
|
|
209
315
|
overlay.destroy();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"metadata.d.ts","sourceRoot":"","sources":["../../src/runtime/metadata.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,eAAe,EAEf,cAAc,EACd,mBAAmB,EACpB,MAAM,gBAAgB,CAAC;AAYxB,wBAAgB,kBAAkB,CAAC,EAAE,EAAE,OAAO,GAAG,cAAc,GAAG,IAAI,CAarE;AAED,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,cAAc,GAAG,IAAI,GAC5B,mBAAmB,CAGrB;AAED,wBAAgB,eAAe,CAAC,EAAE,EAAE,OAAO,GAAG,eAAe,CAkC5D;
|
|
1
|
+
{"version":3,"file":"metadata.d.ts","sourceRoot":"","sources":["../../src/runtime/metadata.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,eAAe,EAEf,cAAc,EACd,mBAAmB,EACpB,MAAM,gBAAgB,CAAC;AAYxB,wBAAgB,kBAAkB,CAAC,EAAE,EAAE,OAAO,GAAG,cAAc,GAAG,IAAI,CAarE;AAED,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,cAAc,GAAG,IAAI,GAC5B,mBAAmB,CAGrB;AAED,wBAAgB,eAAe,CAAC,EAAE,EAAE,OAAO,GAAG,eAAe,CAkC5D;AA2FD,wBAAgB,YAAY,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAGzE"}
|
package/dist/runtime/metadata.js
CHANGED
|
@@ -93,7 +93,9 @@ function nearbyFieldStates(el) {
|
|
|
93
93
|
if (controls.length === 0)
|
|
94
94
|
return undefined;
|
|
95
95
|
return controls.map((control) => {
|
|
96
|
-
const type = control instanceof HTMLInputElement
|
|
96
|
+
const type = control instanceof HTMLInputElement
|
|
97
|
+
? control.type
|
|
98
|
+
: control.getAttribute("type");
|
|
97
99
|
const checkable = control instanceof HTMLInputElement &&
|
|
98
100
|
(control.type === "checkbox" || control.type === "radio");
|
|
99
101
|
return {
|
package/dist/runtime/overlay.js
CHANGED
|
@@ -115,7 +115,7 @@ export function renderChangeMarkers(layer, markers, resolveElement, onSelect) {
|
|
|
115
115
|
background: marker.kind === "change-added"
|
|
116
116
|
? "#22c55e"
|
|
117
117
|
: marker.kind === "change-modified"
|
|
118
|
-
? "#
|
|
118
|
+
? "#f97316"
|
|
119
119
|
: marker.kind === "mock"
|
|
120
120
|
? "#f59e0b"
|
|
121
121
|
: "#ef4444",
|
|
@@ -140,8 +140,8 @@ export function renderChangeMarkers(layer, markers, resolveElement, onSelect) {
|
|
|
140
140
|
: "0 0 0 1px rgba(0,0,0,0.2)";
|
|
141
141
|
if (marker.pulse)
|
|
142
142
|
ensurePulseStyle(layer.ownerDocument);
|
|
143
|
-
dot.style.left = `${rect.x
|
|
144
|
-
dot.style.top = `${rect.top -
|
|
143
|
+
dot.style.left = `${rect.x - 6}px`;
|
|
144
|
+
dot.style.top = `${rect.top - 6}px`;
|
|
145
145
|
}
|
|
146
146
|
}
|
|
147
147
|
function ensurePulseStyle(doc) {
|