File size: 3,278 Bytes
4d70170 |
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 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 |
// the background script runs all the time and serves as a central message
// hub for each vue devtools (panel + proxy + backend) instance.
const ports = {}
chrome.runtime.onConnect.addListener((port) => {
let tab
let name
if (isNumeric(port.name)) {
tab = port.name
name = 'devtools'
installProxy(+port.name)
}
else {
tab = port.sender.tab.id
name = 'backend'
}
if (!ports[tab]) {
ports[tab] = {
devtools: null,
backend: null,
}
}
ports[tab][name] = port
if (ports[tab].devtools && ports[tab].backend) {
doublePipe(tab, ports[tab].devtools, ports[tab].backend)
}
})
function isNumeric(str) {
return `${+str}` === str
}
function installProxy(tabId) {
chrome.tabs.executeScript(tabId, {
file: '/build/proxy.js',
}, (res) => {
if (!res) {
ports[tabId].devtools.postMessage('proxy-fail')
}
else {
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line no-console
console.log(`injected proxy to tab ${tabId}`)
}
}
})
}
function doublePipe(id, one, two) {
one.onMessage.addListener(lOne)
function lOne(message) {
if (message.event === 'log') {
// eslint-disable-next-line no-console
return console.log(`tab ${id}`, message.payload)
}
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line no-console
console.log('%cdevtools -> backend', 'color:#888;', message)
}
two.postMessage(message)
}
two.onMessage.addListener(lTwo)
function lTwo(message) {
if (message.event === 'log') {
// eslint-disable-next-line no-console
return console.log(`tab ${id}`, message.payload)
}
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line no-console
console.log('%cbackend -> devtools', 'color:#888;', message)
}
one.postMessage(message)
}
function shutdown() {
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line no-console
console.log(`tab ${id} disconnected.`)
}
one.onMessage.removeListener(lOne)
two.onMessage.removeListener(lTwo)
one.disconnect()
two.disconnect()
ports[id] = null
}
one.onDisconnect.addListener(shutdown)
two.onDisconnect.addListener(shutdown)
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line no-console
console.log(`tab ${id} connected.`)
}
}
chrome.runtime.onMessage.addListener((req, sender) => {
if (sender.tab && req.vueDetected) {
const suffix = req.nuxtDetected ? '.nuxt' : ''
chrome.browserAction.setIcon({
tabId: sender.tab.id,
path: {
16: `icons/16${suffix}.png`,
48: `icons/48${suffix}.png`,
128: `icons/128${suffix}.png`,
},
})
chrome.browserAction.setPopup({
tabId: sender.tab.id,
popup: req.devtoolsEnabled ? `popups/enabled${suffix}.html` : `popups/disabled${suffix}.html`,
})
}
if (req.action === 'vue-take-screenshot' && sender.envType === 'devtools_child') {
browser.tabs.captureVisibleTab({
format: 'png',
}).then((dataUrl) => {
browser.runtime.sendMessage({
action: 'vue-screenshot-result',
id: req.id,
dataUrl,
})
})
}
})
|