diff --git a/src/client/index.js b/src/client/index.js index 8d3b8d0..20a2c1c 100644 --- a/src/client/index.js +++ b/src/client/index.js @@ -19,18 +19,18 @@ window.addEventListener('message', ({ data, source }) => { // only accept messages from our application or script if (source !== window || data?.source !== 'svelte-devtools') return; - if (data.type === 'ext/select') { + if (data.type === 'bridge::ext/select') { const node = getNode(data.payload); // @ts-expect-error - saved for `inspect()` if (node) window.$n = node.detail; - } else if (data.type === 'ext/highlight') { + } else if (data.type === 'bridge::ext/highlight') { const node = getNode(data.payload); return highlight(node); } // --- TODO: cleanup/implement below --- - // case 'ext/inspect': { + // case 'bridge::ext/inspect': { // console.log(data.payload, data.payload instanceof HTMLElement); // /** @param {MouseEvent} event */ // const move = ({ target }) => highlight({ type: 'element', detail: target }); @@ -54,7 +54,7 @@ window.addEventListener('message', ({ data, source }) => { // return highlight(undefined); // } - // case 'ext/profiler': { + // case 'bridge::ext/profiler': { // return data.payload ? startProfiler() : stopProfiler(); // } @@ -185,7 +185,7 @@ function send(type, payload) { addListener({ add(node, anchor) { - send('courier/node:add', { + send('bridge::courier/node->add', { node: serialize(node), target: node.parent?.id ?? null, anchor: anchor?.id ?? null, @@ -193,14 +193,14 @@ addListener({ }, remove(node) { - send('courier/node:remove', { node: serialize(node) }); + send('bridge::courier/node->remove', { node: serialize(node) }); }, update(node) { - send('courier/node:update', { node: serialize(node) }); + send('bridge::courier/node->update', { node: serialize(node) }); }, profile(/** frame */) { - // send('courier/profile:update', { frame }); + // send('bridge::courier/profile->update', { frame }); }, }); diff --git a/src/lib/nodes/Node.svelte b/src/lib/nodes/Node.svelte index 3133ad4..89bee21 100644 --- a/src/lib/nodes/Node.svelte +++ b/src/lib/nodes/Node.svelte @@ -38,7 +38,7 @@ on:click|stopPropagation={() => selected.set(node)} on:mousemove|stopPropagation={() => { if ($hovered?.id === node.id) return; - background.send('ext/highlight', node.id); + background.send('bridge::ext/highlight', node.id); hovered.set(node); }} > diff --git a/src/lib/runtime.ts b/src/lib/runtime.ts index 993ed27..a6421b0 100644 --- a/src/lib/runtime.ts +++ b/src/lib/runtime.ts @@ -3,10 +3,10 @@ import { type DebugNode, hovered, root, selected } from './store'; const tabId = chrome.devtools.inspectedWindow.tabId; const port = chrome.runtime.connect({ name: `${tabId}` }); -port.postMessage({ source: 'svelte-devtools', tabId, type: 'ext/init' }); +port.postMessage({ source: 'svelte-devtools', tabId, type: 'bypass::ext/init' }); export const background = { - send(type: `${'ext' | 'page'}/${string}`, payload?: any) { + send(type: `bridge::${'ext' | 'page'}/${string}` | 'bypass::ext/page->refresh', payload?: any) { port.postMessage({ source: 'svelte-devtools', tabId, type, payload }); }, }; @@ -39,18 +39,18 @@ function resolveEventBubble(node: any) { port.onMessage.addListener(({ type, payload }) => { switch (type) { - case 'ext/clear': { + case 'bridge::ext/clear': { selected.set(undefined); hovered.set(undefined); return root.set([]); } - case 'ext/inspect': { + case 'bridge::ext/inspect': { const current = nodes.get(payload.node.id); return selected.set(current); } - case 'courier/node:add': { + case 'bridge::courier/node->add': { const { node, target, anchor } = payload as { node: DebugNode; target: null | number; @@ -73,7 +73,7 @@ port.onMessage.addListener(({ type, payload }) => { return (node.parent = parent).invalidate(); } - case 'courier/node:remove': { + case 'bridge::courier/node->remove': { const node = payload.node as SvelteBlockDetail; const current = nodes.get(node.id); if (current) nodes.delete(current.id); @@ -84,7 +84,7 @@ port.onMessage.addListener(({ type, payload }) => { return current.parent.invalidate(); } - case 'courier/node:update': { + case 'bridge::courier/node->update': { const node = payload.node as SvelteBlockDetail; const current = nodes.get(node.id); if (!current) return; @@ -95,7 +95,7 @@ port.onMessage.addListener(({ type, payload }) => { return current.invalidate(); } - // case 'courier/profile:update': { + // case 'bridge::courier/profile->update': { // resolveFrame(frame); // profileFrame.set(frame); // break; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 02b5166..a3b0866 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -18,7 +18,7 @@ import { hovered, root, selected, visibility } from '$lib/store'; $: if ($selected) { - background.send('ext/select', $selected.id); + background.send('bridge::ext/select', $selected.id); let current = $selected; let invalid = null; @@ -32,7 +32,7 @@ } function reset() { - background.send('ext/highlight', null); + background.send('bridge::ext/highlight', null); hovered.set(undefined); } diff --git a/src/routes/ConnectMessage.svelte b/src/routes/ConnectMessage.svelte index 753cdb8..dc37a9c 100644 --- a/src/routes/ConnectMessage.svelte +++ b/src/routes/ConnectMessage.svelte @@ -7,7 +7,7 @@

No Svelte app detected - +