├── .babelrc ├── .electron-vue ├── build.js ├── dev-client.js ├── dev-runner.js ├── webpack.main.config.js ├── webpack.renderer.config.js └── webpack.web.config.js ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── .npmrc ├── .travis.yml ├── Dockerfile ├── LICENSE ├── README.md ├── appveyor.yml ├── assets ├── preview1.png ├── preview2.png └── preview3.png ├── build └── icons │ ├── 256x256.png │ ├── icon.icns │ └── icon.ico ├── config.js ├── devTools └── vue-devtools │ ├── build │ ├── backend.js │ ├── background.js │ ├── detector.js │ ├── devtools-background.js │ ├── devtools.js │ ├── hook.js │ └── proxy.js │ ├── devtools-background.html │ ├── devtools.html │ ├── icons │ ├── 128-gray.png │ ├── 128.png │ ├── 16-gray.png │ ├── 16.png │ ├── 48-gray.png │ └── 48.png │ ├── manifest.json │ ├── popups │ ├── disabled.html │ ├── enabled.html │ └── not-found.html │ ├── src │ ├── backend.js │ ├── background.js │ ├── detector.js │ ├── devtools-background.js │ ├── devtools.js │ ├── hook.js │ └── proxy.js │ └── webpack.config.js ├── dist ├── electron │ └── .gitkeep └── web │ └── .gitkeep ├── package-lock.json ├── package.json ├── records ├── add-vue-devtools.md └── assets │ └── install-vue-devtool.png ├── server ├── logger.js ├── server.js └── sign.js ├── src ├── index.ejs ├── main │ ├── index.dev.js │ ├── index.js │ └── ipc.js └── renderer │ ├── App.vue │ ├── assets │ ├── .gitkeep │ ├── button │ │ ├── back.png │ │ ├── close.png │ │ ├── stick_actived.png │ │ └── stick_inactived.png │ └── logo.png │ ├── main.js │ ├── main.scss │ ├── reset.scss │ ├── router │ └── index.js │ ├── store │ ├── index.js │ └── modules │ │ ├── Counter.js │ │ ├── barrage.js │ │ ├── global.js │ │ ├── index.js │ │ └── room.js │ ├── util │ ├── Huya │ │ ├── emoji.js │ │ ├── roomInfo.js │ │ └── socket.js │ ├── baiduTTS.js │ └── ipc.js │ └── views │ ├── huya │ ├── BarrageList.vue │ └── BarrageList │ │ ├── BarrageItem.vue │ │ ├── HuyaEmoji.vue │ │ └── ListHeader.vue │ ├── index │ └── Index.vue │ └── setting │ └── Setting.vue ├── static └── .gitkeep └── test ├── .eslintrc └── unit ├── index.js ├── karma.conf.js └── specs └── LandingPage.spec.js /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "comments": false, 3 | "env": { 4 | "test": { 5 | "presets": [ 6 | ["env", { 7 | "targets": { "node": 7 } 8 | }], 9 | "stage-0" 10 | ], 11 | "plugins": ["istanbul"] 12 | }, 13 | "main": { 14 | "presets": [ 15 | ["env", { 16 | "targets": { "node": 7 } 17 | }], 18 | "stage-0" 19 | ] 20 | }, 21 | "renderer": { 22 | "presets": [ 23 | ["env", { 24 | "modules": false 25 | }], 26 | "stage-0" 27 | ] 28 | }, 29 | "web": { 30 | "presets": [ 31 | ["env", { 32 | "modules": false 33 | }], 34 | "stage-0" 35 | ] 36 | } 37 | }, 38 | "plugins": ["transform-runtime"] 39 | } 40 | -------------------------------------------------------------------------------- /.electron-vue/build.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.NODE_ENV = 'production' 4 | 5 | const { say } = require('cfonts') 6 | const chalk = require('chalk') 7 | const del = require('del') 8 | const { spawn } = require('child_process') 9 | const webpack = require('webpack') 10 | const Multispinner = require('multispinner') 11 | 12 | 13 | const mainConfig = require('./webpack.main.config') 14 | const rendererConfig = require('./webpack.renderer.config') 15 | const webConfig = require('./webpack.web.config') 16 | 17 | const doneLog = chalk.bgGreen.white(' DONE ') + ' ' 18 | const errorLog = chalk.bgRed.white(' ERROR ') + ' ' 19 | const okayLog = chalk.bgBlue.white(' OKAY ') + ' ' 20 | const isCI = process.env.CI || false 21 | 22 | if (process.env.BUILD_TARGET === 'clean') clean() 23 | else if (process.env.BUILD_TARGET === 'web') web() 24 | else build() 25 | 26 | function clean () { 27 | del.sync(['build/*', '!build/icons', '!build/icons/icon.*']) 28 | console.log(`\n${doneLog}\n`) 29 | process.exit() 30 | } 31 | 32 | function build () { 33 | greeting() 34 | 35 | del.sync(['dist/electron/*', '!.gitkeep']) 36 | 37 | const tasks = ['main', 'renderer'] 38 | const m = new Multispinner(tasks, { 39 | preText: 'building', 40 | postText: 'process' 41 | }) 42 | 43 | let results = '' 44 | 45 | m.on('success', () => { 46 | process.stdout.write('\x1B[2J\x1B[0f') 47 | console.log(`\n\n${results}`) 48 | console.log(`${okayLog}take it away ${chalk.yellow('`electron-builder`')}\n`) 49 | process.exit() 50 | }) 51 | 52 | pack(mainConfig).then(result => { 53 | results += result + '\n\n' 54 | m.success('main') 55 | }).catch(err => { 56 | m.error('main') 57 | console.log(`\n ${errorLog}failed to build main process`) 58 | console.error(`\n${err}\n`) 59 | process.exit(1) 60 | }) 61 | 62 | pack(rendererConfig).then(result => { 63 | results += result + '\n\n' 64 | m.success('renderer') 65 | }).catch(err => { 66 | m.error('renderer') 67 | console.log(`\n ${errorLog}failed to build renderer process`) 68 | console.error(`\n${err}\n`) 69 | process.exit(1) 70 | }) 71 | } 72 | 73 | function pack (config) { 74 | return new Promise((resolve, reject) => { 75 | config.mode = 'production' 76 | webpack(config, (err, stats) => { 77 | if (err) reject(err.stack || err) 78 | else if (stats.hasErrors()) { 79 | let err = '' 80 | 81 | stats.toString({ 82 | chunks: false, 83 | colors: true 84 | }) 85 | .split(/\r?\n/) 86 | .forEach(line => { 87 | err += ` ${line}\n` 88 | }) 89 | 90 | reject(err) 91 | } else { 92 | resolve(stats.toString({ 93 | chunks: false, 94 | colors: true 95 | })) 96 | } 97 | }) 98 | }) 99 | } 100 | 101 | function web () { 102 | del.sync(['dist/web/*', '!.gitkeep']) 103 | webConfig.mode = 'production' 104 | webpack(webConfig, (err, stats) => { 105 | if (err || stats.hasErrors()) console.log(err) 106 | 107 | console.log(stats.toString({ 108 | chunks: false, 109 | colors: true 110 | })) 111 | 112 | process.exit() 113 | }) 114 | } 115 | 116 | function greeting () { 117 | const cols = process.stdout.columns 118 | let text = '' 119 | 120 | if (cols > 85) text = 'lets-build' 121 | else if (cols > 60) text = 'lets-|build' 122 | else text = false 123 | 124 | if (text && !isCI) { 125 | say(text, { 126 | colors: ['yellow'], 127 | font: 'simple3d', 128 | space: false 129 | }) 130 | } else console.log(chalk.yellow.bold('\n lets-build')) 131 | console.log() 132 | } -------------------------------------------------------------------------------- /.electron-vue/dev-client.js: -------------------------------------------------------------------------------- 1 | const hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') 2 | 3 | hotClient.subscribe(event => { 4 | /** 5 | * Reload browser when HTMLWebpackPlugin emits a new index.html 6 | * 7 | * Currently disabled until jantimon/html-webpack-plugin#680 is resolved. 8 | * https://github.com/SimulatedGREG/electron-vue/issues/437 9 | * https://github.com/jantimon/html-webpack-plugin/issues/680 10 | */ 11 | // if (event.action === 'reload') { 12 | // window.location.reload() 13 | // } 14 | 15 | /** 16 | * Notify `mainWindow` when `main` process is compiling, 17 | * giving notice for an expected reload of the `electron` process 18 | */ 19 | if (event.action === 'compiling') { 20 | document.body.innerHTML += ` 21 | 34 | 35 |
36 | Compiling Main Process... 37 |
38 | ` 39 | } 40 | }) 41 | -------------------------------------------------------------------------------- /.electron-vue/dev-runner.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | const chalk = require('chalk') 4 | const electron = require('electron') 5 | const path = require('path') 6 | const { say } = require('cfonts') 7 | const { spawn } = require('child_process') 8 | const webpack = require('webpack') 9 | const WebpackDevServer = require('webpack-dev-server') 10 | const webpackHotMiddleware = require('webpack-hot-middleware') 11 | 12 | const mainConfig = require('./webpack.main.config') 13 | const rendererConfig = require('./webpack.renderer.config') 14 | 15 | let electronProcess = null 16 | let manualRestart = false 17 | let hotMiddleware 18 | 19 | function logStats (proc, data) { 20 | let log = '' 21 | 22 | log += chalk.yellow.bold(`┏ ${proc} Process ${new Array((19 - proc.length) + 1).join('-')}`) 23 | log += '\n\n' 24 | 25 | if (typeof data === 'object') { 26 | data.toString({ 27 | colors: true, 28 | chunks: false 29 | }).split(/\r?\n/).forEach(line => { 30 | log += ' ' + line + '\n' 31 | }) 32 | } else { 33 | log += ` ${data}\n` 34 | } 35 | 36 | log += '\n' + chalk.yellow.bold(`┗ ${new Array(28 + 1).join('-')}`) + '\n' 37 | 38 | console.log(log) 39 | } 40 | 41 | function startRenderer () { 42 | return new Promise((resolve, reject) => { 43 | rendererConfig.entry.renderer = [path.join(__dirname, 'dev-client')].concat(rendererConfig.entry.renderer) 44 | rendererConfig.mode = 'development' 45 | const compiler = webpack(rendererConfig) 46 | hotMiddleware = webpackHotMiddleware(compiler, { 47 | log: false, 48 | heartbeat: 2500 49 | }) 50 | 51 | compiler.hooks.compilation.tap('compilation', compilation => { 52 | compilation.hooks.htmlWebpackPluginAfterEmit.tapAsync('html-webpack-plugin-after-emit', (data, cb) => { 53 | hotMiddleware.publish({ action: 'reload' }) 54 | cb() 55 | }) 56 | }) 57 | 58 | compiler.hooks.done.tap('done', stats => { 59 | logStats('Renderer', stats) 60 | }) 61 | 62 | const server = new WebpackDevServer( 63 | compiler, 64 | { 65 | contentBase: path.join(__dirname, '../'), 66 | quiet: true, 67 | before (app, ctx) { 68 | app.use(hotMiddleware) 69 | ctx.middleware.waitUntilValid(() => { 70 | resolve() 71 | }) 72 | } 73 | } 74 | ) 75 | 76 | server.listen(9080) 77 | }) 78 | } 79 | 80 | function startMain () { 81 | return new Promise((resolve, reject) => { 82 | mainConfig.entry.main = [path.join(__dirname, '../src/main/index.dev.js')].concat(mainConfig.entry.main) 83 | mainConfig.mode = 'development' 84 | const compiler = webpack(mainConfig) 85 | 86 | compiler.hooks.watchRun.tapAsync('watch-run', (compilation, done) => { 87 | logStats('Main', chalk.white.bold('compiling...')) 88 | hotMiddleware.publish({ action: 'compiling' }) 89 | done() 90 | }) 91 | 92 | compiler.watch({}, (err, stats) => { 93 | if (err) { 94 | console.log(err) 95 | return 96 | } 97 | 98 | logStats('Main', stats) 99 | 100 | if (electronProcess && electronProcess.kill) { 101 | manualRestart = true 102 | process.kill(electronProcess.pid) 103 | electronProcess = null 104 | startElectron() 105 | 106 | setTimeout(() => { 107 | manualRestart = false 108 | }, 5000) 109 | } 110 | 111 | resolve() 112 | }) 113 | }) 114 | } 115 | 116 | function startElectron () { 117 | var args = [ 118 | '--inspect=5858', 119 | path.join(__dirname, '../dist/electron/main.js') 120 | ] 121 | 122 | // detect yarn or npm and process commandline args accordingly 123 | if (process.env.npm_execpath.endsWith('yarn.js')) { 124 | args = args.concat(process.argv.slice(3)) 125 | } else if (process.env.npm_execpath.endsWith('npm-cli.js')) { 126 | args = args.concat(process.argv.slice(2)) 127 | } 128 | 129 | electronProcess = spawn(electron, args) 130 | 131 | electronProcess.stdout.on('data', data => { 132 | electronLog(data, 'blue') 133 | }) 134 | electronProcess.stderr.on('data', data => { 135 | electronLog(data, 'red') 136 | }) 137 | 138 | electronProcess.on('close', () => { 139 | if (!manualRestart) process.exit() 140 | }) 141 | } 142 | 143 | function electronLog (data, color) { 144 | let log = '' 145 | data = data.toString().split(/\r?\n/) 146 | data.forEach(line => { 147 | log += ` ${line}\n` 148 | }) 149 | if (/[0-9A-z]+/.test(log)) { 150 | console.log( 151 | chalk[color].bold('┏ Electron -------------------') + 152 | '\n\n' + 153 | log + 154 | chalk[color].bold('┗ ----------------------------') + 155 | '\n' 156 | ) 157 | } 158 | } 159 | 160 | function greeting () { 161 | const cols = process.stdout.columns 162 | let text = '' 163 | 164 | if (cols > 104) text = 'electron-vue' 165 | else if (cols > 76) text = 'electron-|vue' 166 | else text = false 167 | 168 | if (text) { 169 | say(text, { 170 | colors: ['yellow'], 171 | font: 'simple3d', 172 | space: false 173 | }) 174 | } else console.log(chalk.yellow.bold('\n electron-vue')) 175 | console.log(chalk.blue(' getting ready...') + '\n') 176 | } 177 | 178 | function init () { 179 | greeting() 180 | 181 | Promise.all([startRenderer(), startMain()]) 182 | .then(() => { 183 | startElectron() 184 | }) 185 | .catch(err => { 186 | console.error(err) 187 | }) 188 | } 189 | 190 | init() 191 | -------------------------------------------------------------------------------- /.electron-vue/webpack.main.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'main' 4 | 5 | const path = require('path') 6 | const { dependencies } = require('../package.json') 7 | const webpack = require('webpack') 8 | 9 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 10 | 11 | let mainConfig = { 12 | entry: { 13 | main: path.join(__dirname, '../src/main/index.js') 14 | }, 15 | externals: [ 16 | ...Object.keys(dependencies || {}) 17 | ], 18 | module: { 19 | rules: [ 20 | { 21 | test: /\.(js)$/, 22 | enforce: 'pre', 23 | exclude: /node_modules/, 24 | use: { 25 | loader: 'eslint-loader', 26 | options: { 27 | formatter: require('eslint-friendly-formatter') 28 | } 29 | } 30 | }, 31 | { 32 | test: /\.js$/, 33 | use: 'babel-loader', 34 | exclude: /node_modules/ 35 | }, 36 | { 37 | test: /\.node$/, 38 | use: 'node-loader' 39 | } 40 | ] 41 | }, 42 | node: { 43 | __dirname: process.env.NODE_ENV !== 'production', 44 | __filename: process.env.NODE_ENV !== 'production' 45 | }, 46 | output: { 47 | filename: '[name].js', 48 | libraryTarget: 'commonjs2', 49 | path: path.join(__dirname, '../dist/electron') 50 | }, 51 | plugins: [ 52 | new webpack.NoEmitOnErrorsPlugin() 53 | ], 54 | resolve: { 55 | extensions: ['.js', '.json', '.node'] 56 | }, 57 | target: 'electron-main' 58 | } 59 | 60 | /** 61 | * Adjust mainConfig for development settings 62 | */ 63 | if (process.env.NODE_ENV !== 'production') { 64 | mainConfig.plugins.push( 65 | new webpack.DefinePlugin({ 66 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"` 67 | }) 68 | ) 69 | } 70 | 71 | /** 72 | * Adjust mainConfig for production settings 73 | */ 74 | if (process.env.NODE_ENV === 'production') { 75 | mainConfig.plugins.push( 76 | new BabiliWebpackPlugin(), 77 | new webpack.DefinePlugin({ 78 | 'process.env.NODE_ENV': '"production"' 79 | }) 80 | ) 81 | } 82 | 83 | module.exports = mainConfig 84 | -------------------------------------------------------------------------------- /.electron-vue/webpack.renderer.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'renderer' 4 | 5 | const path = require('path') 6 | const { dependencies } = require('../package.json') 7 | const webpack = require('webpack') 8 | 9 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 10 | const CopyWebpackPlugin = require('copy-webpack-plugin') 11 | const MiniCssExtractPlugin = require('mini-css-extract-plugin') 12 | const HtmlWebpackPlugin = require('html-webpack-plugin') 13 | const { VueLoaderPlugin } = require('vue-loader') 14 | 15 | /** 16 | * List of node_modules to include in webpack bundle 17 | * 18 | * Required for specific packages like Vue UI libraries 19 | * that provide pure *.vue files that need compiling 20 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/webpack-configurations.html#white-listing-externals 21 | */ 22 | let whiteListedModules = ['vue'] 23 | 24 | let rendererConfig = { 25 | devtool: '#cheap-module-eval-source-map', 26 | entry: { 27 | renderer: path.join(__dirname, '../src/renderer/main.js') 28 | }, 29 | externals: [ 30 | ...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)) 31 | ], 32 | module: { 33 | rules: [ 34 | { 35 | test: /\.(js|vue)$/, 36 | enforce: 'pre', 37 | exclude: /node_modules/, 38 | use: { 39 | loader: 'eslint-loader', 40 | options: { 41 | formatter: require('eslint-friendly-formatter') 42 | } 43 | } 44 | }, 45 | { 46 | test: /\.scss$/, 47 | use: ['vue-style-loader', 'css-loader', 'sass-loader'] 48 | }, 49 | { 50 | test: /\.sass$/, 51 | use: ['vue-style-loader', 'css-loader', 'sass-loader?indentedSyntax'] 52 | }, 53 | { 54 | test: /\.less$/, 55 | use: ['vue-style-loader', 'css-loader', 'less-loader'] 56 | }, 57 | { 58 | test: /\.css$/, 59 | use: ['vue-style-loader', 'css-loader'] 60 | }, 61 | { 62 | test: /\.html$/, 63 | use: 'vue-html-loader' 64 | }, 65 | { 66 | test: /\.js$/, 67 | use: 'babel-loader', 68 | exclude: /node_modules/ 69 | }, 70 | { 71 | test: /\.node$/, 72 | use: 'node-loader' 73 | }, 74 | { 75 | test: /\.vue$/, 76 | use: { 77 | loader: 'vue-loader', 78 | options: { 79 | extractCSS: process.env.NODE_ENV === 'production', 80 | loaders: { 81 | sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1', 82 | scss: 'vue-style-loader!css-loader!sass-loader', 83 | less: 'vue-style-loader!css-loader!less-loader' 84 | } 85 | } 86 | } 87 | }, 88 | { 89 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 90 | use: { 91 | loader: 'url-loader', 92 | query: { 93 | limit: 10000, 94 | name: 'imgs/[name]--[folder].[ext]' 95 | } 96 | } 97 | }, 98 | { 99 | test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, 100 | loader: 'url-loader', 101 | options: { 102 | limit: 10000, 103 | name: 'media/[name]--[folder].[ext]' 104 | } 105 | }, 106 | { 107 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 108 | use: { 109 | loader: 'url-loader', 110 | query: { 111 | limit: 10000, 112 | name: 'fonts/[name]--[folder].[ext]' 113 | } 114 | } 115 | } 116 | ] 117 | }, 118 | node: { 119 | __dirname: process.env.NODE_ENV !== 'production', 120 | __filename: process.env.NODE_ENV !== 'production' 121 | }, 122 | plugins: [ 123 | new VueLoaderPlugin(), 124 | new MiniCssExtractPlugin({filename: 'styles.css'}), 125 | new HtmlWebpackPlugin({ 126 | filename: 'index.html', 127 | template: path.resolve(__dirname, '../src/index.ejs'), 128 | templateParameters(compilation, assets, options) { 129 | return { 130 | compilation: compilation, 131 | webpack: compilation.getStats().toJson(), 132 | webpackConfig: compilation.options, 133 | htmlWebpackPlugin: { 134 | files: assets, 135 | options: options 136 | }, 137 | process, 138 | }; 139 | }, 140 | minify: { 141 | collapseWhitespace: true, 142 | removeAttributeQuotes: true, 143 | removeComments: true 144 | }, 145 | nodeModules: process.env.NODE_ENV !== 'production' 146 | ? path.resolve(__dirname, '../node_modules') 147 | : false 148 | }), 149 | new webpack.HotModuleReplacementPlugin(), 150 | new webpack.NoEmitOnErrorsPlugin() 151 | ], 152 | output: { 153 | filename: '[name].js', 154 | libraryTarget: 'commonjs2', 155 | path: path.join(__dirname, '../dist/electron') 156 | }, 157 | resolve: { 158 | alias: { 159 | '@': path.join(__dirname, '../src/renderer'), 160 | 'root': path.join(__dirname, '../'), 161 | 'vue$': 'vue/dist/vue.esm.js' 162 | }, 163 | extensions: ['.js', '.vue', '.json', '.css', '.node'] 164 | }, 165 | target: 'electron-renderer' 166 | } 167 | 168 | /** 169 | * Adjust rendererConfig for development settings 170 | */ 171 | if (process.env.NODE_ENV !== 'production') { 172 | rendererConfig.plugins.push( 173 | new webpack.DefinePlugin({ 174 | '__static': `"${path.join(__dirname, '../static').replace(/\\/g, '\\\\')}"` 175 | }) 176 | ) 177 | } 178 | 179 | /** 180 | * Adjust rendererConfig for production settings 181 | */ 182 | if (process.env.NODE_ENV === 'production') { 183 | rendererConfig.devtool = '' 184 | 185 | rendererConfig.plugins.push( 186 | new BabiliWebpackPlugin(), 187 | new CopyWebpackPlugin([ 188 | { 189 | from: path.join(__dirname, '../static'), 190 | to: path.join(__dirname, '../dist/electron/static'), 191 | ignore: ['.*'] 192 | } 193 | ]), 194 | new webpack.DefinePlugin({ 195 | 'process.env.NODE_ENV': '"production"' 196 | }), 197 | new webpack.LoaderOptionsPlugin({ 198 | minimize: true 199 | }) 200 | ) 201 | } 202 | 203 | module.exports = rendererConfig 204 | -------------------------------------------------------------------------------- /.electron-vue/webpack.web.config.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | process.env.BABEL_ENV = 'web' 4 | 5 | const path = require('path') 6 | const webpack = require('webpack') 7 | 8 | const BabiliWebpackPlugin = require('babili-webpack-plugin') 9 | const CopyWebpackPlugin = require('copy-webpack-plugin') 10 | const MiniCssExtractPlugin = require('mini-css-extract-plugin') 11 | const HtmlWebpackPlugin = require('html-webpack-plugin') 12 | const { VueLoaderPlugin } = require('vue-loader') 13 | 14 | let webConfig = { 15 | devtool: '#cheap-module-eval-source-map', 16 | entry: { 17 | web: path.join(__dirname, '../src/renderer/main.js') 18 | }, 19 | module: { 20 | rules: [ 21 | { 22 | test: /\.(js|vue)$/, 23 | enforce: 'pre', 24 | exclude: /node_modules/, 25 | use: { 26 | loader: 'eslint-loader', 27 | options: { 28 | formatter: require('eslint-friendly-formatter') 29 | } 30 | } 31 | }, 32 | { 33 | test: /\.scss$/, 34 | use: ['vue-style-loader', 'css-loader', 'sass-loader'] 35 | }, 36 | { 37 | test: /\.sass$/, 38 | use: ['vue-style-loader', 'css-loader', 'sass-loader?indentedSyntax'] 39 | }, 40 | { 41 | test: /\.less$/, 42 | use: ['vue-style-loader', 'css-loader', 'less-loader'] 43 | }, 44 | { 45 | test: /\.css$/, 46 | use: ['vue-style-loader', 'css-loader'] 47 | }, 48 | { 49 | test: /\.html$/, 50 | use: 'vue-html-loader' 51 | }, 52 | { 53 | test: /\.js$/, 54 | use: 'babel-loader', 55 | include: [ path.resolve(__dirname, '../src/renderer') ], 56 | exclude: /node_modules/ 57 | }, 58 | { 59 | test: /\.vue$/, 60 | use: { 61 | loader: 'vue-loader', 62 | options: { 63 | extractCSS: true, 64 | loaders: { 65 | sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax=1', 66 | scss: 'vue-style-loader!css-loader!sass-loader', 67 | less: 'vue-style-loader!css-loader!less-loader' 68 | } 69 | } 70 | } 71 | }, 72 | { 73 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 74 | use: { 75 | loader: 'url-loader', 76 | query: { 77 | limit: 10000, 78 | name: 'imgs/[name].[ext]' 79 | } 80 | } 81 | }, 82 | { 83 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 84 | use: { 85 | loader: 'url-loader', 86 | query: { 87 | limit: 10000, 88 | name: 'fonts/[name].[ext]' 89 | } 90 | } 91 | } 92 | ] 93 | }, 94 | plugins: [ 95 | new VueLoaderPlugin(), 96 | new MiniCssExtractPlugin({filename: 'styles.css'}), 97 | new HtmlWebpackPlugin({ 98 | filename: 'index.html', 99 | template: path.resolve(__dirname, '../src/index.ejs'), 100 | templateParameters(compilation, assets, options) { 101 | return { 102 | compilation: compilation, 103 | webpack: compilation.getStats().toJson(), 104 | webpackConfig: compilation.options, 105 | htmlWebpackPlugin: { 106 | files: assets, 107 | options: options 108 | }, 109 | process, 110 | }; 111 | }, 112 | minify: { 113 | collapseWhitespace: true, 114 | removeAttributeQuotes: true, 115 | removeComments: true 116 | }, 117 | nodeModules: false 118 | }), 119 | new webpack.DefinePlugin({ 120 | 'process.env.IS_WEB': 'true' 121 | }), 122 | new webpack.HotModuleReplacementPlugin(), 123 | new webpack.NoEmitOnErrorsPlugin() 124 | ], 125 | output: { 126 | filename: '[name].js', 127 | path: path.join(__dirname, '../dist/web') 128 | }, 129 | resolve: { 130 | alias: { 131 | '@': path.join(__dirname, '../src/renderer'), 132 | 'root': path.join(__dirname, '../'), 133 | 'vue$': 'vue/dist/vue.esm.js' 134 | }, 135 | extensions: ['.js', '.vue', '.json', '.css'] 136 | }, 137 | target: 'web' 138 | } 139 | 140 | /** 141 | * Adjust webConfig for production settings 142 | */ 143 | if (process.env.NODE_ENV === 'production') { 144 | webConfig.devtool = '' 145 | 146 | webConfig.plugins.push( 147 | new BabiliWebpackPlugin(), 148 | new CopyWebpackPlugin([ 149 | { 150 | from: path.join(__dirname, '../static'), 151 | to: path.join(__dirname, '../dist/web/static'), 152 | ignore: ['.*'] 153 | } 154 | ]), 155 | new webpack.DefinePlugin({ 156 | 'process.env.NODE_ENV': '"production"' 157 | }), 158 | new webpack.LoaderOptionsPlugin({ 159 | minimize: true 160 | }) 161 | ) 162 | } 163 | 164 | module.exports = webConfig 165 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | test/unit/coverage/** 2 | test/unit/*.js 3 | test/e2e/*.js 4 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: 'babel-eslint', 4 | parserOptions: { 5 | sourceType: 'module' 6 | }, 7 | env: { 8 | browser: true, 9 | node: true 10 | }, 11 | extends: 'airbnb-base', 12 | globals: { 13 | __static: true 14 | }, 15 | plugins: [ 16 | 'html' 17 | ], 18 | 'rules': { 19 | 'global-require': 0, 20 | 'import/no-unresolved': 0, 21 | 'no-param-reassign': 0, 22 | 'no-shadow': 0, 23 | 'import/extensions': 0, 24 | 'import/newline-after-import': 0, 25 | 'no-multi-assign': 0, 26 | // allow debugger during development 27 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 28 | // 'no-console' : process.env.NODE_ENV === 'production' ? 2 : 0, 29 | 'no-use-before-define': 0, 30 | 'no-new-func': 0, 31 | 'comma-dangle': 0, 32 | 'linebreak-style': 0, 33 | } 34 | }; 35 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | dist/electron/* 3 | dist/web/* 4 | build/* 5 | !build/icons 6 | coverage 7 | node_modules/ 8 | npm-debug.log 9 | npm-debug.log.* 10 | thumbs.db 11 | !.gitkeep 12 | .idea 13 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | sass_binary_site=https://npmmirror.com/mirrors/node-sass 2 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | # Commented sections below can be used to run tests on the CI server 2 | # https://simulatedgreg.gitbooks.io/electron-vue/content/en/testing.html#on-the-subject-of-ci-testing 3 | osx_image: xcode8.3 4 | sudo: required 5 | dist: trusty 6 | language: c 7 | matrix: 8 | include: 9 | - os: osx 10 | - os: linux 11 | env: CC=clang CXX=clang++ npm_config_clang=1 12 | compiler: clang 13 | cache: 14 | directories: 15 | - node_modules 16 | - "$HOME/.electron" 17 | - "$HOME/.cache" 18 | addons: 19 | apt: 20 | packages: 21 | - libgnome-keyring-dev 22 | - icnsutils 23 | #- xvfb 24 | before_install: 25 | - mkdir -p /tmp/git-lfs && curl -L https://github.com/github/git-lfs/releases/download/v1.2.1/git-lfs-$([ 26 | "$TRAVIS_OS_NAME" == "linux" ] && echo "linux" || echo "darwin")-amd64-1.2.1.tar.gz 27 | | tar -xz -C /tmp/git-lfs --strip-components 1 && /tmp/git-lfs/git-lfs pull 28 | - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo apt-get install --no-install-recommends -y icnsutils graphicsmagick xz-utils; fi 29 | install: 30 | #- export DISPLAY=':99.0' 31 | #- Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 & 32 | - nvm install 7 33 | - curl -o- -L https://yarnpkg.com/install.sh | bash 34 | - source ~/.bashrc 35 | - npm install -g xvfb-maybe 36 | - yarn 37 | script: 38 | #- xvfb-maybe node_modules/.bin/karma start test/unit/karma.conf.js 39 | - yarn run build 40 | branches: 41 | only: 42 | - master 43 | -------------------------------------------------------------------------------- /Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:alpine as build-deps 2 | 3 | WORKDIR /usr/src/app/ 4 | USER root 5 | COPY package.json ./ 6 | RUN npm install --production --registry=https://registry.npm.taobao.org 7 | 8 | COPY ./ ./ 9 | 10 | EXPOSE 3000 11 | 12 | ENTRYPOINT ["npm", "run", "server"] 13 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 Woz Huang 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # barrage-helper 2 | 3 | > 一个使用electron-vue制作的弹幕助手 4 | 5 | > **2023年3月更新** 6 | > 7 | > 由于年久失修，折腾了好久才把项目跑起来，必须使用 node v14，而且 node-sass 也相当坑爹 8 | > 9 | > 服务器也没有续费所以接口暂时也不能用了😂 10 | > 11 | > 依赖的[虎牙开放弹幕api](https://open.huya.com/index.php?m=Open&wiki=barrage)也不维护了 12 | > 13 | > electron-vue 也弃坑挺久了，可能后面会花点时间重新用 react 实现一遍吧 14 | > 15 | > 虎牙的周星星永远是我的最爱，我永远 ❤️ 周 ⭐⭐ 16 | 17 | 目前只有连接虎牙弹幕的功能，目前能够 18 | 19 | - 获取房间信息 20 | - 播报弹幕 21 | - 窗口置顶 22 | 23 | ### 预览 24 | ![](assets/preview1.png)![](assets/preview2.png)![](assets/preview3.png) 25 | 26 | ### 开始 27 | 28 | ``` bash 29 | 30 | # 启动 31 | npm run dev 32 | 33 | ``` 34 | 35 | --- 36 | 37 | 解决node 14.4下打包报错的问题，[参考](https://www.jianshu.com/p/bdf0a23e7257) 38 | 39 | Generated with [electron-vue](https://github.com/SimulatedGREG/electron-vue) 40 | -------------------------------------------------------------------------------- /appveyor.yml: -------------------------------------------------------------------------------- 1 | # Commented sections below can be used to run tests on the CI server 2 | # https://simulatedgreg.gitbooks.io/electron-vue/content/en/testing.html#on-the-subject-of-ci-testing 3 | version: 0.1.{build} 4 | 5 | branches: 6 | only: 7 | - master 8 | 9 | image: Visual Studio 2017 10 | platform: 11 | - x64 12 | 13 | cache: 14 | - node_modules 15 | - '%APPDATA%\npm-cache' 16 | - '%USERPROFILE%\.electron' 17 | - '%USERPROFILE%\AppData\Local\Yarn\cache' 18 | 19 | init: 20 | - git config --global core.autocrlf input 21 | 22 | install: 23 | - ps: Install-Product node 8 x64 24 | - git reset --hard HEAD 25 | - yarn 26 | - node --version 27 | 28 | build_script: 29 | #- yarn test 30 | - yarn build 31 | 32 | test: off 33 | -------------------------------------------------------------------------------- /assets/preview1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/assets/preview1.png -------------------------------------------------------------------------------- /assets/preview2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/assets/preview2.png -------------------------------------------------------------------------------- /assets/preview3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/assets/preview3.png -------------------------------------------------------------------------------- /build/icons/256x256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/build/icons/256x256.png -------------------------------------------------------------------------------- /build/icons/icon.icns: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/build/icons/icon.icns -------------------------------------------------------------------------------- /build/icons/icon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/build/icons/icon.ico -------------------------------------------------------------------------------- /config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | server: { 3 | // 这是本地启动的签名服务的端口 4 | port: 3000, 5 | // 这是electron调用的签名服务的地址 6 | host: 'http://106.53.82.122:3000', 7 | }, 8 | huya: { 9 | // 在此填写虎牙得到的id，用于签名鉴权 10 | openId: process.env.openid, 11 | secretId: process.env.secretid, 12 | }, 13 | }; 14 | -------------------------------------------------------------------------------- /devTools/vue-devtools/build/backend.js: -------------------------------------------------------------------------------- 1 | !function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=192)}({0:function(module,__webpack_exports__,__webpack_require__){"use strict";__webpack_exports__.l=inDoc,__webpack_exports__.t=specialTokenToString,__webpack_exports__.u=stringify,__webpack_exports__.k=getComponentName,__webpack_exports__.o=parse,__webpack_exports__.m=isPlainObject,__webpack_exports__.q=searchDeepInObject,__webpack_exports__.s=sortByKey,__webpack_exports__.r=set,__webpack_exports__.j=get,__webpack_exports__.p=scrollIntoView,__webpack_exports__.i=focusInput,__webpack_exports__.n=openInEditor,__webpack_exports__.h=escape;var __WEBPACK_IMPORTED_MODULE_0_path__=__webpack_require__(18),__WEBPACK_IMPORTED_MODULE_0_path___default=__webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_path__),__WEBPACK_IMPORTED_MODULE_1__transfer__=__webpack_require__(19),__WEBPACK_IMPORTED_MODULE_2_src_backend__=__webpack_require__(5),__WEBPACK_IMPORTED_MODULE_3_src_backend_vuex__=__webpack_require__(12),__WEBPACK_IMPORTED_MODULE_4_src_backend_router__=__webpack_require__(22),__WEBPACK_IMPORTED_MODULE_5__devtools_env__=__webpack_require__(14);function cached(e){const t=Object.create(null);return function(n){return t[n]||(t[n]=e(n))}}var classifyRE=/(?:^|[-_/])(\w)/g;const classify=cached(e=>e&&e.replace(classifyRE,toUpper));__webpack_exports__.g=classify;const camelizeRE=/-(\w)/g,camelize=cached(e=>e.replace(camelizeRE,toUpper));function toUpper(e,t){return t?t.toUpperCase():""}function inDoc(e){if(!e)return!1;var t=e.ownerDocument.documentElement,n=e.parentNode;return t===e||t===n||!(!n||1!==n.nodeType||!t.contains(n))}__webpack_exports__.f=camelize;const UNDEFINED="__vue_devtool_undefined__";__webpack_exports__.e=UNDEFINED;const INFINITY="__vue_devtool_infinity__";__webpack_exports__.a=INFINITY;const NEGATIVE_INFINITY="__vue_devtool_negative_infinity__";__webpack_exports__.c=NEGATIVE_INFINITY;const NAN="__vue_devtool_nan__";__webpack_exports__.b=NAN;const SPECIAL_TOKENS={true:!0,false:!1,undefined:UNDEFINED,null:null,"-Infinity":NEGATIVE_INFINITY,Infinity:INFINITY,NaN:NAN};function specialTokenToString(e){return null===e?"null":e===UNDEFINED?"undefined":e===NAN?"NaN":e===INFINITY?"Infinity":e===NEGATIVE_INFINITY&&"-Infinity"}__webpack_exports__.d=SPECIAL_TOKENS;class EncodeCache{constructor(){this.map=new Map}cache(e,t){const n=this.map.get(e);if(n)return n;{const n=t(e);return this.map.set(e,n),n}}clear(){this.map.clear()}}const encodeCache=new EncodeCache;function stringify(e){return encodeCache.clear(),__WEBPACK_IMPORTED_MODULE_1__transfer__.b(e,replacer)}function replacer(e){const t=this[e],n=typeof t;if("undefined"===n)return UNDEFINED;if(t===1/0)return INFINITY;if(t===-1/0)return NEGATIVE_INFINITY;if("function"===n)return getCustomFunctionDetails(t);if("symbol"===n)return`[native Symbol ${Symbol.prototype.toString.call(t)}]`;if(null!==t&&"object"===n){if(t instanceof Map)return encodeCache.cache(t,()=>getCustomMapDetails(t));if(t instanceof Set)return encodeCache.cache(t,()=>getCustomSetDetails(t));if(t instanceof RegExp)return`[native RegExp ${RegExp.prototype.toString.call(t)}]`;if(t instanceof Date)return`[native Date ${Date.prototype.toString.call(t)}]`;if(t.state&&t._vm)return encodeCache.cache(t,()=>Object(__WEBPACK_IMPORTED_MODULE_3_src_backend_vuex__.a)(t));if(t.constructor&&"VueRouter"===t.constructor.name)return encodeCache.cache(t,()=>Object(__WEBPACK_IMPORTED_MODULE_4_src_backend_router__.a)(t));if(t._isVue)return encodeCache.cache(t,()=>Object(__WEBPACK_IMPORTED_MODULE_2_src_backend__.a)(t));if("function"==typeof t.render)return encodeCache.cache(t,()=>getCustomComponentDefinitionDetails(t))}else if(Number.isNaN(t))return NAN;return sanitize(t)}function getCustomMapDetails(e){const t=[];return e.forEach((e,n)=>t.push({key:n,value:e})),{_custom:{type:"map",display:"Map",value:t,readOnly:!0,fields:{abstract:!0}}}}function reviveMap(e){const t=new Map,n=e._custom.value;for(let e=0;e(${e.__file})`):t="Unknown Component",{_custom:Object.assign({},{type:"component-definition",display:t,tooltip:"Component definition"},e.__file?{file:e.__file}:{})}}function getCustomFunctionDetails(e){let t="";try{t=Function.prototype.toString.call(e)}catch(e){}const n=t.match(/\([\s\S]*?\)/),r=n?`(${n[0].substr(1,n[0].length-2).split(",").map(e=>e.trim()).join(", ")})`:"(?)";return{_custom:{type:"function",display:`ƒ ${escape(e.name)}${r}`}}}function parse(e,t){return t?__WEBPACK_IMPORTED_MODULE_1__transfer__.a(e,reviver):__WEBPACK_IMPORTED_MODULE_1__transfer__.a(e)}const specialTypeRE=/^\[native (\w+) (.*)\]$/,symbolRE=/^\[native Symbol Symbol\((.*)\)\]$/;function reviver(e,t){if(t!==UNDEFINED){if(t===INFINITY)return 1/0;if(t===NEGATIVE_INFINITY)return-1/0;if(t===NAN)return NaN;if(!t||!t._custom){if(symbolRE.test(t)){const[,e]=symbolRE.exec(t);return Symbol.for(e)}if(specialTypeRE.test(t)){const[,e,n]=specialTypeRE.exec(t);return new window[e](n)}return t}return"component"===t._custom.type?__WEBPACK_IMPORTED_MODULE_2_src_backend__.d.get(t._custom.id):"map"===t._custom.type?reviveMap(t):"set"===t._custom.type?reviveSet(t):void 0}}function sanitize(e){return isPrimitive(e)||Array.isArray(e)||isPlainObject(e)?e:Object.prototype.toString.call(e)}function isPlainObject(e){return"[object Object]"===Object.prototype.toString.call(e)}function isPrimitive(e){if(null==e)return!0;const t=typeof e;return"string"===t||"number"===t||"boolean"===t}function searchDeepInObject(e,t){const n=new Map,r=internalSearchObject(e,t.toLowerCase(),n,0);return n.clear(),r}const SEARCH_MAX_DEPTH=10;function internalSearchObject(e,t,n,r){if(r>SEARCH_MAX_DEPTH)return!1;let o=!1;const i=Object.keys(e);let s,c;for(let a=0;aSEARCH_MAX_DEPTH)return!1;let o,i=!1;for(let s=0;se.keyt.key?1:0)}function set(e,t,n,r=null){const o=t.split(".");for(;o.length>1;)e=e[o.shift()];const i=o[0];r?r(e,i,n):e[i]=n}function get(e,t){const n=t.split(".");for(const t of n)if(!(e=e[t]))return;return e}function scrollIntoView(e,t,n=!0){const r=t.offsetTop,o=t.offsetHeight,i=e.scrollTop,s=e.offsetHeight;n?e.scrollTop=r+(o-s)/2:ri+s&&(e.scrollTop=r-s+o)}function focusInput(e){e.focus(),e.setSelectionRange(0,e.value.length)}function openInEditor(file){const fileName=file.replace(/\\/g,"\\\\"),src=`fetch('/__open-in-editor?file=${encodeURI(file)}').then(response => {\n if (response.ok) {\n console.log('File ${fileName} opened in editor')\n } else {\n const msg = 'Opening component ${fileName} failed'\n if (__VUE_DEVTOOLS_TOAST__) {\n __VUE_DEVTOOLS_TOAST__(msg, 'error')\n } else {\n console.log('%c' + msg, 'color:red')\n }\n console.log('Check the setup of your project, see https://github.com/vuejs/vue-devtools/blob/master/docs/open-in-editor.md')\n }\n })`;__WEBPACK_IMPORTED_MODULE_5__devtools_env__.b?chrome.devtools.inspectedWindow.eval(src):eval(src)}const ESC={"<":"<",">":">",'"':""","&":"&"};function escape(e){return e.replace(/[<>"&]/g,escapeChar)}function escapeChar(e){return ESC[e]||e}},10:function(e,t,n){"use strict";t.b=function(e){if(!e)return;const t=a(e);if(t){let n="",a=Object(o.b)(e);i.a&&(a=Object(r.g)(a)),a&&(n=`<${a}>`),function({width:e=0,height:t=0,top:n=0,left:r=0},o=""){s.style.width=~~e+"px",s.style.height=~~t+"px",s.style.top=~~n+"px",s.style.left=~~r+"px",c.innerHTML=o,document.body.appendChild(s)}(t,n)}},t.c=function(){s.parentNode&&document.body.removeChild(s)},t.a=a;var r=n(0),o=n(5),i=n(11);const s=document.createElement("div");s.style.backgroundColor="rgba(104, 182, 255, 0.35)",s.style.position="fixed",s.style.zIndex="99999999999999",s.style.pointerEvents="none",s.style.display="flex",s.style.alignItems="center",s.style.justifyContent="center",s.style.borderRadius="3px";const c=document.createElement("div");function a(e){if(Object(r.l)(e.$el))return e._isFragment?function({_fragmentStart:e,_fragmentEnd:t}){let n,r,o,i;return window.__VUE_DEVTOOLS_GLOBAL_HOOK__.Vue.util.mapNodeRange(e,t,function(e){let t;1===e.nodeType||e.getBoundingClientRect?t=e.getBoundingClientRect():3===e.nodeType&&e.data.trim()&&(t=function(e){return u.selectNode(e),u.getBoundingClientRect()}(e)),t&&((!n||t.topr)&&(r=t.bottom),(!o||t.lefti)&&(i=t.right))}),{top:n,left:o,width:i-o,height:r-n}}(e):1===e.$el.nodeType?e.$el.getBoundingClientRect():void 0}c.style.backgroundColor="rgba(104, 182, 255, 0.9)",c.style.fontFamily="monospace",c.style.fontSize="11px",c.style.padding="2px 3px",c.style.borderRadius="3px",c.style.color="white",s.appendChild(c);const u=document.createRange()},11:function(e,t,n){"use strict";n.d(t,"a",function(){return r});let r=!1;t.b=function(e){e.on("config:classifyComponents",e=>{r=e})}},12:function(e,t,n){"use strict";t.b=function(e,t){const n=e.store;let o=!0;const i=()=>Object(r.u)({state:n.state,getters:n.getters||{}});t.send("vuex:init",i()),e.off("vuex:mutation"),e.on("vuex:mutation",e=>{o&&t.send("vuex:mutation",{mutation:{type:e.type,payload:Object(r.u)(e.payload)},timestamp:Date.now(),snapshot:i()})}),t.on("vuex:travel-to-state",t=>{e.emit("vuex:travel-to-state",Object(r.o)(t,!0))}),t.on("vuex:import-state",n=>{e.emit("vuex:travel-to-state",Object(r.o)(n,!0)),t.send("vuex:init",i())}),t.on("vuex:toggle-recording",e=>{o=e})},t.a=function(e){return{_custom:{type:"store",display:"Store",value:{state:e.state,getters:e.getters},fields:{abstract:!0}}}};var r=n(0)},13:function(e,t,n){"use strict";t.a=function(e){for(;!e.__vue__&&e.parentElement;)e=e.parentElement;return e.__vue__}},14:function(e,t,n){"use strict";t.a=function(e){if(e.prototype.hasOwnProperty("$isChrome"))return;Object.defineProperties(e.prototype,{$isChrome:{get:()=>r},$isWindows:{get:()=>o},$isMac:{get:()=>i},$isLinux:{get:()=>s},$keys:{get:()=>c}}),o&&document.body.classList.add("platform-windows");i&&document.body.classList.add("platform-mac");s&&document.body.classList.add("platform-linux")};const r="undefined"!=typeof chrome&&!!chrome.devtools;t.b=r;const o=0===navigator.platform.indexOf("Win"),i="MacIntel"===navigator.platform,s=0===navigator.platform.indexOf("Linux"),c={ctrl:i?"⌘":"Ctrl",shift:"Shift",alt:i?"⌥":"Alt",del:"Del",enter:"Enter",esc:"Esc"};t.c=c},15:function(e,t){var n,r,o=e.exports={};function i(){throw new Error("setTimeout has not been defined")}function s(){throw new Error("clearTimeout has not been defined")}function c(e){if(n===setTimeout)return setTimeout(e,0);if((n===i||!n)&&setTimeout)return n=setTimeout,setTimeout(e,0);try{return n(e,0)}catch(t){try{return n.call(null,e,0)}catch(t){return n.call(this,e,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:i}catch(e){n=i}try{r="function"==typeof clearTimeout?clearTimeout:s}catch(e){r=s}}();var a,u=[],_=!1,l=-1;function p(){_&&a&&(_=!1,a.length?u=a.concat(u):l=-1,u.length&&f())}function f(){if(!_){var e=c(p);_=!0;for(var t=u.length;t;){for(a=u,u=[];++l1)for(var n=1;n=0;r--){var o=e[r];"."===o?e.splice(r,1):".."===o?(e.splice(r,1),n++):n&&(e.splice(r,1),n--)}if(t)for(;n--;n)e.unshift("..");return e}var r=/^(\/?|)([\s\S]*?)((?:\.{1,2}|[^\/]+?|)(\.[^.\/]*|))(?:[\/]*)$/,o=function(e){return r.exec(e).slice(1)};function i(e,t){if(e.filter)return e.filter(t);for(var n=[],r=0;r=-1&&!r;o--){var s=o>=0?arguments[o]:e.cwd();if("string"!=typeof s)throw new TypeError("Arguments to path.resolve must be strings");s&&(t=s+"/"+t,r="/"===s.charAt(0))}return t=n(i(t.split("/"),function(e){return!!e}),!r).join("/"),(r?"/":"")+t||"."},t.normalize=function(e){var r=t.isAbsolute(e),o="/"===s(e,-1);return(e=n(i(e.split("/"),function(e){return!!e}),!r).join("/"))||r||(e="."),e&&o&&(e+="/"),(r?"/":"")+e},t.isAbsolute=function(e){return"/"===e.charAt(0)},t.join=function(){var e=Array.prototype.slice.call(arguments,0);return t.normalize(i(e,function(e,t){if("string"!=typeof e)throw new TypeError("Arguments to path.join must be strings");return e}).join("/"))},t.relative=function(e,n){function r(e){for(var t=0;t=0&&""===e[n];n--);return t>n?[]:e.slice(t,n-t+1)}e=t.resolve(e).substr(1),n=t.resolve(n).substr(1);for(var o=r(e.split("/")),i=r(n.split("/")),s=Math.min(o.length,i.length),c=s,a=0;a{"vue-devtools-proxy"===t.data.source&&t.data.payload&&e(t.data.payload)};window.addEventListener("message",n),t.push(n)},send(e){window.postMessage({source:"vue-devtools-backend",payload:e},"*")}});n.on("shutdown",()=>{t.forEach(e=>{window.removeEventListener("message",e)}),t=[]}),Object(r.c)(n)}})},20:function(e,t,n){"use strict";t.a=function(e,t){let n=!0;function s(s){const c=e.prototype[s];c&&(e.prototype[s]=function(...e){const a=c.apply(this,e);var u,_,l,p;return n&&(u=this,_=s,l=e[0],p=e.slice(1),"string"!=typeof l||i.test(l)||t.send("event:triggered",Object(r.u)({eventName:l,type:_,payload:p,instanceId:u._uid,instanceName:Object(o.b)(u._self||u),timestamp:Date.now()}))),a})}t.on("events:toggle-recording",e=>{n=e}),s("$emit"),s("$broadcast"),s("$dispatch")};var r=n(0),o=n(5);const i=/^(?:pre-)?hook:/},21:function(e,t,n){"use strict";var r=n(10),o=n(13);t.a=class{constructor(e,t){this.bridge=e,this.instanceMap=t,this.bindMethods(),e.on("start-component-selector",this.startSelecting),e.on("stop-component-selector",this.stopSelecting)}startSelecting(){document.body.addEventListener("mouseover",this.elementMouseOver,!0),document.body.addEventListener("click",this.elementClicked,!0),document.body.addEventListener("mouseout",this.cancelEvent,!0),document.body.addEventListener("mouseenter",this.cancelEvent,!0),document.body.addEventListener("mouseleave",this.cancelEvent,!0),document.body.addEventListener("mousedown",this.cancelEvent,!0),document.body.addEventListener("mouseup",this.cancelEvent,!0)}stopSelecting(){document.body.removeEventListener("mouseover",this.elementMouseOver,!0),document.body.removeEventListener("click",this.elementClicked,!0),document.body.removeEventListener("mouseout",this.cancelEvent,!0),document.body.removeEventListener("mouseenter",this.cancelEvent,!0),document.body.removeEventListener("mouseleave",this.cancelEvent,!0),document.body.removeEventListener("mousedown",this.cancelEvent,!0),document.body.removeEventListener("mouseup",this.cancelEvent,!0),Object(r.c)()}elementMouseOver(e){this.cancelEvent(e);const t=e.target;t&&(this.selectedInstance=Object(o.a)(t)),Object(r.c)(),this.selectedInstance&&Object(r.b)(this.selectedInstance)}elementClicked(e){this.cancelEvent(e),this.selectedInstance&&this.bridge.send("inspect-instance",this.selectedInstance.__VUE_DEVTOOLS_UID__),this.stopSelecting()}cancelEvent(e){e.stopImmediatePropagation(),e.preventDefault()}bindMethods(){this.startSelecting=this.startSelecting.bind(this),this.stopSelecting=this.stopSelecting.bind(this),this.elementMouseOver=this.elementMouseOver.bind(this),this.elementClicked=this.elementClicked.bind(this)}}},22:function(e,t,n){"use strict";t.a=function(e){return{_custom:{type:"router",display:"VueRouter",value:{options:e.options,currentRoute:e.currentRoute},fields:{abstract:!0}}}}},25:function(e,t,n){"use strict";var r=n(26);n.n(r);t.a=class extends r.EventEmitter{constructor(e){super();const t=this;t.setMaxListeners(1/0),t.wall=e,e.listen(e=>{"string"==typeof e?t.emit(e):t.emit(e.event,e.payload)})}send(e,t){this.wall.send({event:e,payload:t})}log(e){this.send("log",e)}}},26:function(e,t){function n(){this._events=this._events||{},this._maxListeners=this._maxListeners||void 0}function r(e){return"function"==typeof e}function o(e){return"object"==typeof e&&null!==e}function i(e){return void 0===e}e.exports=n,n.EventEmitter=n,n.prototype._events=void 0,n.prototype._maxListeners=void 0,n.defaultMaxListeners=10,n.prototype.setMaxListeners=function(e){if("number"!=typeof e||e<0||isNaN(e))throw TypeError("n must be a positive number");return this._maxListeners=e,this},n.prototype.emit=function(e){var t,n,s,c,a,u;if(this._events||(this._events={}),"error"===e&&(!this._events.error||o(this._events.error)&&!this._events.error.length)){if((t=arguments[1])instanceof Error)throw t;var _=new Error('Uncaught, unspecified "error" event. ('+t+")");throw _.context=t,_}if(i(n=this._events[e]))return!1;if(r(n))switch(arguments.length){case 1:n.call(this);break;case 2:n.call(this,arguments[1]);break;case 3:n.call(this,arguments[1],arguments[2]);break;default:c=Array.prototype.slice.call(arguments,1),n.apply(this,c)}else if(o(n))for(c=Array.prototype.slice.call(arguments,1),s=(u=n.slice()).length,a=0;a0&&this._events[e].length>s&&(this._events[e].warned=!0,console.error("(node) warning: possible EventEmitter memory leak detected. %d listeners added. Use emitter.setMaxListeners() to increase limit.",this._events[e].length),"function"==typeof console.trace&&console.trace()),this},n.prototype.on=n.prototype.addListener,n.prototype.once=function(e,t){if(!r(t))throw TypeError("listener must be a function");var n=!1;function o(){this.removeListener(e,o),n||(n=!0,t.apply(this,arguments))}return o.listener=t,this.on(e,o),this},n.prototype.removeListener=function(e,t){var n,i,s,c;if(!r(t))throw TypeError("listener must be a function");if(!this._events||!this._events[e])return this;if(s=(n=this._events[e]).length,i=-1,n===t||r(n.listener)&&n.listener===t)delete this._events[e],this._events.removeListener&&this.emit("removeListener",e,t);else if(o(n)){for(c=s;c-- >0;)if(n[c]===t||n[c].listener&&n[c].listener===t){i=c;break}if(i<0)return this;1===n.length?(n.length=0,delete this._events[e]):n.splice(i,1),this._events.removeListener&&this.emit("removeListener",e,t)}return this},n.prototype.removeAllListeners=function(e){var t,n;if(!this._events)return this;if(!this._events.removeListener)return 0===arguments.length?this._events={}:this._events[e]&&delete this._events[e],this;if(0===arguments.length){for(t in this._events)"removeListener"!==t&&this.removeAllListeners(t);return this.removeAllListeners("removeListener"),this._events={},this}if(r(n=this._events[e]))this.removeListener(e,n);else if(n)for(;n.length;)this.removeListener(e,n[n.length-1]);return delete this._events[e],this},n.prototype.listeners=function(e){return this._events&&this._events[e]?r(this._events[e])?[this._events[e]]:this._events[e].slice():[]},n.prototype.listenerCount=function(e){if(this._events){var t=this._events[e];if(r(t))return 1;if(t)return t.length}return 0},n.listenerCount=function(e,t){return e.listenerCount(t)}},5:function(e,t,n){"use strict";t.c=function(e){v=e,_.Vue?(y=_.Vue.version&&"1"===_.Vue.version.split(".")[0],b()):_.once("init",b);Object(u.b)(v),document.addEventListener("contextmenu",e=>{const t=e.target;if(t){const e=Object(s.a)(t);if(e)return window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__=!0,void(window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__=e)}window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__=null,window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__=null})},t.a=function(e){const t=L(e);return{_custom:{type:"component",id:e.__VUE_DEVTOOLS_UID__,display:I(e),tooltip:"Component instance",value:function(e){if(!e.length)return;return e.reduce((e,t)=>{const n=t.type||"data",r=e[n]=e[n]||{};return r[t.key]=t.value,e},{})}(t),fields:{abstract:!0}}}},t.b=I;var r=n(10),o=n(12),i=n(20),s=n(13),c=n(0),a=n(21),u=n(11);const _=window.__VUE_DEVTOOLS_GLOBAL_HOOK__,l=[],p=["default","sync","once"],f=window.__VUE_DEVTOOLS_INSTANCE_MAP__=new Map;t.d=f;const d=Array(5);let h,v,m="",y=!1,E=0;function b(){_.currentTab="components",v.on("switch-tab",e=>{_.currentTab=e,"components"===e&&O()}),_.off("flush"),_.on("flush",()=>{"components"===_.currentTab&&O()}),v.on("select-instance",e=>{h=e,function(e){const t=e.__VUE_DEVTOOLS_UID__,n=d.indexOf(t);n>-1?d.splice(n,1):d.pop();d.unshift(t);for(var r=0;r<5;r++)window["$vm"+r]=f.get(d[r]);window.$vm=e}(f.get(e)),O(),v.send("instance-selected")}),v.on("scroll-to-instance",e=>{const t=f.get(e);t&&function(e){const t=Object(r.a)(e);t&&window.scrollBy(0,t.top+(t.height-window.innerHeight)/2)}(t)}),v.on("filter-instances",e=>{m=e.toLowerCase(),O()}),v.on("refresh",g),v.on("enter-instance",e=>Object(r.b)(f.get(e))),v.on("leave-instance",r.c),new a.a(v,f),v.on("get-context-menu-target",()=>{const e=window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__;if(window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__=null,window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__=!1,e){const t=e.__VUE_DEVTOOLS_UID__;if(t)return v.send("inspect-instance",t)}!function(e,t="normal"){const n=window.__VUE_DEVTOOLS_TOAST__;n&&n(e,t)}("No Vue component was found","warn")}),v.on("set-instance-data",e=>{!function({id:e,path:t,value:n,newKey:r,remove:o}){const i=f.get(e);if(i)try{let e;n&&(e=Object(c.o)(n,!0));const s=y?{$set:_.Vue.set,$delete:_.Vue.delete}:i;Object(c.r)(i._data,t,e,(e,t,n)=>{(o||r)&&s.$delete(e,t),!o&&s.$set(e,r||t,n)})}catch(e){console.error(e)}}(e),O()}),_.store?Object(o.b)(_,v):_.once("vuex:init",e=>{Object(o.b)(_,v)}),Object(i.a)(_.Vue,v),window.__VUE_DEVTOOLS_INSPECT__=S,v.log("backend ready."),v.send("ready",_.Vue.version),console.log(`%c vue-devtools %c Detected Vue v${_.Vue.version} %c`,"background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px; color: #fff","background:#41b883 ; padding: 1px; border-radius: 0 3px 3px 0; color: #fff","background:transparent"),g()}function g(){l.length=0;let e=!1,t=null;!function e(t,n){if(t.childNodes)for(let r=0,o=t.childNodes.length;r!e._isBeingDestroyed),m?Array.prototype.concat.apply([],e.map(T)):e.map(D)}function T(e){return function(e){return Object(c.g)(I(e)).toLowerCase().indexOf(m)>-1}(e)?D(e):w(e.$children)}function D(e,t,n){e.__VUE_DEVTOOLS_UID__=function(e){return`${e.$root.__VUE_DEVTOOLS_ROOT_UID__}:${e._uid}`}(e),function(e){f.has(e.__VUE_DEVTOOLS_UID__)||(f.set(e.__VUE_DEVTOOLS_UID__,e),e.$on("hook:beforeDestroy",function(){f.delete(e.__VUE_DEVTOOLS_UID__)}))}(e);const o={id:e.__VUE_DEVTOOLS_UID__,name:I(e),inactive:!!e._inactive,isFragment:!!e._isFragment,children:e.$children.filter(e=>!e._isBeingDestroyed).map(D)};if(n&&!(n.length>1)||e._inactive)o.top=1/0;else{const t=Object(r.a)(e);o.top=t?t.top:1/0}const i=d.indexOf(e.__VUE_DEVTOOLS_UID__);o.consoleId=i>-1?"$vm"+i:null;const s=e.$vnode&&e.$vnode.data.routerView;if((e._routerView||s)&&(o.isRouterView=!0,!e._inactive&&e.$route)){const t=e.$route.matched,n=s?e.$vnode.data.routerViewDepth:e._routerView.depth;o.matchedRouteSegment=t&&t[n]&&(s?t[n].path:t[n].handler.path)}return o}function L(e){return function(e){let t;if(y&&(t=e._props))return Object.keys(t).map(n=>{const r=t[n],o=r.options;return{type:"props",key:r.path,value:e[r.path],meta:o?{type:o.type?x(o.type):"any",required:!!o.required,mode:p[r.mode]}:{}}});if(t=e.$options.props){const n=[];for(let r in t){const o=t[r];r=Object(c.f)(r),n.push({type:"props",key:r,value:e[r],meta:o?{type:o.type?x(o.type):"any",required:!!o.required}:{type:"invalid"}})}return n}return[]}(e).concat(function(e){const t=y?e._props:e.$options.props,n=e.$options.vuex&&e.$options.vuex.getters;return Object.keys(e._data).filter(e=>!(t&&e in t||n&&e in n)).map(t=>({key:t,value:e._data[t],editable:!0}))}(e),function(e){const t=[],n=e.$options.computed||{};for(const r in n){const o=n[r],i="function"==typeof o&&o.vuex?"vuex bindings":"computed";let s=null;try{s={type:i,key:r,value:e[r]}}catch(e){s={type:i,key:r,value:"(error during evaluation)"}}t.push(s)}return t}(e),function(e){try{const t=e.$route;if(t){const{path:e,query:n,params:r}=t,o={path:e,query:n,params:r};return t.fullPath&&(o.fullPath=t.fullPath),t.hash&&(o.hash=t.hash),t.name&&(o.name=t.name),t.meta&&(o.meta=t.meta),[{key:"$route",value:{_custom:{type:"router",abstract:!0,value:o}}}]}}catch(e){}return[]}(e),function(e){const t=e.$options.vuex&&e.$options.vuex.getters;return t?Object.keys(t).map(t=>({type:"vuex getters",key:t,value:e[t]})):[]}(e),function(e){var t=e.$firebaseRefs;return t?Object.keys(t).map(t=>({type:"firebase bindings",key:t,value:e[t]})):[]}(e),function(e){var t=e.$observables;return t?Object.keys(t).map(t=>({type:"observables",key:t,value:e[t]})):[]}(e))}function I(e){const t=Object(c.k)(e.$options);return t||(e.$root===e?"Root":"Anonymous Component")}const N=/^(?:function|class) (\w+)/;function x(e){const t=e.toString().match(N);return"function"==typeof e&&t&&t[1]||"any"}function S(e){const t=e.__VUE_DEVTOOLS_UID__;t&&v.send("inspect-instance",t)}}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/build/background.js: -------------------------------------------------------------------------------- 1 | !function(e){var n={};function o(t){if(n[t])return n[t].exports;var s=n[t]={i:t,l:!1,exports:{}};return e[t].call(s.exports,s,s.exports,o),s.l=!0,s.exports}o.m=e,o.c=n,o.d=function(e,n,t){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:t})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="",o(o.s=190)}({190:function(e,n){const o={};var t,s;let c;function r(){o[c]?chrome.contextMenus.create({id:"vue-inspect-instance",title:"Inspect Vue component",contexts:["all"]}):chrome.contextMenus.remove("vue-inspect-instance")}chrome.runtime.onConnect.addListener(e=>{let n,c;+(s=e.name)+""===s?(n=e.name,c="devtools",t=+e.name,chrome.tabs.executeScript(t,{file:"/build/proxy.js"},function(e){e?console.log("injected proxy to tab "+t):o[t].devtools.postMessage("proxy-fail")})):(n=e.sender.tab.id,c="backend"),o[n]||(o[n]={devtools:null,backend:null}),o[n][c]=e,o[n].devtools&&o[n].backend&&function(e,n,t){function s(n){if("log"===n.event)return console.log("tab "+e,n.payload);console.log("devtools -> backend",n),t.postMessage(n)}function c(o){if("log"===o.event)return console.log("tab "+e,o.payload);console.log("backend -> devtools",o),n.postMessage(o)}function a(){console.log("tab "+e+" disconnected."),n.onMessage.removeListener(s),t.onMessage.removeListener(c),n.disconnect(),t.disconnect(),o[e]=null,r()}n.onMessage.addListener(s),t.onMessage.addListener(c),n.onDisconnect.addListener(a),t.onDisconnect.addListener(a),console.log("tab "+e+" connected."),r()}(n,o[n].devtools,o[n].backend)}),chrome.runtime.onMessage.addListener((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"}))}),chrome.tabs.onActivated.addListener(({tabId:e})=>{c=e,r()}),chrome.contextMenus.onClicked.addListener((e,n)=>{chrome.runtime.sendMessage({vueContextMenu:{id:e.menuItemId}})})}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/build/detector.js: -------------------------------------------------------------------------------- 1 | !function(e){var n={};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}t.m=e,t.c=n,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,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=194)}({194:function(e,n,t){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var o=t(195);function r(e){const n=document.createElement("script");n.textContent=";("+e.toString()+")(window)",document.documentElement.appendChild(n),n.parentNode.removeChild(n)}window.addEventListener("message",e=>{e.source===window&&e.data.vueDetected&&chrome.runtime.sendMessage(e.data)}),document instanceof HTMLDocument&&(r(function(e){setTimeout(()=>{const n=document.querySelectorAll("*");let t;for(let e=0;e{const d=o[c]||o.normal;console.log(`%c vue-devtools %c ${e} %c `,"background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px; color: #fff",`background: ${d}; padding: 1px; border-radius: 0 3px 3px 0; color: #fff`,"background:transparent"),n?n.querySelector(".vue-wrapper").style.background=d:((n=document.createElement("div")).addEventListener("click",r),n.innerHTML=`\n
\n
\n
\n
\n
\n `,document.body.appendChild(n)),n.querySelector(".vue-content").innerText=e,clearTimeout(t),t=setTimeout(r,5e3)})}}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/build/devtools-background.js: -------------------------------------------------------------------------------- 1 | !function(e){var n={};function o(t){if(n[t])return n[t].exports;var u=n[t]={i:t,l:!1,exports:{}};return e[t].call(u.exports,u,u.exports,o),u.l=!0,u.exports}o.m=e,o.c=n,o.d=function(e,n,t){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:t})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="",o(o.s=191)}({191:function(e,n){let o,t=!1,u=!1,r=!1,s=0;chrome.devtools.network.onNavigated.addListener(i);const c=setInterval(i,1e3);function i(){r||s++>10||(t=!1,u=!1,chrome.devtools.inspectedWindow.eval("!!(window.__VUE_DEVTOOLS_GLOBAL_HOOK__.Vue)",function(e){e&&!r&&(clearInterval(c),r=!0,chrome.devtools.panels.create("Vue","icons/128.png","devtools.html",e=>{e.onShown.addListener(l),e.onHidden.addListener(d)}))}))}function a(){o&&o(),o=null}function l(){chrome.runtime.sendMessage("vue-panel-shown"),u=!0,t&&a()}function d(){chrome.runtime.sendMessage("vue-panel-hidden"),u=!1}function v(e,n="normal"){const o=`(function() {\n __VUE_DEVTOOLS_TOAST__(\`${e}\`, '${n}');\n })()`;chrome.devtools.inspectedWindow.eval(o,function(e,n){n&&console.log(n)})}i(),chrome.runtime.onMessage.addListener(e=>{"vue-panel-load"===e?(a(),t=!0):e.vueToast?v(e.vueToast.message,e.vueToast.type):e.vueContextMenu&&function({id:e}){if("vue-inspect-instance"===e){const e="window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__";chrome.devtools.inspectedWindow.eval(e,function(e,n){n&&console.log(n),void 0!==e&&e?function(e,n=null){r&&t&&u?e():(o=e,n&&v(n))}(()=>{chrome.runtime.sendMessage("vue-get-context-menu-target")},"Open Vue devtools to see component details"):(o=null,v("No Vue component was found","warn"))})}}(e.vueContextMenu)})}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/build/hook.js: -------------------------------------------------------------------------------- 1 | !function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:o})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=45)}({45:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(46);if(document instanceof HTMLDocument){const e=document.createElement("script");e.textContent=";("+o.a.toString()+")(window)",document.documentElement.appendChild(e),e.parentNode.removeChild(e)}},46:function(e,t,n){"use strict";t.a=function(e){let t={};if(e.hasOwnProperty("__VUE_DEVTOOLS_GLOBAL_HOOK__"))return;const n={Vue:null,on(e,n){(t[e="$"+e]||(t[e]=[])).push(n)},once(e,n){const o=e;(t[e="$"+e]||(t[e]=[])).push(function e(){this.off(o,e);n.apply(this,arguments)})},off(e,n){if(e="$"+e,arguments.length){const o=t[e];if(o)if(n)for(let e=0,t=o.length;e{n.Vue=t,t.prototype.$inspect=function(){const t=e.__VUE_DEVTOOLS_INSPECT__;t&&t(this)}}),n.once("vuex:init",e=>{n.store=e}),Object.defineProperty(e,"__VUE_DEVTOOLS_GLOBAL_HOOK__",{get:()=>n})}}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/build/proxy.js: -------------------------------------------------------------------------------- 1 | !function(e){var n={};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}t.m=e,t.c=n,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,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=193)}({193:function(e,n){const t=chrome.runtime.connect({name:"content-script"});function o(e){window.postMessage({source:"vue-devtools-proxy",payload:e},"*")}function r(e){e.data&&"vue-devtools-backend"===e.data.source&&t.postMessage(e.data.payload)}t.onMessage.addListener(o),window.addEventListener("message",r),t.onDisconnect.addListener(function(){window.removeEventListener("message",r),o("shutdown")}),o("init")}}); -------------------------------------------------------------------------------- /devTools/vue-devtools/devtools-background.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /devTools/vue-devtools/devtools.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 15 | 16 | 17 |
18 |
19 |
20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/128-gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/128-gray.png -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/128.png -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/16-gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/16-gray.png -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/16.png -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/48-gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/48-gray.png -------------------------------------------------------------------------------- /devTools/vue-devtools/icons/48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/devTools/vue-devtools/icons/48.png -------------------------------------------------------------------------------- /devTools/vue-devtools/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Vue.js devtools", 3 | "version": "4.1.4", 4 | "description": "Chrome and Firefox DevTools extension for debugging Vue.js applications.", 5 | "manifest_version": 2, 6 | "icons": { 7 | "16": "icons/16.png", 8 | "48": "icons/48.png", 9 | "128": "icons/128.png" 10 | }, 11 | "browser_action": { 12 | "default_icon": { 13 | "16": "icons/16-gray.png", 14 | "48": "icons/48-gray.png", 15 | "128": "icons/128-gray.png" 16 | }, 17 | "default_title": "Vue Devtools", 18 | "default_popup": "popups/not-found.html" 19 | }, 20 | "web_accessible_resources": [ 21 | "devtools.html", 22 | "devtools-background.html", 23 | "build/backend.js" 24 | ], 25 | "devtools_page": "devtools-background.html", 26 | "background": { 27 | "scripts": [ 28 | "build/background.js" 29 | ], 30 | "persistent": false 31 | }, 32 | "permissions": [ 33 | "http://*/*", 34 | "https://*/*", 35 | "file:///*", 36 | "contextMenus" 37 | ], 38 | "content_scripts": [ 39 | { 40 | "matches": [ 41 | "" 42 | ], 43 | "js": [ 44 | "build/hook.js" 45 | ], 46 | "run_at": "document_start" 47 | }, 48 | { 49 | "matches": [ 50 | "" 51 | ], 52 | "js": [ 53 | "build/detector.js" 54 | ], 55 | "run_at": "document_idle" 56 | } 57 | ] 58 | } -------------------------------------------------------------------------------- /devTools/vue-devtools/popups/disabled.html: -------------------------------------------------------------------------------- 1 | 2 |

3 | Vue.js is detected on this page. 4 | Devtools inspection is not available because it's in 5 | production mode or explicitly disabled by the author. 6 |

7 | -------------------------------------------------------------------------------- /devTools/vue-devtools/popups/enabled.html: -------------------------------------------------------------------------------- 1 | 2 |

3 | Vue.js is detected on this page. 4 | Open DevTools and look for the Vue panel. 5 |

6 | -------------------------------------------------------------------------------- /devTools/vue-devtools/popups/not-found.html: -------------------------------------------------------------------------------- 1 | 2 |

3 | Vue.js not detected 4 |

5 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/backend.js: -------------------------------------------------------------------------------- 1 | // this is injected to the app page when the panel is activated. 2 | 3 | import { initBackend } from 'src/backend' 4 | import Bridge from 'src/bridge' 5 | 6 | window.addEventListener('message', handshake) 7 | 8 | function handshake (e) { 9 | if (e.data.source === 'vue-devtools-proxy' && e.data.payload === 'init') { 10 | window.removeEventListener('message', handshake) 11 | 12 | let listeners = [] 13 | const bridge = new Bridge({ 14 | listen (fn) { 15 | var listener = evt => { 16 | if (evt.data.source === 'vue-devtools-proxy' && evt.data.payload) { 17 | fn(evt.data.payload) 18 | } 19 | } 20 | window.addEventListener('message', listener) 21 | listeners.push(listener) 22 | }, 23 | send (data) { 24 | window.postMessage({ 25 | source: 'vue-devtools-backend', 26 | payload: data 27 | }, '*') 28 | } 29 | }) 30 | 31 | bridge.on('shutdown', () => { 32 | listeners.forEach(l => { 33 | window.removeEventListener('message', l) 34 | }) 35 | listeners = [] 36 | }) 37 | 38 | initBackend(bridge) 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/background.js: -------------------------------------------------------------------------------- 1 | // the background script runs all the time and serves as a central message 2 | // hub for each vue devtools (panel + proxy + backend) instance. 3 | 4 | const ports = {} 5 | 6 | chrome.runtime.onConnect.addListener(port => { 7 | let tab 8 | let name 9 | if (isNumeric(port.name)) { 10 | tab = port.name 11 | name = 'devtools' 12 | installProxy(+port.name) 13 | } else { 14 | tab = port.sender.tab.id 15 | name = 'backend' 16 | } 17 | 18 | if (!ports[tab]) { 19 | ports[tab] = { 20 | devtools: null, 21 | backend: null 22 | } 23 | } 24 | ports[tab][name] = port 25 | 26 | if (ports[tab].devtools && ports[tab].backend) { 27 | doublePipe(tab, ports[tab].devtools, ports[tab].backend) 28 | } 29 | }) 30 | 31 | function isNumeric (str) { 32 | return +str + '' === str 33 | } 34 | 35 | function installProxy (tabId) { 36 | chrome.tabs.executeScript(tabId, { 37 | file: '/build/proxy.js' 38 | }, function (res) { 39 | if (!res) { 40 | ports[tabId].devtools.postMessage('proxy-fail') 41 | } else { 42 | console.log('injected proxy to tab ' + tabId) 43 | } 44 | }) 45 | } 46 | 47 | function doublePipe (id, one, two) { 48 | one.onMessage.addListener(lOne) 49 | function lOne (message) { 50 | if (message.event === 'log') { 51 | return console.log('tab ' + id, message.payload) 52 | } 53 | console.log('devtools -> backend', message) 54 | two.postMessage(message) 55 | } 56 | two.onMessage.addListener(lTwo) 57 | function lTwo (message) { 58 | if (message.event === 'log') { 59 | return console.log('tab ' + id, message.payload) 60 | } 61 | console.log('backend -> devtools', message) 62 | one.postMessage(message) 63 | } 64 | function shutdown () { 65 | console.log('tab ' + id + ' disconnected.') 66 | one.onMessage.removeListener(lOne) 67 | two.onMessage.removeListener(lTwo) 68 | one.disconnect() 69 | two.disconnect() 70 | ports[id] = null 71 | updateContextMenuItem() 72 | } 73 | one.onDisconnect.addListener(shutdown) 74 | two.onDisconnect.addListener(shutdown) 75 | console.log('tab ' + id + ' connected.') 76 | updateContextMenuItem() 77 | } 78 | 79 | chrome.runtime.onMessage.addListener((req, sender) => { 80 | if (sender.tab && req.vueDetected) { 81 | chrome.browserAction.setIcon({ 82 | tabId: sender.tab.id, 83 | path: { 84 | 16: 'icons/16.png', 85 | 48: 'icons/48.png', 86 | 128: 'icons/128.png' 87 | } 88 | }) 89 | chrome.browserAction.setPopup({ 90 | tabId: sender.tab.id, 91 | popup: req.devtoolsEnabled ? 'popups/enabled.html' : 'popups/disabled.html' 92 | }) 93 | } 94 | }) 95 | 96 | // Right-click inspect context menu entry 97 | let activeTabId 98 | chrome.tabs.onActivated.addListener(({ tabId }) => { 99 | activeTabId = tabId 100 | updateContextMenuItem() 101 | }) 102 | 103 | function updateContextMenuItem () { 104 | if (ports[activeTabId]) { 105 | chrome.contextMenus.create({ 106 | id: 'vue-inspect-instance', 107 | title: 'Inspect Vue component', 108 | contexts: ['all'] 109 | }) 110 | } else { 111 | chrome.contextMenus.remove('vue-inspect-instance') 112 | } 113 | } 114 | 115 | chrome.contextMenus.onClicked.addListener((info, tab) => { 116 | chrome.runtime.sendMessage({ 117 | vueContextMenu: { 118 | id: info.menuItemId 119 | } 120 | }) 121 | }) 122 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/detector.js: -------------------------------------------------------------------------------- 1 | import { installToast } from 'src/backend/toast' 2 | 3 | window.addEventListener('message', e => { 4 | if (e.source === window && e.data.vueDetected) { 5 | chrome.runtime.sendMessage(e.data) 6 | } 7 | }) 8 | 9 | function detect (win) { 10 | setTimeout(() => { 11 | const all = document.querySelectorAll('*') 12 | let el 13 | for (let i = 0; i < all.length; i++) { 14 | if (all[i].__vue__) { 15 | el = all[i] 16 | break 17 | } 18 | } 19 | if (el) { 20 | let Vue = Object.getPrototypeOf(el.__vue__).constructor 21 | while (Vue.super) { 22 | Vue = Vue.super 23 | } 24 | win.postMessage({ 25 | devtoolsEnabled: Vue.config.devtools, 26 | vueDetected: true 27 | }, '*') 28 | } 29 | }, 100) 30 | } 31 | 32 | // inject the hook 33 | if (document instanceof HTMLDocument) { 34 | installScript(detect) 35 | installScript(installToast) 36 | } 37 | 38 | function installScript (fn) { 39 | const script = document.createElement('script') 40 | script.textContent = ';(' + fn.toString() + ')(window)' 41 | document.documentElement.appendChild(script) 42 | script.parentNode.removeChild(script) 43 | } 44 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/devtools-background.js: -------------------------------------------------------------------------------- 1 | // This is the devtools script, which is called when the user opens the 2 | // Chrome devtool on a page. We check to see if we global hook has detected 3 | // Vue presence on the page. If yes, create the Vue panel; otherwise poll 4 | // for 10 seconds. 5 | 6 | let panelLoaded = false 7 | let panelShown = false 8 | let pendingAction 9 | let created = false 10 | let checkCount = 0 11 | 12 | chrome.devtools.network.onNavigated.addListener(createPanelIfHasVue) 13 | const checkVueInterval = setInterval(createPanelIfHasVue, 1000) 14 | createPanelIfHasVue() 15 | 16 | function createPanelIfHasVue () { 17 | if (created || checkCount++ > 10) { 18 | return 19 | } 20 | panelLoaded = false 21 | panelShown = false 22 | chrome.devtools.inspectedWindow.eval( 23 | '!!(window.__VUE_DEVTOOLS_GLOBAL_HOOK__.Vue)', 24 | function (hasVue) { 25 | if (!hasVue || created) { 26 | return 27 | } 28 | clearInterval(checkVueInterval) 29 | created = true 30 | chrome.devtools.panels.create( 31 | 'Vue', 'icons/128.png', 'devtools.html', 32 | panel => { 33 | // panel loaded 34 | panel.onShown.addListener(onPanelShown) 35 | panel.onHidden.addListener(onPanelHidden) 36 | } 37 | ) 38 | } 39 | ) 40 | } 41 | 42 | // Runtime messages 43 | 44 | chrome.runtime.onMessage.addListener(request => { 45 | if (request === 'vue-panel-load') { 46 | onPanelLoad() 47 | } else if (request.vueToast) { 48 | toast(request.vueToast.message, request.vueToast.type) 49 | } else if (request.vueContextMenu) { 50 | onContextMenu(request.vueContextMenu) 51 | } 52 | }) 53 | 54 | // Page context menu entry 55 | 56 | function onContextMenu ({ id }) { 57 | if (id === 'vue-inspect-instance') { 58 | const src = `window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__` 59 | 60 | chrome.devtools.inspectedWindow.eval(src, function (res, err) { 61 | if (err) { 62 | console.log(err) 63 | } 64 | if (typeof res !== 'undefined' && res) { 65 | panelAction(() => { 66 | chrome.runtime.sendMessage('vue-get-context-menu-target') 67 | }, 'Open Vue devtools to see component details') 68 | } else { 69 | pendingAction = null 70 | toast('No Vue component was found', 'warn') 71 | } 72 | }) 73 | } 74 | } 75 | 76 | // Action that may execute immediatly 77 | // or later when the Vue panel is ready 78 | 79 | function panelAction (cb, message = null) { 80 | if (created && panelLoaded && panelShown) { 81 | cb() 82 | } else { 83 | pendingAction = cb 84 | message && toast(message) 85 | } 86 | } 87 | 88 | function executePendingAction () { 89 | pendingAction && pendingAction() 90 | pendingAction = null 91 | } 92 | 93 | // Execute pending action when Vue panel is ready 94 | 95 | function onPanelLoad () { 96 | executePendingAction() 97 | panelLoaded = true 98 | } 99 | 100 | // Manage panel visibility 101 | 102 | function onPanelShown () { 103 | chrome.runtime.sendMessage('vue-panel-shown') 104 | panelShown = true 105 | panelLoaded && executePendingAction() 106 | } 107 | 108 | function onPanelHidden () { 109 | chrome.runtime.sendMessage('vue-panel-hidden') 110 | panelShown = false 111 | } 112 | 113 | // Toasts 114 | 115 | function toast (message, type = 'normal') { 116 | const src = `(function() { 117 | __VUE_DEVTOOLS_TOAST__(\`${message}\`, '${type}'); 118 | })()` 119 | 120 | chrome.devtools.inspectedWindow.eval(src, function (res, err) { 121 | if (err) { 122 | console.log(err) 123 | } 124 | }) 125 | } 126 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/devtools.js: -------------------------------------------------------------------------------- 1 | // this script is called when the VueDevtools panel is activated. 2 | 3 | import { initDevTools } from 'src/devtools' 4 | import Bridge from 'src/bridge' 5 | 6 | initDevTools({ 7 | 8 | /** 9 | * Inject backend, connect to background, and send back the bridge. 10 | * 11 | * @param {Function} cb 12 | */ 13 | 14 | connect (cb) { 15 | // 1. inject backend code into page 16 | injectScript(chrome.runtime.getURL('build/backend.js'), () => { 17 | // 2. connect to background to setup proxy 18 | const port = chrome.runtime.connect({ 19 | name: '' + chrome.devtools.inspectedWindow.tabId 20 | }) 21 | let disconnected = false 22 | port.onDisconnect.addListener(() => { 23 | disconnected = true 24 | }) 25 | 26 | const bridge = new Bridge({ 27 | listen (fn) { 28 | port.onMessage.addListener(fn) 29 | }, 30 | send (data) { 31 | if (!disconnected) { 32 | port.postMessage(data) 33 | } 34 | } 35 | }) 36 | // 3. send a proxy API to the panel 37 | cb(bridge) 38 | }) 39 | }, 40 | 41 | /** 42 | * Register a function to reload the devtools app. 43 | * 44 | * @param {Function} reloadFn 45 | */ 46 | 47 | onReload (reloadFn) { 48 | chrome.devtools.network.onNavigated.addListener(reloadFn) 49 | } 50 | }) 51 | 52 | /** 53 | * Inject a globally evaluated script, in the same context with the actual 54 | * user app. 55 | * 56 | * @param {String} scriptName 57 | * @param {Function} cb 58 | */ 59 | 60 | function injectScript (scriptName, cb) { 61 | const src = ` 62 | (function() { 63 | var script = document.constructor.prototype.createElement.call(document, 'script'); 64 | script.src = "${scriptName}"; 65 | document.documentElement.appendChild(script); 66 | script.parentNode.removeChild(script); 67 | })() 68 | ` 69 | chrome.devtools.inspectedWindow.eval(src, function (res, err) { 70 | if (err) { 71 | console.log(err) 72 | } 73 | cb() 74 | }) 75 | } 76 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/hook.js: -------------------------------------------------------------------------------- 1 | // This script is injected into every page. 2 | import { installHook } from 'src/backend/hook' 3 | 4 | // inject the hook 5 | if (document instanceof HTMLDocument) { 6 | const script = document.createElement('script') 7 | script.textContent = ';(' + installHook.toString() + ')(window)' 8 | document.documentElement.appendChild(script) 9 | script.parentNode.removeChild(script) 10 | } 11 | -------------------------------------------------------------------------------- /devTools/vue-devtools/src/proxy.js: -------------------------------------------------------------------------------- 1 | // This is a content-script that is injected only when the devtools are 2 | // activated. Because it is not injected using eval, it has full privilege 3 | // to the chrome runtime API. It serves as a proxy between the injected 4 | // backend and the Vue devtools panel. 5 | 6 | const port = chrome.runtime.connect({ 7 | name: 'content-script' 8 | }) 9 | 10 | port.onMessage.addListener(sendMessageToBackend) 11 | window.addEventListener('message', sendMessageToDevtools) 12 | port.onDisconnect.addListener(handleDisconnect) 13 | 14 | sendMessageToBackend('init') 15 | 16 | function sendMessageToBackend (payload) { 17 | window.postMessage({ 18 | source: 'vue-devtools-proxy', 19 | payload: payload 20 | }, '*') 21 | } 22 | 23 | function sendMessageToDevtools (e) { 24 | if (e.data && e.data.source === 'vue-devtools-backend') { 25 | port.postMessage(e.data.payload) 26 | } 27 | } 28 | 29 | function handleDisconnect () { 30 | window.removeEventListener('message', sendMessageToDevtools) 31 | sendMessageToBackend('shutdown') 32 | } 33 | -------------------------------------------------------------------------------- /devTools/vue-devtools/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const createConfig = require('../createConfig') 3 | 4 | module.exports = createConfig({ 5 | entry: { 6 | hook: './src/hook.js', 7 | devtools: './src/devtools.js', 8 | background: './src/background.js', 9 | 'devtools-background': './src/devtools-background.js', 10 | backend: './src/backend.js', 11 | proxy: './src/proxy.js', 12 | detector: './src/detector.js' 13 | }, 14 | output: { 15 | path: path.join(__dirname, 'build'), 16 | filename: '[name].js' 17 | }, 18 | devtool: process.env.NODE_ENV !== 'production' 19 | ? '#inline-source-map' 20 | : false 21 | }) 22 | -------------------------------------------------------------------------------- /dist/electron/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/dist/electron/.gitkeep -------------------------------------------------------------------------------- /dist/web/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/dist/web/.gitkeep -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "barrage-helper", 3 | "version": "0.2.0", 4 | "author": "黄小Z <909695699@qq.com>", 5 | "description": "弹幕助手", 6 | "license": "MIT", 7 | "main": "./dist/electron/main.js", 8 | "repository": "https://github.com/WozHuang/Barrage-helper", 9 | "keywords": [ 10 | "Barrage" 11 | ], 12 | "scripts": { 13 | "build": "node .electron-vue/build.js && electron-builder", 14 | "build:dir": "node .electron-vue/build.js && electron-builder --dir", 15 | "build:clean": "cross-env BUILD_TARGET=clean node .electron-vue/build.js", 16 | "build:web": "cross-env BUILD_TARGET=web node .electron-vue/build.js", 17 | "dev": "node .electron-vue/dev-runner.js", 18 | "lint": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter src test", 19 | "lint:fix": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter --fix src test", 20 | "pack": "npm run pack:main && npm run pack:renderer", 21 | "pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js", 22 | "pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js", 23 | "test": "npm run unit", 24 | "unit": "karma start test/unit/karma.conf.js", 25 | "postinstall": "npm run lint:fix", 26 | "server": "node server/server.js" 27 | }, 28 | "build": { 29 | "productName": "barrage-helper", 30 | "appId": "com.example.yourapp", 31 | "directories": { 32 | "output": "build" 33 | }, 34 | "files": [ 35 | "dist/electron/**/*" 36 | ], 37 | "dmg": { 38 | "contents": [ 39 | { 40 | "x": 410, 41 | "y": 150, 42 | "type": "link", 43 | "path": "/Applications" 44 | }, 45 | { 46 | "x": 130, 47 | "y": 150, 48 | "type": "file" 49 | } 50 | ] 51 | }, 52 | "mac": { 53 | "icon": "build/icons/icon.icns" 54 | }, 55 | "win": { 56 | "icon": "build/icons/icon.ico" 57 | }, 58 | "linux": { 59 | "icon": "build/icons" 60 | } 61 | }, 62 | "dependencies": { 63 | "axios": "^0.18.0", 64 | "bytes": "^3.0.0", 65 | "chalk": "^2.4.2", 66 | "element-ui": "^2.6.3", 67 | "humanize-number": "^0.0.2", 68 | "koa": "^2.3.0", 69 | "koa-bodyparser": "3.2.0", 70 | "koa-router": "7.0.0", 71 | "mitt": "^1.1.3", 72 | "passthrough-counter": "^1.0.0", 73 | "vue": "^2.5.16", 74 | "vue-electron": "^1.0.6", 75 | "vue-router": "^3.0.1", 76 | "vuex": "^3.0.1", 77 | "vuex-electron": "^1.0.0" 78 | }, 79 | "devDependencies": { 80 | "ajv": "^6.5.0", 81 | "babel-core": "^6.26.3", 82 | "babel-eslint": "^8.2.3", 83 | "babel-loader": "^7.1.4", 84 | "babel-plugin-istanbul": "^4.1.6", 85 | "babel-plugin-transform-runtime": "^6.23.0", 86 | "babel-preset-env": "^1.7.0", 87 | "babel-preset-stage-0": "^6.24.1", 88 | "babel-register": "^6.26.0", 89 | "babili-webpack-plugin": "^0.1.2", 90 | "cfonts": "^2.1.2", 91 | "chai": "^4.1.2", 92 | "copy-webpack-plugin": "^4.5.1", 93 | "cross-env": "^5.1.6", 94 | "css-loader": "^0.28.11", 95 | "del": "^3.0.0", 96 | "devtron": "^1.4.0", 97 | "electron": "^2.0.4", 98 | "electron-builder": "^20.19.2", 99 | "electron-debug": "^1.5.0", 100 | "electron-devtools-installer": "^2.2.4", 101 | "eslint": "^4.19.1", 102 | "eslint-config-airbnb-base": "^12.1.0", 103 | "eslint-friendly-formatter": "^4.0.1", 104 | "eslint-import-resolver-webpack": "^0.10.0", 105 | "eslint-loader": "^2.0.0", 106 | "eslint-plugin-html": "^4.0.3", 107 | "eslint-plugin-import": "^2.12.0", 108 | "file-loader": "^1.1.11", 109 | "html-webpack-plugin": "^3.2.0", 110 | "inject-loader": "^4.0.1", 111 | "karma": "^2.0.2", 112 | "karma-chai": "^0.1.0", 113 | "karma-coverage": "^1.1.2", 114 | "karma-electron": "^6.0.0", 115 | "karma-mocha": "^1.3.0", 116 | "karma-sourcemap-loader": "^0.3.7", 117 | "karma-spec-reporter": "^0.0.32", 118 | "karma-webpack": "^3.0.0", 119 | "mini-css-extract-plugin": "0.4.0", 120 | "mocha": "^5.2.0", 121 | "multispinner": "^0.2.1", 122 | "node-loader": "^0.6.0", 123 | "node-sass": "^4.9.2", 124 | "sass-loader": "^7.0.3", 125 | "style-loader": "^0.21.0", 126 | "url-loader": "^1.0.1", 127 | "vue-html-loader": "^1.2.4", 128 | "vue-loader": "^15.2.4", 129 | "vue-style-loader": "^4.1.0", 130 | "vue-template-compiler": "^2.5.16", 131 | "webpack": "^4.15.1", 132 | "webpack-cli": "^3.0.8", 133 | "webpack-dev-server": "^3.1.4", 134 | "webpack-hot-middleware": "^2.22.2", 135 | "webpack-merge": "^4.1.3" 136 | } 137 | } 138 | -------------------------------------------------------------------------------- /records/add-vue-devtools.md: -------------------------------------------------------------------------------- 1 | ### 为Electron 安装 vue-devtool ### 2 | 3 | > 相关代码: 4 | [https://github.com/WozHuang/Barrage-helper/blob/master/src/main/index.dev.js](https://github.com/WozHuang/Barrage-helper/blob/master/src/main/index.dev.js) 5 | 6 | 在SPA逐渐成为构建优秀交互体验应用的主流方式后，使用Electron开发跨平台的软件是一个优秀的解决方案。下面简单介绍一下 Electron-vue 安装 vue-devtool的方式。 7 | 8 | #### 安装步骤 #### 9 | 10 | 1. 下载 vue-devtools.crx，把文件名后缀改成zip后解压放在工程目录下 11 | > （找不到或者懒得下可以直接克隆我的仓库后把[这个文件夹](https://github.com/WozHuang/Barrage-helper/tree/master/devTools/vue-devtools)给复制出来，我已经解压好放在里面了） 12 | 13 | 2. Electron-Vue中本来是应该预装好了vue-devtool的，奈何 `electron-devtools-installer` 这个库不知道有什么问题，只能自己手动装了，[部分代码](https://github.com/WozHuang/Barrage-helper/blob/master/src/main/index.dev.js)： 14 | 15 | ```js 16 | // Install `vue-devtools` 17 | require('electron').app.on('ready', () => { 18 | 19 | // 注释掉的这部分是 Electron-Vue 中预装devtool的代码，没有用 20 | // let installExtension = require('electron-devtools-installer') 21 | // installExtension.default(installExtension.VUEJS_DEVTOOLS) 22 | // .then(() => {}) 23 | // .catch(err => { 24 | // console.log('Unable to install `vue-devtools`: \n', err) 25 | // }) 26 | 27 | // 新增的：安装vue-devtools 28 | BrowserWindow.addDevToolsExtension(path.resolve(__dirname, '../../devTools/vue-devtools')); 29 | 30 | }); 31 | ``` 32 | 33 | 除了vue-devtool，安装其他的扩展也是同理，但是估计没有什么用（Electron已经为浏览器放开很多限制不需要扩展了） 34 | 35 | #### 效果图 #### 36 | 37 | ![](./assets/install-vue-devtool.png) 38 | 39 | 最后，有兴趣可以看下这个用 Electron-vue 做的小玩具：[一个弹幕助手](https://github.com/WozHuang/Barrage-helper)，主要功能有显示并朗读弹幕、背景色及透明度设置和窗口置顶。 40 | 41 | ![](../assets/preview2.png) 42 | 43 | #### 参考 #### 44 | 45 | [Electron文档中关于DevTool](https://electronjs.org/docs/tutorial/devtools-extension) -------------------------------------------------------------------------------- /records/assets/install-vue-devtool.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/records/assets/install-vue-devtool.png -------------------------------------------------------------------------------- /server/logger.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | const counterFunc = require('passthrough-counter'); 3 | const humanize = require('humanize-number'); 4 | const bytes = require('bytes'); 5 | const chalk = require('chalk'); 6 | const util = require('util'); 7 | 8 | // color map. 9 | const colorCodes = { 10 | 7: 'magenta', 11 | 5: 'red', 12 | 4: 'yellow', 13 | 3: 'cyan', 14 | 2: 'green', 15 | 1: 'green', 16 | 0: 'yellow', 17 | }; 18 | 19 | module.exports = function(options) { 20 | // print to console helper. 21 | const print = (function() { 22 | let transporter; 23 | if (typeof options === 'function') { 24 | transporter = options; 25 | } else if (options && options.transporter) { 26 | transporter = options.transporter; 27 | } 28 | 29 | // eslint-disable-next-line func-names 30 | return function printFunc(...args) { 31 | args[0] = `[${new Date().toLocaleString()}] ${args[0]}`; 32 | const string = util.format(...args); 33 | if (transporter) transporter(string, args); 34 | else console.log(...args); 35 | }; 36 | })(); 37 | 38 | // eslint-disable-next-line func-names 39 | return async function logger(ctx, next) { 40 | // request 41 | const start = ctx[Symbol.for('request-received.startTime')] 42 | ? ctx[Symbol.for('request-received.startTime')].getTime() 43 | : Date.now(); 44 | print( 45 | ` ${chalk.gray('<--')} ${chalk.bold('%s')} ${chalk.gray('%s')} ${chalk.yellow('%s')}`, 46 | ctx.method, 47 | ctx.originalUrl, 48 | ctx.ip 49 | ); 50 | 51 | try { 52 | await next(); 53 | } catch (err) { 54 | // log uncaught downstream errors 55 | log(print, ctx, start, null, err); 56 | throw err; 57 | } 58 | 59 | // calculate the length of a streaming response 60 | // by intercepting the stream with a counter. 61 | // only necessary if a content-length header is currently not set. 62 | const { 63 | body, 64 | response: { length }, 65 | } = ctx; 66 | let counter; 67 | if (length === null && body && body.readable) { 68 | ctx.body = body.pipe((counter = counterFunc())).on('error', ctx.onerror); 69 | } 70 | 71 | // log when the response is finished or closed, 72 | // whichever happens first. 73 | const { res } = ctx; 74 | 75 | const onfinish = done.bind(null, 'finish'); 76 | const onclose = done.bind(null, 'close'); 77 | 78 | res.once('finish', onfinish); 79 | res.once('close', onclose); 80 | 81 | function done(event) { 82 | res.removeListener('finish', onfinish); 83 | res.removeListener('close', onclose); 84 | log(print, ctx, start, counter ? counter.length : length, null, event); 85 | } 86 | }; 87 | }; 88 | 89 | // Log helper. 90 | function log(print, ctx, start, length_, err, event) { 91 | // get the status code of the response 92 | const status = err ? (err.isBoom ? err.output.statusCode : err.status || 500) : ctx.status || 404; 93 | 94 | // set the color of the status code; 95 | const s = (status / 100) | 0; 96 | const color = colorCodes.hasOwnProperty(s) ? colorCodes[s] : colorCodes[0]; 97 | 98 | // get the human readable response length 99 | const length = [204, 205, 304].includes(status) ? '' : length_ == null ? '-' : bytes(length_).toLowerCase(); 100 | 101 | const upstream = err ? chalk.red('xxx') : event === 'close' ? chalk.yellow('-x-') : chalk.gray('-->'); 102 | 103 | print( 104 | ` ${upstream} ${chalk.bold('%s')} ${chalk.gray('%s')} ${chalk[color]('%s')} ${chalk.gray('%s')} ${chalk.gray( 105 | '%s' 106 | )}`, 107 | ctx.method, 108 | ctx.originalUrl, 109 | status, 110 | time(start), 111 | length 112 | ); 113 | } 114 | 115 | /** 116 | * Show the response time in a human readable format. 117 | * In milliseconds if less than 10 seconds, 118 | * in seconds otherwise. 119 | */ 120 | function time(start) { 121 | const delta = Date.now() - start; 122 | return humanize(delta < 10000 ? `${delta}ms` : `${Math.round(delta / 1000)}s`); 123 | } 124 | -------------------------------------------------------------------------------- /server/server.js: -------------------------------------------------------------------------------- 1 | // 用于获取签名后url的服务 2 | 3 | const Koa = require('koa'); 4 | // 注意require('koa-router')返回的是函数: 5 | const router = require('koa-router')(); 6 | const bodyParser = require('koa-bodyparser'); 7 | const config = require('../config'); 8 | const { getSign } = require('./sign'); 9 | const logger = require('./logger'); 10 | 11 | const app = new Koa(); 12 | const appId = config.huya.openId; 13 | 14 | app.use(logger()); 15 | app.use(async (ctx, next) => { 16 | // console.log(`Process ${ctx.request.method} ${ctx.request.url}...`); 17 | try { 18 | await next(); 19 | } catch (e) { 20 | ctx.response.body = { error: e.message }; 21 | ctx.response.status = 500; 22 | } 23 | ctx.set('Access-Control-Allow-Origin', '*'); 24 | }); 25 | 26 | router.get('/:doName/:roomId', async (ctx, next) => { 27 | const now = Math.round(Date.now() / 1000); 28 | const { doName, roomId } = ctx.params; 29 | if (['getMessageNotice', 'getSendItemNotice', 'getVipEnterBannerNotice'].indexOf(doName) === -1) { 30 | throw new Error(`doName应是${['getMessageNotice', 'getSendItemNotice', 'getVipEnterBannerNotice'].join()}中的一个`); 31 | } 32 | const data = { roomId: parseInt(roomId, 10) }; 33 | ctx.response.body = `wss://openapi.huya.com/index.html?do=${doName}&data=${JSON.stringify( 34 | data 35 | )}&appId=${appId}×tamp=${now}&sign=${getSign(data, now)}`; 36 | await next(); 37 | }); 38 | 39 | router.get('/', async (ctx) => { 40 | ctx.response.body = '请求 /:doName/:roomId 获得对应的url'; 41 | }); 42 | 43 | app.use(bodyParser()); 44 | app.use(router.routes()); 45 | app.listen(config.server.port, '0.0.0.0'); 46 | console.log(`[${new Date().toLocaleString()}] App is listening at port ${config.server.port}...`); 47 | -------------------------------------------------------------------------------- /server/sign.js: -------------------------------------------------------------------------------- 1 | const crypto = require('crypto'); 2 | const config = require('../config'); 3 | 4 | const key = config.huya.secretId; 5 | function getSign(data = '', timestamp) { 6 | const dataStr = JSON.stringify(data); 7 | const now = timestamp || Math.round(Date.now() / 1000); 8 | const str = `data=${dataStr}&key=${key}×tamp=${now}`; 9 | return crypto.createHash('md5').update(str, 'utf-8').digest('hex'); 10 | } 11 | 12 | module.exports = { getSign }; 13 | -------------------------------------------------------------------------------- /src/index.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | barrage-helper 6 | <% if (htmlWebpackPlugin.options.nodeModules) { %> 7 | 8 | 11 | <% } %> 12 | 13 | 14 |
15 | 16 | <% if (!process.browser) { %> 17 | 20 | <% } %> 21 | 22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /src/main/index.dev.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | /** 3 | * This file is used specifically and only for development. It installs 4 | * `electron-debug` & `vue-devtools`. There shouldn't be any need to 5 | * modify this file, but it can be used to extend your development 6 | * environment. 7 | */ 8 | 9 | // Install `electron-debug` with `devtron` 10 | import { BrowserWindow } from 'electron'; 11 | import path from 'path'; 12 | 13 | require('electron-debug')({ showDevTools: false }); 14 | 15 | // Install `vue-devtools` 16 | require('electron').app.on('ready', () => { 17 | // let installExtension = require('electron-devtools-installer') 18 | // installExtension.default(installExtension.VUEJS_DEVTOOLS) 19 | // .then(() => {}) 20 | // .catch(err => { 21 | // console.log('Unable to install `vue-devtools`: \n', err) 22 | // }) 23 | 24 | // 安装vue-devtools 25 | BrowserWindow.addDevToolsExtension(path.resolve(__dirname, '../../devTools/vue-devtools')); 26 | }); 27 | 28 | // Require `main` process to boot app 29 | require('./index'); 30 | -------------------------------------------------------------------------------- /src/main/index.js: -------------------------------------------------------------------------------- 1 | import { app, BrowserWindow } from 'electron' // eslint-disable-line 2 | import ipc from './ipc'; 3 | 4 | /** 5 | * Set `__static` path to static files in production 6 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html 7 | */ 8 | if (process.env.NODE_ENV !== 'development') { 9 | global.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\') // eslint-disable-line 10 | } 11 | 12 | let mainWindow; 13 | const winURL = process.env.NODE_ENV === 'development' 14 | ? 'http://localhost:9080' 15 | : `file://${__dirname}/index.html`; 16 | 17 | function createWindow() { 18 | /** 19 | * Initial window options 20 | */ 21 | mainWindow = new BrowserWindow({ 22 | height: 550, 23 | useContentSize: true, 24 | width: 325, 25 | webPreferences: { 26 | nodeIntegration: true, 27 | webSecurity: false, 28 | }, 29 | frame: false, 30 | transparent: true, 31 | resizable: true, 32 | }); 33 | 34 | // 修改userAgent，在请求的时候用到 35 | mainWindow.webContents.setUserAgent('Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.62 Mobile Safari/537.36'); 36 | 37 | mainWindow.loadURL(winURL); 38 | 39 | ipc(mainWindow); 40 | 41 | mainWindow.on('closed', () => { 42 | mainWindow = null; 43 | }); 44 | } 45 | 46 | app.on('ready', () => setTimeout(createWindow, 1000)); 47 | 48 | app.on('window-all-closed', () => { 49 | if (process.platform !== 'darwin') { 50 | app.quit(); 51 | } 52 | }); 53 | 54 | app.on('activate', () => { 55 | if (mainWindow === null) { 56 | createWindow(); 57 | } 58 | }); 59 | 60 | /** 61 | * Auto Updater 62 | * 63 | * Uncomment the following code below and install `electron-updater` to 64 | * support auto updating. Code Signing with a valid certificate is required. 65 | * https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-electron-builder.html#auto-updating 66 | */ 67 | 68 | /* 69 | import { autoUpdater } from 'electron-updater' 70 | 71 | autoUpdater.on('update-downloaded', () => { 72 | autoUpdater.quitAndInstall() 73 | }) 74 | 75 | app.on('ready', () => { 76 | if (process.env.NODE_ENV === 'production') autoUpdater.checkForUpdates() 77 | }) 78 | */ 79 | -------------------------------------------------------------------------------- /src/main/ipc.js: -------------------------------------------------------------------------------- 1 | import { ipcMain } from 'electron'; // eslint-disable-line 2 | export default function ipc(mainWindow) { 3 | // In main process. 4 | // ipcMain.on('asynchronous-message', (event, arg) => { 5 | // console.log(arg); // prints "ping" 6 | // event.sender.send('asynchronous-reply', 'pong'); 7 | // }); 8 | // 9 | // ipcMain.on('synchronous-message', (event, arg) => { 10 | // console.log(arg); // prints "ping" 11 | // event.returnValue = 'pong'; 12 | // }); 13 | 14 | ipcMain.on('stick-mainWindow', (event, { stick }) => { 15 | mainWindow.setAlwaysOnTop(stick); 16 | }); 17 | ipcMain.on('close-mainWindow', () => { 18 | mainWindow.close(); 19 | }); 20 | } 21 | -------------------------------------------------------------------------------- /src/renderer/App.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 30 | 31 | 60 | -------------------------------------------------------------------------------- /src/renderer/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/.gitkeep -------------------------------------------------------------------------------- /src/renderer/assets/button/back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/button/back.png -------------------------------------------------------------------------------- /src/renderer/assets/button/close.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/button/close.png -------------------------------------------------------------------------------- /src/renderer/assets/button/stick_actived.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/button/stick_actived.png -------------------------------------------------------------------------------- /src/renderer/assets/button/stick_inactived.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/button/stick_inactived.png -------------------------------------------------------------------------------- /src/renderer/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/src/renderer/assets/logo.png -------------------------------------------------------------------------------- /src/renderer/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import axios from 'axios'; 3 | import ElementUI from 'element-ui'; 4 | import 'element-ui/lib/theme-chalk/index.css'; 5 | import '@/util/ipc'; 6 | 7 | import App from './App'; 8 | import router from './router'; 9 | import store from './store'; 10 | 11 | Vue.use(ElementUI); 12 | 13 | if (!process.env.IS_WEB) Vue.use(require('vue-electron')); 14 | Vue.http = Vue.prototype.$http = axios; 15 | Vue.config.productionTip = false; 16 | 17 | /* eslint-disable no-new */ 18 | new Vue({ 19 | components: { App }, 20 | router, 21 | store, 22 | template: '', 23 | }).$mount('#app'); 24 | -------------------------------------------------------------------------------- /src/renderer/main.scss: -------------------------------------------------------------------------------- 1 | @import "./reset.scss"; 2 | * { 3 | margin: 0; 4 | font-family: "Microsoft YaHei", sans-serif; 5 | } 6 | 7 | html, body { 8 | height: 100%; 9 | } 10 | 11 | .drag { 12 | -webkit-app-region: drag; 13 | //user-select: none; 14 | } 15 | 16 | .no-drag { 17 | -webkit-app-region: no-drag; 18 | } 19 | 20 | .clearFix:after{ 21 | content: ''; 22 | display: block; 23 | height: 0; 24 | visibility: hidden; 25 | clear: both; 26 | } 27 | 28 | //$font-color: #333; 29 | //$main-blue: #409EFF; 30 | 31 | // 名字颜色 32 | $main-blue: var(--mainBlue, #0087ff); 33 | // 主要的文字颜色 34 | $font-color: var(--fontColor, #ddd); 35 | 36 | #app { 37 | --mainBlue: #3bd8e8; 38 | //--fontColor: #fff; 39 | } 40 | 41 | @mixin no-drag{ 42 | -webkit-app-region: no-drag; 43 | } 44 | -------------------------------------------------------------------------------- /src/renderer/reset.scss: -------------------------------------------------------------------------------- 1 | 2 | input::-webkit-outer-spin-button, 3 | input::-webkit-inner-spin-button { 4 | -webkit-appearance: none; 5 | } 6 | input[type="number"]{ 7 | -moz-appearance: textfield; 8 | } -------------------------------------------------------------------------------- /src/renderer/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import Router from 'vue-router'; 3 | 4 | Vue.use(Router); 5 | 6 | export default new Router({ 7 | routes: [ 8 | { 9 | path: '/', 10 | name: 'Index', 11 | component: require('@/views/index/Index').default, 12 | }, 13 | { 14 | path: '/BarrageList', 15 | name: 'BarrageList', 16 | component: require('@/views/huya/BarrageList').default, 17 | }, 18 | { 19 | path: '/Setting', 20 | name: 'Setting', 21 | component: require('@/views/setting/Setting').default, 22 | }, 23 | { 24 | path: '*', 25 | redirect: '/', 26 | }, 27 | ], 28 | }); 29 | -------------------------------------------------------------------------------- /src/renderer/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import Vuex from 'vuex'; 3 | 4 | // import { createPersistedState, createSharedMutations } from 'vuex-electron'; 5 | import { createPersistedState } from 'vuex-electron'; 6 | 7 | import modules from './modules'; 8 | 9 | Vue.use(Vuex); 10 | 11 | export default new Vuex.Store({ 12 | modules, 13 | plugins: [ 14 | createPersistedState(), 15 | // 这个破插件不能用，用了就不能dispatch，不知道为什么 16 | // createSharedMutations(), 17 | ], 18 | strict: process.env.NODE_ENV !== 'production', 19 | }); 20 | -------------------------------------------------------------------------------- /src/renderer/store/modules/Counter.js: -------------------------------------------------------------------------------- 1 | const state = { 2 | main: 0, 3 | }; 4 | 5 | const mutations = { 6 | DECREMENT_MAIN_COUNTER(state) { 7 | state.main -= 1; 8 | }, 9 | INCREMENT_MAIN_COUNTER(state) { 10 | state.main += 1; 11 | }, 12 | }; 13 | 14 | const actions = { 15 | someAsyncTask({ commit }) { 16 | // do something async 17 | commit('INCREMENT_MAIN_COUNTER'); 18 | }, 19 | }; 20 | 21 | export default { 22 | state, 23 | mutations, 24 | actions, 25 | }; 26 | -------------------------------------------------------------------------------- /src/renderer/store/modules/barrage.js: -------------------------------------------------------------------------------- 1 | const state = { 2 | readBarrage: true, // 是否自动 3 | readEmoji: true, 4 | }; 5 | 6 | const mutations = { 7 | TOGGLE_READ_BARRAGE(state) { 8 | state.readBarrage = !state.readBarrage; 9 | }, 10 | TOGGLE_READ_EMOJI(state) { 11 | state.readEmoji = !state.readEmoji; 12 | }, 13 | // INCREMENT_MAIN_COUNTER(state) { 14 | // state.main += 1; 15 | // }, 16 | }; 17 | 18 | const actions = { 19 | toggleReadBarrage({ commit }) { 20 | commit('TOGGLE_READ_BARRAGE'); 21 | }, 22 | toggleReadEmoji({ commit }) { 23 | commit('TOGGLE_READ_EMOJI'); 24 | }, 25 | }; 26 | 27 | const getters = { 28 | readBarrage: state => state.readBarrage, 29 | readEmoji: state => state.readEmoji, 30 | }; 31 | 32 | export default { 33 | state, 34 | mutations, 35 | actions, 36 | getters, 37 | }; 38 | -------------------------------------------------------------------------------- /src/renderer/store/modules/global.js: -------------------------------------------------------------------------------- 1 | import { stickMainWindow } from '@/util/ipc'; 2 | const state = { 3 | stick: false, 4 | backgroundColor: 'rgba(0,0,0,0.5)', 5 | }; 6 | 7 | const mutations = { 8 | TOGGLE_STICK(state, stick) { 9 | const result = stick === undefined ? !state.stick : stick; 10 | stickMainWindow(result); 11 | state.stick = result; 12 | }, 13 | SET_BACKGROUND_COLOR(state, value) { 14 | state.backgroundColor = value; 15 | }, 16 | }; 17 | 18 | const actions = { 19 | toggleStick({ commit }, { stick }) { 20 | commit('TOGGLE_STICK', stick); 21 | }, 22 | setBackgroundColor({ commit }, color) { 23 | commit('SET_BACKGROUND_COLOR', color); 24 | } 25 | }; 26 | 27 | const getters = { 28 | backgroundColor: state => state.backgroundColor, 29 | }; 30 | 31 | export default { 32 | state, 33 | mutations, 34 | actions, 35 | getters, 36 | }; 37 | -------------------------------------------------------------------------------- /src/renderer/store/modules/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * The file enables `@/store/index.js` to import all vuex modules 3 | * in a one-shot manner. There should not be any reason to edit this file. 4 | */ 5 | 6 | const files = require.context('.', false, /\.js$/); 7 | const modules = {}; 8 | 9 | files.keys().forEach((key) => { 10 | if (key === './index.js') return; 11 | modules[key.replace(/(\.\/|\.js)/g, '')] = files(key).default; 12 | }); 13 | 14 | export default modules; 15 | -------------------------------------------------------------------------------- /src/renderer/store/modules/room.js: -------------------------------------------------------------------------------- 1 | import getRoomInfo from '@/util/Huya/roomInfo'; 2 | const state = { 3 | roomInfo: {}, // 是否自动 4 | roomId: 11342412, 5 | }; 6 | 7 | const mutations = { 8 | SET_ROOM_INFO(state, roomInfo) { 9 | state.roomInfo = roomInfo; 10 | }, 11 | SET_ROOMID(state, roomId) { 12 | state.roomId = roomId; 13 | }, 14 | }; 15 | 16 | const actions = { 17 | async getRoomInfo({ commit }, { roomId }) { 18 | const roomInfo = await getRoomInfo(roomId); 19 | commit('SET_ROOM_INFO', roomInfo); 20 | }, 21 | setRoomId({ commit }, roomId) { 22 | commit('SET_ROOMID', roomId); 23 | } 24 | }; 25 | 26 | const getters = { 27 | roomInfo: state => state.roomInfo, 28 | roomId: state => state.roomId, 29 | statInfo: state => (state.roomInfo && state.roomInfo.STATINFO) || {}, 30 | }; 31 | 32 | export default { 33 | state, 34 | mutations, 35 | actions, 36 | getters, 37 | }; 38 | -------------------------------------------------------------------------------- /src/renderer/util/Huya/emoji.js: -------------------------------------------------------------------------------- 1 | // 对应表情的字符串 2 | const emojiList = [ 3 | { 4 | key: 'dx', 5 | alt: '[大笑]', 6 | }, { 7 | key: 'sh', 8 | alt: '[送花]', 9 | }, { 10 | key: 'tx', 11 | alt: '[偷笑]', 12 | }, { 13 | key: 'dk', 14 | alt: '[大哭]', 15 | }, { 16 | key: 'hh', 17 | alt: '[嘿哈]', 18 | }, { 19 | key: '66', 20 | alt: '[666]', 21 | }, { 22 | key: 'gd', 23 | alt: '[感动]', 24 | }, { 25 | key: 'yw', 26 | alt: '[疑问]', 27 | }, { 28 | key: 'xh', 29 | alt: '[喜欢]', 30 | }, { 31 | key: 'jx', 32 | alt: '[奸笑]', 33 | }, { 34 | key: 'zan', 35 | alt: '[赞]', 36 | }, { 37 | key: 'ka', 38 | alt: '[可爱]', 39 | }, { 40 | key: 'am', 41 | alt: '[傲慢]', 42 | }, { 43 | key: 'kx', 44 | alt: '[开心]', 45 | }, { 46 | key: '88', 47 | alt: '[拜拜]', 48 | }, { 49 | key: 'hx', 50 | alt: '[害羞]', 51 | }, { 52 | key: 'zs', 53 | alt: '[衰]', 54 | }, { 55 | key: 'pu', 56 | alt: '[吐血]', 57 | }, { 58 | key: 'zc', 59 | alt: '[嘴馋]', 60 | }, { 61 | key: 'sq', 62 | alt: '[生气]', 63 | }, { 64 | key: 'fe', 65 | alt: '[扶额]', 66 | }, { 67 | key: 'bz', 68 | alt: '[闭嘴]', 69 | }, { 70 | key: 'kw', 71 | alt: '[枯萎]', 72 | }, { 73 | key: 'xu', 74 | alt: '[嘘]', 75 | }, { 76 | key: 'xk', 77 | alt: '[笑哭]', 78 | }, { 79 | key: 'lh', 80 | alt: '[流汗]', 81 | }, { 82 | key: 'bk', 83 | alt: '[不看]', 84 | }, { 85 | key: 'hq', 86 | alt: '[哈欠]', 87 | }, { 88 | key: 'tp', 89 | alt: '[调皮]', 90 | }, { 91 | key: 'gl', 92 | alt: '[鬼脸]', 93 | }, { 94 | key: 'cl', 95 | alt: '[戳脸]', 96 | }, { 97 | key: 'dg', 98 | alt: '[大哥]', 99 | }, { 100 | key: 'kun', 101 | alt: '[困]', 102 | }, { 103 | key: 'yb', 104 | alt: '[拥抱]', 105 | }, { 106 | key: 'zt', 107 | alt: '[猪头]', 108 | }, { 109 | key: 'kl', 110 | alt: '[骷髅]', 111 | }, { 112 | key: 'cc', 113 | alt: '[臭臭]', 114 | }, { 115 | key: 'xd', 116 | alt: '[心动]', 117 | }, { 118 | key: 'dao', 119 | alt: '[刀]', 120 | }]; 121 | 122 | const emojiKeys = emojiList.map(item => item.key); 123 | 124 | const emojiMap = {}; 125 | emojiList.forEach((item) => { emojiMap[item.key] = item.alt; }); 126 | 127 | const emojiRegexp = new RegExp(`/{(${emojiKeys.join('|')})`, 'g'); 128 | 129 | // 不知道是对应什么的 130 | // eslint-disable-next-line no-unused-vars 131 | const unknownMap = [ 132 | { 133 | key: 'wx', 134 | alt: '[微笑]', 135 | }, { 136 | key: 'll', 137 | alt: '[流泪]', 138 | }, { 139 | key: 'dy', 140 | alt: '[得意]', 141 | }, { 142 | key: 'jy', 143 | alt: '[惊讶]', 144 | }, { 145 | key: 'pz', 146 | alt: '[撇嘴]', 147 | }, { 148 | key: 'yun', 149 | alt: '[晕]', 150 | }, { 151 | key: 'ng', 152 | alt: '[难过]', 153 | }, { 154 | key: 'se', 155 | alt: '[色]', 156 | }, { 157 | key: 'cy', 158 | alt: '[抽烟]', 159 | }, { 160 | key: 'qd', 161 | alt: '[敲打]', 162 | }, { 163 | key: 'mg', 164 | alt: '[玫瑰]', 165 | }, { 166 | key: 'wen', 167 | alt: '[吻]', 168 | }, { 169 | key: 'xs', 170 | alt: '[心碎]', 171 | }, { 172 | key: 'zd', 173 | alt: '[炸弹]', 174 | }, { 175 | key: 'sj', 176 | alt: '[睡觉]', 177 | }, { 178 | key: 'hk', 179 | alt: '[很酷]', 180 | }, { 181 | key: 'by', 182 | alt: '[白眼]', 183 | }, { 184 | key: 'ot', 185 | alt: '[呕吐]', 186 | }, { 187 | key: 'fd', 188 | alt: '[奋斗]', 189 | }, { 190 | key: 'kz', 191 | alt: '[口罩]', 192 | }, { 193 | key: 'hp', 194 | alt: '[害怕]', 195 | }, { 196 | key: 'dai', 197 | alt: '[发呆]', 198 | }, { 199 | key: 'fn', 200 | alt: '[发怒]', 201 | }, { 202 | key: 'ruo', 203 | alt: '[弱]', 204 | }, { 205 | key: 'ws', 206 | alt: '[握手]', 207 | }, { 208 | key: 'sl', 209 | alt: '[胜利]', 210 | }, { 211 | key: 'lw', 212 | alt: '[礼物]', 213 | }, { 214 | key: 'sd', 215 | alt: '[闪电]', 216 | }, { 217 | key: 'gz', 218 | alt: '[鼓掌]', 219 | }, { 220 | key: 'qq', 221 | alt: '[亲亲]', 222 | }, { 223 | key: 'kb', 224 | alt: '[抠鼻]', 225 | }, { 226 | key: 'wq', 227 | alt: '[委屈]', 228 | }, { 229 | key: 'yx', 230 | alt: '[阴险]', 231 | }, { 232 | key: 'kel', 233 | alt: '[可怜]', 234 | }, { 235 | key: 'bs', 236 | alt: '[鄙视]', 237 | }, { 238 | key: 'zk', 239 | alt: '[抓狂]', 240 | }, { 241 | key: 'bq', 242 | alt: '[抱拳]', 243 | }, { 244 | key: 'ok', 245 | alt: '[OK]', 246 | }]; 247 | 248 | export default function parseMessage(msg) { 249 | const strList = msg.split(emojiRegexp); 250 | const result = []; 251 | strList.forEach((str, index) => { 252 | if (index % 2 === 0 && str) { 253 | // 避免返回空字符串 254 | result.push({ 255 | type: 'text', 256 | content: str, 257 | }); 258 | } else if (index % 2 === 1) { 259 | result.push({ 260 | type: 'emoji', 261 | src: `https://a.msstatic.com/huya/main/emot_png/${str}.png`, 262 | alt: emojiMap[str], 263 | }); 264 | } 265 | }); 266 | return result; 267 | } 268 | -------------------------------------------------------------------------------- /src/renderer/util/Huya/roomInfo.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | 3 | function parseRoomInfo(html) { 4 | // 解析html, 截取出所需要的js脚本里的内容 5 | // 使用 Function 运行 6 | const valScript = new RegExp('([^<]*?全局js[\\s\\S]*?)', 'g').exec(html)[1]; 7 | const valNameList = valScript.match(/var [_a-zA-Z0-9]+(?=\s?=)/g); 8 | const returnScript = `return {${valNameList.map(item => item.replace('var ', '')).join(',')}};`; 9 | const f = new Function(valScript + returnScript); 10 | return f(); 11 | } 12 | 13 | function getRoomInfo(rId) { 14 | return new Promise((resolve, reject) => { 15 | axios.get(`https://m.huya.com/${rId}`) 16 | .then((res) => { 17 | const roomInfo = parseRoomInfo(res.data); 18 | resolve(roomInfo); 19 | }) 20 | .catch((err) => { 21 | reject(err); 22 | }); 23 | }); 24 | } 25 | 26 | export default getRoomInfo; 27 | -------------------------------------------------------------------------------- /src/renderer/util/Huya/socket.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | import mitt from 'mitt'; 3 | import { server } from 'root/config'; 4 | 5 | function HuyaSocket(doName, roomId) { 6 | const mitter = mitt(); 7 | this.on = mitter.on; 8 | 9 | axios.get(`${server.host}/${doName}/${roomId}`) 10 | .then((res) => { 11 | const url = res.data; 12 | const socket = new WebSocket(url); 13 | let timer = null; 14 | socket.onopen = (event) => { 15 | mitter.emit('success', event); 16 | timer = setInterval(() => { 17 | socket.send('ping'); 18 | }, 15000); 19 | }; 20 | 21 | socket.onmessage = (event) => { 22 | const json = JSON.parse(event.data); 23 | if (json.statusCode === 200) { 24 | mitter.emit('message', json.data); 25 | } else { 26 | // 错误处理 27 | mitter.emit('errorMessage', json); 28 | } 29 | }; 30 | 31 | socket.onerror = (err) => { 32 | mitter.emit('error', err); 33 | }; 34 | 35 | socket.onclose = (e) => { 36 | clearInterval(timer); 37 | mitter.emit('close', e); 38 | }; 39 | 40 | this.close = socket.close.bind(socket); 41 | }) 42 | .catch((err) => { 43 | mitter.emit('fail', err); 44 | }); 45 | } 46 | 47 | HuyaSocket.apiList = { 48 | getMessageNotice: '普通弹幕接口', 49 | getSendItemNotice: '礼物接口', 50 | getVipEnterBannerNotice: '高级用户进场信息接口', 51 | }; 52 | 53 | HuyaSocket.BARRAGE_MSG = 'getMessageNotice'; 54 | HuyaSocket.GIFT_MSG = 'getSendItemNotice'; 55 | HuyaSocket.VIP_MSG = 'getVipEnterBannerNotice'; 56 | 57 | // 所有事件 58 | // 普通弹幕接口、礼物接口、高级用户接口 59 | HuyaSocket.eventList = { 60 | success: '连接成功', 61 | fail: '连接失败', 62 | message: '收到正常消息', 63 | errorMessage: '收到错误消息', 64 | error: '发生错误', 65 | close: '关闭事件', 66 | }; 67 | export default HuyaSocket; 68 | -------------------------------------------------------------------------------- /src/renderer/util/baiduTTS.js: -------------------------------------------------------------------------------- 1 | let audio; 2 | let ended = true; 3 | let list = []; 4 | let timer = null; 5 | 6 | function read(str) { 7 | ended = false; 8 | const url = `http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&text=${encodeURI(str)}`; 9 | if (!audio) { 10 | audio = new Audio(); 11 | audio.autoplay = true; 12 | audio.addEventListener('ended', onEnded); 13 | } 14 | audio.src = url; 15 | timeout(); 16 | } 17 | 18 | function onEnded() { 19 | ended = true; 20 | if (timer) { 21 | clearTimeout(timer); 22 | } 23 | if (list.length !== 0) { 24 | read(list.shift()); 25 | } 26 | } 27 | 28 | function timeout() { 29 | timer = setTimeout(() => { 30 | timer = null; 31 | onEnded(); 32 | }, 10000); 33 | } 34 | 35 | export default function addToList(str) { 36 | if (!ended) { 37 | if (list.length > 10) list.shift(); 38 | list.push(str); 39 | } else { 40 | list = []; 41 | read(str); 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /src/renderer/util/ipc.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | // // console.log(ipcRenderer.sendSync('synchronous-message', 'ping')); // prints "pong" 3 | // // 4 | // // ipcRenderer.on('asynchronous-reply', (event, arg) => { 5 | // // console.log(arg); // prints "pong" 6 | // // }); 7 | // // ipcRenderer.send('asynchronous-message', 'ping'); 8 | // 9 | function ipcRenderer() { 10 | return Vue.prototype.$electron.ipcRenderer; 11 | } 12 | 13 | function stickMainWindow(stick) { 14 | ipcRenderer().send('stick-mainWindow', { stick }); 15 | } 16 | 17 | function closeMainWindow() { 18 | ipcRenderer().send('close-mainWindow'); 19 | } 20 | 21 | export { stickMainWindow, closeMainWindow }; 22 | -------------------------------------------------------------------------------- /src/renderer/views/huya/BarrageList.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 72 | 73 | 98 | -------------------------------------------------------------------------------- /src/renderer/views/huya/BarrageList/BarrageItem.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 23 | 24 | 39 | -------------------------------------------------------------------------------- /src/renderer/views/huya/BarrageList/HuyaEmoji.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 47 | 48 | 51 | -------------------------------------------------------------------------------- /src/renderer/views/huya/BarrageList/ListHeader.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 48 | 49 | 99 | -------------------------------------------------------------------------------- /src/renderer/views/index/Index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 41 | 42 | 69 | -------------------------------------------------------------------------------- /src/renderer/views/setting/Setting.vue: -------------------------------------------------------------------------------- 1 | 29 | 30 | 65 | 66 | 117 | -------------------------------------------------------------------------------- /static/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/WozHuang/Barrage-helper/ec8f8bdd41da2760b6d214f1fad6716cca34ad27/static/.gitkeep -------------------------------------------------------------------------------- /test/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "mocha": true 4 | }, 5 | "globals": { 6 | "assert": true, 7 | "expect": true, 8 | "should": true, 9 | "__static": true 10 | }, 11 | "rules": { 12 | "func-names": 0, 13 | "prefer-arrow-callback": 0 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /test/unit/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | Vue.config.devtools = false 3 | Vue.config.productionTip = false 4 | 5 | // require all test files (files that ends with .spec.js) 6 | const testsContext = require.context('./specs', true, /\.spec$/) 7 | testsContext.keys().forEach(testsContext) 8 | 9 | // require all src files except main.js for coverage. 10 | // you can also change this to match only the subset of files that 11 | // you want coverage for. 12 | const srcContext = require.context('../../src/renderer', true, /^\.\/(?!main(\.js)?$)/) 13 | srcContext.keys().forEach(srcContext) 14 | -------------------------------------------------------------------------------- /test/unit/karma.conf.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | const path = require('path') 4 | const merge = require('webpack-merge') 5 | const webpack = require('webpack') 6 | 7 | const baseConfig = require('../../.electron-vue/webpack.renderer.config') 8 | const projectRoot = path.resolve(__dirname, '../../src/renderer') 9 | 10 | // Set BABEL_ENV to use proper preset config 11 | process.env.BABEL_ENV = 'test' 12 | 13 | let webpackConfig = merge(baseConfig, { 14 | devtool: '#inline-source-map', 15 | plugins: [ 16 | new webpack.DefinePlugin({ 17 | 'process.env.NODE_ENV': '"testing"' 18 | }) 19 | ] 20 | }) 21 | 22 | // don't treat dependencies as externals 23 | delete webpackConfig.entry 24 | delete webpackConfig.externals 25 | delete webpackConfig.output.libraryTarget 26 | 27 | // apply vue option to apply isparta-loader on js 28 | webpackConfig.module.rules 29 | .find(rule => rule.use.loader === 'vue-loader').use.options.loaders.js = 'babel-loader' 30 | 31 | module.exports = config => { 32 | config.set({ 33 | browsers: ['visibleElectron'], 34 | client: { 35 | useIframe: false 36 | }, 37 | coverageReporter: { 38 | dir: './coverage', 39 | reporters: [ 40 | { type: 'lcov', subdir: '.' }, 41 | { type: 'text-summary' } 42 | ] 43 | }, 44 | customLaunchers: { 45 | 'visibleElectron': { 46 | base: 'Electron', 47 | flags: ['--show'] 48 | } 49 | }, 50 | frameworks: ['mocha', 'chai'], 51 | files: ['./index.js'], 52 | preprocessors: { 53 | './index.js': ['webpack', 'sourcemap'] 54 | }, 55 | reporters: ['spec', 'coverage'], 56 | singleRun: true, 57 | webpack: webpackConfig, 58 | webpackMiddleware: { 59 | noInfo: true 60 | } 61 | }) 62 | } 63 | -------------------------------------------------------------------------------- /test/unit/specs/LandingPage.spec.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import LandingPage from '@/components/LandingPage'; 3 | 4 | describe('LandingPage.vue', () => { 5 | it('should render correct contents', () => { 6 | const vm = new Vue({ 7 | el: document.createElement('div'), 8 | render: h => h(LandingPage), 9 | }).$mount(); 10 | 11 | expect(vm.$el.querySelector('.title').textContent).to.contain('Welcome to your new project!'); 12 | }); 13 | }); 14 | --------------------------------------------------------------------------------