Skip to content

Commit 857abdf

Browse files
committed
2017-07-22 11:31:02
1 parent f3527ea commit 857abdf

21 files changed

+18639
-32
lines changed

LICENSE

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
The MIT License (MIT)
22

3-
Copyright (c) 2016 汪磊
3+
Copyright (c) 2017 汪磊 <[email protected]> (https://zce.me/)
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy
66
of this software and associated documentation files (the "Software"), to deal

README.md

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
# vue-devtools
22

3-
An electron devtools extension for debugging Vue.js applications.
3+
> An electron devtools extension for debugging Vue.js applications.
44
55
[![NPM](https://nodei.co/npm/vue-devtools.png)](https://nodei.co/npm/vue-devtools/)
66

77
## Usage
88

99
### Installing
10+
1011
In an electron proj
1112

1213
```bash
@@ -41,8 +42,10 @@ app.on('ready', () => {
4142
})
4243
```
4344

45+
## License
4446

47+
npm package for electron base on [vuejs/vue-devtools](https://github.com/vuejs/vue-devtools)
4548

46-
## npm package for electron base on https://github.com/vuejs/vue-devtools
49+
## Latest updated
4750

48-
## Latest updated @ Apr 16, 2017
51+
**@ Jul 22, 2017**

build/backend.js

Lines changed: 2095 additions & 1 deletion
Large diffs are not rendered by default.

build/background.js

Lines changed: 167 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,167 @@
1-
!function(e){function n(t){if(o[t])return o[t].exports;var s=o[t]={i:t,l:!1,exports:{}};return e[t].call(s.exports,s,s.exports,n),s.l=!0,s.exports}var o={};n.m=e,n.c=o,n.i=function(e){return e},n.d=function(e,o,t){n.o(e,o)||Object.defineProperty(e,o,{configurable:!1,enumerable:!0,get:t})},n.n=function(e){var o=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(o,"a",o),o},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n(n.s=20)}({20:function(e,n){function o(e){return+e+""===e}function t(e){chrome.tabs.executeScript(e,{file:"/build/proxy.js"},function(n){n?console.log("injected proxy to tab "+e):c[e].devtools.postMessage("proxy-fail")})}function s(e,n,o){function t(n){if("log"===n.event)return console.log("tab "+e,n.payload);console.log("devtools -> backend",n),o.postMessage(n)}function s(o){if("log"===o.event)return console.log("tab "+e,o.payload);console.log("backend -> devtools",o),n.postMessage(o)}function r(){console.log("tab "+e+" disconnected."),n.onMessage.removeListener(t),o.onMessage.removeListener(s),n.disconnect(),o.disconnect(),c[e]=null}n.onMessage.addListener(t),o.onMessage.addListener(s),n.onDisconnect.addListener(r),o.onDisconnect.addListener(r),console.log("tab "+e+" connected.")}var c={};chrome.runtime.onConnect.addListener(function(e){var n,r;o(e.name)?(n=e.name,r="devtools",t(+e.name)):(n=e.sender.tab.id,r="backend"),c[n]||(c[n]={devtools:null,backend:null}),c[n][r]=e,c[n].devtools&&c[n].backend&&s(n,c[n].devtools,c[n].backend)}),chrome.runtime.onMessage.addListener(function(e,n){n.tab&&e.vueDetected&&(chrome.browserAction.setIcon({tabId:n.tab.id,path:{16:"icons/16.png",48:"icons/48.png",128:"icons/128.png"}}),chrome.browserAction.setPopup({tabId:n.tab.id,popup:e.devtoolsEnabled?"popups/enabled.html":"popups/disabled.html"}))})}});
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
/******/
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
/******/
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId]) {
10+
/******/ return installedModules[moduleId].exports;
11+
/******/ }
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ i: moduleId,
15+
/******/ l: false,
16+
/******/ exports: {}
17+
/******/ };
18+
/******/
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
/******/
22+
/******/ // Flag the module as loaded
23+
/******/ module.l = true;
24+
/******/
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
/******/
29+
/******/
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
/******/
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
/******/
36+
/******/ // define getter function for harmony exports
37+
/******/ __webpack_require__.d = function(exports, name, getter) {
38+
/******/ if(!__webpack_require__.o(exports, name)) {
39+
/******/ Object.defineProperty(exports, name, {
40+
/******/ configurable: false,
41+
/******/ enumerable: true,
42+
/******/ get: getter
43+
/******/ });
44+
/******/ }
45+
/******/ };
46+
/******/
47+
/******/ // getDefaultExport function for compatibility with non-harmony modules
48+
/******/ __webpack_require__.n = function(module) {
49+
/******/ var getter = module && module.__esModule ?
50+
/******/ function getDefault() { return module['default']; } :
51+
/******/ function getModuleExports() { return module; };
52+
/******/ __webpack_require__.d(getter, 'a', getter);
53+
/******/ return getter;
54+
/******/ };
55+
/******/
56+
/******/ // Object.prototype.hasOwnProperty.call
57+
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
58+
/******/
59+
/******/ // __webpack_public_path__
60+
/******/ __webpack_require__.p = "";
61+
/******/
62+
/******/ // Load entry module and return exports
63+
/******/ return __webpack_require__(__webpack_require__.s = 104);
64+
/******/ })
65+
/************************************************************************/
66+
/******/ ({
67+
68+
/***/ 104:
69+
/***/ (function(module, exports) {
70+
71+
// the background script runs all the time and serves as a central message
72+
// hub for each vue devtools (panel + proxy + backend) instance.
73+
74+
var ports = {}
75+
76+
chrome.runtime.onConnect.addListener(function (port) {
77+
var tab
78+
var name
79+
if (isNumeric(port.name)) {
80+
tab = port.name
81+
name = 'devtools'
82+
installProxy(+port.name)
83+
} else {
84+
tab = port.sender.tab.id
85+
name = 'backend'
86+
}
87+
88+
if (!ports[tab]) {
89+
ports[tab] = {
90+
devtools: null,
91+
backend: null
92+
}
93+
}
94+
ports[tab][name] = port
95+
96+
if (ports[tab].devtools && ports[tab].backend) {
97+
doublePipe(tab, ports[tab].devtools, ports[tab].backend)
98+
}
99+
})
100+
101+
function isNumeric (str) {
102+
return +str + '' === str
103+
}
104+
105+
function installProxy (tabId) {
106+
chrome.tabs.executeScript(tabId, {
107+
file: '/build/proxy.js'
108+
}, function (res) {
109+
if (!res) {
110+
ports[tabId].devtools.postMessage('proxy-fail')
111+
} else {
112+
console.log('injected proxy to tab ' + tabId)
113+
}
114+
})
115+
}
116+
117+
function doublePipe (id, one, two) {
118+
one.onMessage.addListener(lOne)
119+
function lOne (message) {
120+
if (message.event === 'log') {
121+
return console.log('tab ' + id, message.payload)
122+
}
123+
console.log('devtools -> backend', message)
124+
two.postMessage(message)
125+
}
126+
two.onMessage.addListener(lTwo)
127+
function lTwo (message) {
128+
if (message.event === 'log') {
129+
return console.log('tab ' + id, message.payload)
130+
}
131+
console.log('backend -> devtools', message)
132+
one.postMessage(message)
133+
}
134+
function shutdown () {
135+
console.log('tab ' + id + ' disconnected.')
136+
one.onMessage.removeListener(lOne)
137+
two.onMessage.removeListener(lTwo)
138+
one.disconnect()
139+
two.disconnect()
140+
ports[id] = null
141+
}
142+
one.onDisconnect.addListener(shutdown)
143+
two.onDisconnect.addListener(shutdown)
144+
console.log('tab ' + id + ' connected.')
145+
}
146+
147+
chrome.runtime.onMessage.addListener(function (req, sender) {
148+
if (sender.tab && req.vueDetected) {
149+
chrome.browserAction.setIcon({
150+
tabId: sender.tab.id,
151+
path: {
152+
16: 'icons/16.png',
153+
48: 'icons/48.png',
154+
128: 'icons/128.png'
155+
}
156+
})
157+
chrome.browserAction.setPopup({
158+
tabId: sender.tab.id,
159+
popup: req.devtoolsEnabled ? 'popups/enabled.html' : 'popups/disabled.html'
160+
})
161+
}
162+
})
163+
164+
165+
/***/ })
166+
167+
/******/ });

