-
Notifications
You must be signed in to change notification settings - Fork 3
/
devtools.ts
77 lines (66 loc) · 2.63 KB
/
devtools.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import { runtime, devtools } from 'webextension-polyfill';
import { useStore } from './app/store';
import { PiHostMessage, PiWorkerMessage } from './types';
import { DevtoolsPanels } from 'webextension-polyfill/namespaces/devtools_panels';
type PanelCreate = (
title: string,
iconPath: string,
pagePath: string,
panelCreatedCallback:
(panel: DevtoolsPanels.ExtensionPanel) => void
) => void
async function initDevTools() {
try {
const port = runtime.connect(undefined, { name: 'piral-inspector-host' });
const sendMessage = (message: PiHostMessage) => {
const tabId = devtools.inspectedWindow.tabId;
port.postMessage({
message,
tabId,
});
};
/**
* Cast needed because webextension polyfill does not support the right interfacing for v3
* official documentation: https://developer.chrome.com/docs/extensions/reference/api/devtools/panels?hl=en#example
*/
const panelCreate = devtools.panels.create as unknown as PanelCreate
/**
* Call is asynchronus but doesnt provide promise anymore, needs to be done with callback
*/
panelCreate('Piral', '/assets/logo.png', './panel.html', (panel: DevtoolsPanels.ExtensionPanel) => {
panel.onShown.addListener((panelWindow: Window) => {
panelWindow.sendCommand = sendMessage;
panelWindow.dispatchEvent(new CustomEvent('pi-store', { detail: useStore }));
});
port.onMessage.addListener((message: PiWorkerMessage) => {
const { actions } = useStore.getState();
switch (message.type) {
case 'available':
return actions.connect(message.name, message.version, message.kind, message.capabilities, message.state);
case 'unavailable':
return actions.disconnect();
case 'pilets':
return actions.updatePilets(message.pilets);
case 'routes':
return actions.updateRoutes(message.routes);
case 'settings':
return actions.updateSettings(message.settings);
case 'container':
return actions.updateContainer(message.container);
case 'events':
return actions.updateEvents(message.events);
case 'extensions':
return actions.updateExtensions(message.extensions);
case 'info':
return actions.updateInfo(message.name, message.version, message.kind, message.capabilities);
case 'dependency-map':
return actions.updateDependencyMap(message.dependencyMap);
}
});
sendMessage({ type: 'init' });
});
} catch (err) {
console.error(err.message);
}
}
initDevTools();