Update winscope dependencies

Upgrade to webpack4, vue 2.6, and kotlin 1.5

Update all other dev dependencies to their latest versions due to
deprecation or security warnings

Bug: 185516271
Test: yarn install && yarn run dev (or yarn build) && test winscope
Change-Id: Ife8544f8da50782565f34436b0a1a284101654aa

tools/winscope/package.json

@@ -5,60 +5,61 @@
   "author": "Adrian Roos <roosa@google.com>",
   "private": true,
   "scripts": {
-    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
-    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
-    "test": "webpack --config webpack.spec.config.js && jasmine dist/bundleSpec.js"
+    "dev": "cross-env NODE_ENV=development webpack serve --open --hot",
+    "build": "cross-env NODE_ENV=production webpack --progress",
+    "test": "webpack --config webpack.spec.config.js && jasmine dist/bundleSpec.js",
+    "prepare": "cd ../../ && husky install tools/winscope"
   },
   "dependencies": {
-    "cross-env": "^7.0.2",
-    "jszip": "^3.5.0",
-    "kotlin": "^1.3.72",
+    "cross-env": "^7.0.3",
+    "jszip": "^3.6.0",
+    "kotlin": "^1.5.21",
     "lodash.clonedeep": "^4.5.0",
-    "ts-loader": "^8.0.3",
-    "typescript": "^4.0.2",
-    "vue": "^2.3.3",
-    "vue-context": "^5.2.0",
-    "vue-material": "^1.0.0-beta-11",
-    "vuex": "^3.4.0"
+    "ts-loader": "^8.3.0",
+    "typescript": "^4.3.5",
+    "vue": "^2.6.14",
+    "vue-context": "^6.0.0",
+    "vue-material": "^1.0.0-beta-15",
+    "vuex": "^3.6.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.10.5",
-    "@babel/polyfill": "^7.10.4",
-    "@babel/preset-env": "^7.10.4",
-    "@babel/register": "^7.10.5",
+    "@babel/core": "^7.14.6",
+    "@babel/polyfill": "^7.12.1",
+    "@babel/preset-env": "^7.14.7",
+    "@babel/register": "^7.14.5",
     "@jetbrains/kotlin-webpack-plugin": "^3.0.2",
-    "@testing-library/vue": "^5.1.0",
-    "@types/lodash": "^4.14.158",
-    "babel-loader": "^8.1.0",
-    "compression-webpack-plugin": "^4.0.0",
-    "cross-env": "^7.0.2",
-    "css-loader": "^3.6.0",
-    "eslint": "^7.1.0",
+    "@testing-library/vue": "^5.8.1",
+    "@types/lodash": "^4.14.171",
+    "babel-loader": "^8.2.2",
+    "compression-webpack-plugin": "^6.1.1",
+    "cross-env": "^7.0.3",
+    "css-loader": "^5.2.7",
+    "eslint": "^7.30.0",
     "eslint-config-google": "^0.14.0",
-    "eslint-plugin-vue": "^6.2.2",
-    "file-loader": "^6.0.0",
+    "eslint-plugin-vue": "^7.13.0",
+    "file-loader": "^6.2.0",
     "friendly-errors-webpack-plugin": "^1.7.0",
-    "html-webpack-inline-source-plugin": "^0.0.10",
-    "html-webpack-plugin": "3.2.0",
-    "husky": "^4.2.5",
-    "jasmine": "^3.5.0",
-    "lint-staged": ">=10",
+    "html-webpack-inline-source-plugin": "^1.0.0-beta.2",
+    "html-webpack-plugin": "4.5.2",
+    "husky": "^7.0.0",
+    "jasmine": "^3.8.0",
+    "lint-staged": "^11.0.1",
     "loader-utils": "^2.0.0",
-    "mini-css-extract-plugin": "^0.9.0",
+    "mini-css-extract-plugin": "^1.6.2",
     "optimize-css-assets-webpack-plugin": "^5.0.3",
-    "protobufjs": "^6.10.0",
-    "source-map-loader": "^1.0.1",
-    "style-loader": "^1.2.1",
-    "ts-loader": "^8.0.1",
-    "typescript": "^3.9.7",
+    "protobufjs": "^6.11.2",
+    "source-map-loader": "^1.1.3",
+    "style-loader": "^2.0.0",
+    "ts-loader": "^8.3.0",
+    "typescript": "^4.3.5",
     "uglifyjs-webpack-plugin": "^2.2.0",
-    "vue-loader": "^15.9.3",
-    "vue-style-loader": "^4.1.2",
-    "vue-template-compiler": "^2.6.11",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.0",
-    "webpack-merge": "^5.0.9"
+    "vue-loader": "^15.9.2",
+    "vue-style-loader": "^4.1.3",
+    "vue-template-compiler": "^2.6.14",
+    "webpack": "^4.46.0",
+    "webpack-cli": "^4.7.2",
+    "webpack-dev-server": "^3.11.2",
+    "webpack-merge": "^5.8.0"
   },
   "husky": {
     "hooks": {

tools/winscope/src/NodeContextMenu.vue

@@ -1,10 +1,6 @@
 <template>
   <vue-context ref="menu">
-    <li>
-      <a href="#" @click.prevent="$emit('collapseAllOtherNodes')">
-        Collapse all other nodes
-      </a>
-    </li>
+
   </vue-context>
 </template>
 

tools/winscope/webpack.config.common.js

@@ -19,7 +19,7 @@
 const path = require('path');
 const fs = require('fs');
 
-const VueLoaderPlugin = require('vue-loader/lib/plugin');
+const { VueLoaderPlugin } = require("vue-loader")
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const KotlinWebpackPlugin = require('@jetbrains/kotlin-webpack-plugin');
 const HtmlWebpackInlineSourcePlugin =
@@ -129,7 +129,7 @@ const webpackConfig = {
       inlineSource: isDev ? false : '.(js|css)',
       template: 'src/index_template.html',
     }),
-    new HtmlWebpackInlineSourcePlugin(),
+    new HtmlWebpackInlineSourcePlugin(HtmlWebpackPlugin),
     new KotlinWebpackPlugin({
       src: [
         path.join(__dirname, '../../../platform_testing/libraries/flicker/' +