build/detector.js

Lines changed: 109 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,109 @@
1-
!function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=21)}({21:function(e,t){function n(e){setTimeout(function(){for(var t,n=document.querySelectorAll("*"),o=0;o<n.length;o++)if(n[o].__vue__){t=n[o];break}if(t){for(var r=Object.getPrototypeOf(t.__vue__).constructor;r.super;)r=r.super;e.postMessage({devtoolsEnabled:r.config.devtools,vueDetected:!0},"*")}},100)}window.addEventListener("message",function(e){e.source===window&&e.data.vueDetected&&chrome.runtime.sendMessage(e.data)});var o=document.createElement("script");o.textContent=";("+n.toString()+")(window)",document.documentElement.appendChild(o),o.parentNode.removeChild(o)}});
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
/******/
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
/******/
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId]) {
10+
/******/ return installedModules[moduleId].exports;
11+
/******/ }
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ i: moduleId,
15+
/******/ l: false,
16+
/******/ exports: {}
17+
/******/ };
18+
/******/
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
/******/
22+
/******/ // Flag the module as loaded
23+
/******/ module.l = true;
24+
/******/
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
/******/
29+
/******/
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
/******/
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
/******/
36+
/******/ // define getter function for harmony exports
37+
/******/ __webpack_require__.d = function(exports, name, getter) {
38+
/******/ if(!__webpack_require__.o(exports, name)) {
39+
/******/ Object.defineProperty(exports, name, {
40+
/******/ configurable: false,
41+
/******/ enumerable: true,
42+
/******/ get: getter
43+
/******/ });
44+
/******/ }
45+
/******/ };
46+
/******/
47+
/******/ // getDefaultExport function for compatibility with non-harmony modules
48+
/******/ __webpack_require__.n = function(module) {
49+
/******/ var getter = module && module.__esModule ?
50+
/******/ function getDefault() { return module['default']; } :
51+
/******/ function getModuleExports() { return module; };
52+
/******/ __webpack_require__.d(getter, 'a', getter);
53+
/******/ return getter;
54+
/******/ };
55+
/******/
56+
/******/ // Object.prototype.hasOwnProperty.call
57+
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
58+
/******/
59+
/******/ // __webpack_public_path__
60+
/******/ __webpack_require__.p = "";
61+
/******/
62+
/******/ // Load entry module and return exports
63+
/******/ return __webpack_require__(__webpack_require__.s = 113);
64+
/******/ })
65+
/************************************************************************/
66+
/******/ ({
67+
68+
/***/ 113:
69+
/***/ (function(module, exports) {
70+
71+
window.addEventListener('message', function (e) {
72+
if (e.source === window && e.data.vueDetected) {
73+
chrome.runtime.sendMessage(e.data)
74+
}
75+
})
76+
77+
function detect (win) {
78+
setTimeout(function () {
79+
var all = document.querySelectorAll('*')
80+
var el
81+
for (var i = 0; i < all.length; i++) {
82+
if (all[i].__vue__) {
83+
el = all[i]
84+
break
85+
}
86+
}
87+
if (el) {
88+
var Vue = Object.getPrototypeOf(el.__vue__).constructor
89+
while (Vue.super) {
90+
Vue = Vue.super
91+
}
92+
win.postMessage({
93+
devtoolsEnabled: Vue.config.devtools,
94+
vueDetected: true
95+
}, '*')
96+
}
97+
}, 100)
98+
}
99+
100+
// inject the hook
101+
var script = document.createElement('script')
102+
script.textContent = ';(' + detect.toString() + ')(window)'
103+
document.documentElement.appendChild(script)
104+
script.parentNode.removeChild(script)
105+
106+
107+
/***/ })
108+
109+
/******/ });

0 commit comments

Comments
 (0)