Clean up and refactor VSCode integration

.editorconfig

@@ -3,4 +3,9 @@ root = true
 [*]
 indent_style = space
 trim_trailing_whitespace = true
+
+# The indent size used in the `package.json` file cannot be changed
+# https://github.com/npm/npm/pull/3180#issuecomment-16336516
+[{*.yml,*.yaml,package.json}]
+indent_style = space
 indent_size = 2

.github/workflows/ci.yaml

@@ -54,10 +54,6 @@ jobs:
         run: yarn lint
         if: success()
 
-      - name: Run code-server unit tests
-        run: yarn test:unit
-        if: success()
-
       - name: Upload coverage report to Codecov
         run: yarn coverage
         if: success()
@@ -408,6 +404,9 @@ jobs:
           rm -r node_modules/playwright
           yarn install --check-files
 
+      - name: Run end-to-end tests
+        run: yarn test:unit
+
       - name: Run end-to-end tests
         run: yarn test:e2e
 

.gitignore

@@ -12,6 +12,7 @@ vendor/modules
 node-*
 /plugins
 /lib/coder-cloud-agent
+/lib/linkup
 .home
 coverage
 **/.DS_Store

.prettierrc.yaml

@@ -2,3 +2,16 @@ printWidth: 120
 semi: false
 trailingComma: all
 arrowParens: always
+singleQuote: false
+useTabs: false
+
+overrides:
+  # Attempt to keep VScode's existing code style intact.
+  - files: "vendor/modules/code-oss-dev/**/*.ts"
+    options:
+      # No limit defined upstream.
+      printWidth: 10000
+      semi: true
+      singleQuote: true
+      useTabs: true
+      arrowParens: avoid

ci/build/build-code-server.sh

@@ -15,23 +15,28 @@ main() {
     chmod +x out/node/entry.js
   fi
 
+  # for arch; we do not use OS from lib.sh and get our own.
+  # lib.sh normalizes macos to darwin - but cloud-agent's binaries do not
+  source ./ci/lib.sh
+  OS="$(uname | tr '[:upper:]' '[:lower:]')"
+
   if ! [ -f ./lib/coder-cloud-agent ]; then
     echo "Downloading the cloud agent..."
 
-    # for arch; we do not use OS from lib.sh and get our own.
-    # lib.sh normalizes macos to darwin - but cloud-agent's binaries do not
-    source ./ci/lib.sh
-    OS="$(uname | tr '[:upper:]' '[:lower:]')"
-
     set +e
     curl -fsSL "https://github.com/cdr/cloud-agent/releases/latest/download/cloud-agent-$OS-$ARCH" -o ./lib/coder-cloud-agent
     chmod +x ./lib/coder-cloud-agent
     set -e
   fi
 
-  yarn browserify out/browser/register.js -o out/browser/register.browserified.js
-  yarn browserify out/browser/pages/login.js -o out/browser/pages/login.browserified.js
-  yarn browserify out/browser/pages/vscode.js -o out/browser/pages/vscode.browserified.js
+  if ! [ -f ./lib/linkup ]; then
+    echo "Downloading Link agent..."
+
+    set +e
+    curl -fsSL "https://storage.googleapis.com/coder-link-releases/latest/linkup-$OS-$ARCH" -o ./lib/linkup
+    chmod +x ./lib/linkup
+    set -e
+  fi
 }
 
 main "$@"

ci/build/build-release.sh

@@ -61,6 +61,7 @@ EOF
     rsync node_modules/ "$RELEASE_PATH/node_modules"
     mkdir -p "$RELEASE_PATH/lib"
     rsync ./lib/coder-cloud-agent "$RELEASE_PATH/lib"
+    rsync ./lib/linkup "$RELEASE_PATH/lib"
   fi
 }
 
@@ -80,8 +81,8 @@ bundle_vscode() {
   rsync "$VSCODE_SRC_PATH/extensions/postinstall.js" "$VSCODE_OUT_PATH/extensions"
 
   mkdir -p "$VSCODE_OUT_PATH/resources/"{linux,web}
-  rsync "$VSCODE_SRC_PATH/resources/linux/code.png" "$VSCODE_OUT_PATH/resources/linux/code.png"
-  rsync "$VSCODE_SRC_PATH/resources/web/callback.html" "$VSCODE_OUT_PATH/resources/web/callback.html"
+  rsync "$VSCODE_SRC_PATH/resources/linux/" "$VSCODE_OUT_PATH/resources/linux/"
+  rsync "$VSCODE_SRC_PATH/resources/web/" "$VSCODE_OUT_PATH/resources/web/"
 
   # Add the commit and date and enable telemetry. This just makes telemetry
   # available; telemetry can still be disabled by flag or setting.

ci/build/build-vscode.sh

@@ -11,8 +11,10 @@ main() {
 
   cd vendor/modules/code-oss-dev
 
-  yarn gulp compile-build compile-extensions-build compile-extension-media
+  yarn gulp compile-build compile-extensions-build compile-extension-media compile-web
+
   yarn gulp optimize --gulpfile ./coder.js
+
   if [[ $MINIFY ]]; then
     yarn gulp minify --gulpfile ./coder.js
   fi

ci/build/npm-postinstall.sh

@@ -63,6 +63,12 @@ main() {
     echo "Failed to download cloud agent; --link will not work"
   fi
 
+  if curl -fsSL "https://storage.googleapis.com/coder-link-releases/latest/linkup-$OS-$ARCH" -o ./lib/linkup; then
+    chmod +x ./lib/linkup
+  else
+    echo "Failed to download Link agent; the Link extension will not work"
+  fi
+
   if ! vscode_yarn; then
     echo "You may not have the required dependencies to build the native modules."
     echo "Please see https://github.com/cdr/code-server/blob/master/docs/npm.md"

ci/dev/watch.ts

@@ -1,14 +1,12 @@
-import browserify from "browserify"
 import * as cp from "child_process"
-import * as fs from "fs"
 import * as path from "path"
 import { onLine } from "../../src/node/util"
 
 async function main(): Promise<void> {
   try {
     const watcher = new Watcher()
     await watcher.watch()
-  } catch (error) {
+  } catch (error: any) {
     console.error(error.message)
     process.exit(1)
   }
@@ -38,6 +36,9 @@ class Watcher {
     }
 
     const vscode = cp.spawn("yarn", ["watch"], { cwd: this.vscodeSourcePath })
+
+    const vscodeWebExtensions = cp.spawn("yarn", ["watch-web"], { cwd: this.vscodeSourcePath })
+
     const tsc = cp.spawn("tsc", ["--watch", "--pretty", "--preserveWatchOutput"], { cwd: this.rootPath })
     const plugin = process.env.PLUGIN_DIR
       ? cp.spawn("yarn", ["build", "--watch"], { cwd: process.env.PLUGIN_DIR })
@@ -48,6 +49,10 @@ class Watcher {
       vscode.removeAllListeners()
       vscode.kill()
 
+      Watcher.log("killing vs code web extension watcher")
+      vscodeWebExtensions.removeAllListeners()
+      vscodeWebExtensions.kill()
+
       Watcher.log("killing tsc")
       tsc.removeAllListeners()
       tsc.kill()
@@ -75,29 +80,32 @@ class Watcher {
       Watcher.log("vs code watcher terminated unexpectedly")
       cleanup(code)
     })
+
+    vscodeWebExtensions.on("exit", (code) => {
+      Watcher.log("vs code extension watcher terminated unexpectedly")
+      cleanup(code)
+    })
+
     tsc.on("exit", (code) => {
       Watcher.log("tsc terminated unexpectedly")
       cleanup(code)
     })
+
     if (plugin) {
       plugin.on("exit", (code) => {
         Watcher.log("plugin terminated unexpectedly")
         cleanup(code)
       })
     }
 
+    vscodeWebExtensions.stderr.on("data", (d) => process.stderr.write(d))
     vscode.stderr.on("data", (d) => process.stderr.write(d))
     tsc.stderr.on("data", (d) => process.stderr.write(d))
+
     if (plugin) {
       plugin.stderr.on("data", (d) => process.stderr.write(d))
     }
 
-    const browserFiles = [
-      path.join(this.rootPath, "out/browser/register.js"),
-      path.join(this.rootPath, "out/browser/pages/login.js"),
-      path.join(this.rootPath, "out/browser/pages/vscode.js"),
-    ]
-
     let startingVscode = false
     let startedVscode = false
     onLine(vscode, (line, original) => {
@@ -120,7 +128,6 @@ class Watcher {
         console.log("[tsc]", original)
       }
       if (line.includes("Watching for file changes")) {
-        bundleBrowserCode(browserFiles)
         restartServer()
       }
     })
@@ -139,19 +146,4 @@ class Watcher {
   }
 }
 
-function bundleBrowserCode(inputFiles: string[]) {
-  console.log(`[browser] bundling...`)
-  inputFiles.forEach(async (path: string) => {
-    const outputPath = path.replace(".js", ".browserified.js")
-    browserify()
-      .add(path)
-      .bundle()
-      .on("error", function (error: Error) {
-        console.error(error.toString())
-      })
-      .pipe(fs.createWriteStream(outputPath))
-  })
-  console.log(`[browser] done bundling`)
-}
-
 main()

package.json

@@ -35,8 +35,6 @@
   "main": "out/node/entry.js",
   "devDependencies": {
     "@schemastore/package": "^0.0.6",
-    "@types/body-parser": "^1.19.0",
-    "@types/browserify": "^12.0.36",
     "@types/compression": "^1.7.0",
     "@types/cookie-parser": "^1.4.2",
     "@types/express": "^4.17.8",
@@ -48,13 +46,11 @@
     "@types/safe-compare": "^1.1.0",
     "@types/semver": "^7.1.0",
     "@types/split2": "^3.2.0",
-    "@types/tar-fs": "^2.0.0",
-    "@types/tar-stream": "^2.1.0",
+    "@types/trusted-types": "^2.0.2",
     "@types/ws": "^8.0.0",
     "@typescript-eslint/eslint-plugin": "^4.7.0",
     "@typescript-eslint/parser": "^4.7.0",
     "audit-ci": "^4.0.0",
-    "browserify": "^17.0.0",
     "codecov": "^3.8.3",
     "doctoc": "^2.0.0",
     "eslint": "^7.7.0",
@@ -68,7 +64,7 @@
     "stylelint": "^13.0.0",
     "stylelint-config-recommended": "^5.0.0",
     "ts-node": "^10.0.0",
-    "typescript": "^4.1.3"
+    "typescript": "^4.4.0-dev.20210528"
   },
   "resolutions": {
     "ansi-regex": "^5.0.1",
@@ -85,7 +81,6 @@
   "dependencies": {
     "@coder/logger": "1.1.16",
     "argon2": "^0.28.0",
-    "body-parser": "^1.19.0",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.5",
     "env-paths": "^2.2.0",
@@ -103,7 +98,6 @@
     "safe-compare": "^1.1.4",
     "semver": "^7.1.3",
     "split2": "^3.2.2",
-    "tar-fs": "^2.0.0",
     "ws": "^8.0.0",
     "xdg-basedir": "^4.0.0",
     "yarn": "^1.22.4"

src/browser/pages/error.html

@@ -10,10 +10,11 @@
       http-equiv="Content-Security-Policy"
       content="style-src 'self'; manifest-src 'self'; img-src 'self' data:; font-src 'self' data:;"
     />
+
     <title>{{ERROR_TITLE}} - code-server</title>
     <link rel="icon" href="{{CS_STATIC_BASE}}/src/browser/media/favicon-dark-support.svg" />
     <link rel="alternate icon" href="{{CS_STATIC_BASE}}/src/browser/media/favicon.ico" />
-    <link rel="manifest" href="{{CS_STATIC_BASE}}/src/browser/media/manifest.json" crossorigin="use-credentials" />
+    <link rel="manifest" href="/manifest.json" crossorigin="use-credentials" />
     <link rel="apple-touch-icon" sizes="192x192" href="{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-192.png" />
     <link rel="apple-touch-icon" sizes="512x512" href="{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-512.png" />
     <link href="{{CS_STATIC_BASE}}/src/browser/pages/global.css" rel="stylesheet" />
@@ -30,6 +31,5 @@ <h2 class="header">{{ERROR_HEADER}}</h2>
         </div>
       </div>
     </div>
-    <script data-cfasync="false" src="{{CS_STATIC_BASE}}/out/browser/register.browserified.js"></script>
   </body>
 </html>

src/browser/pages/login.html

@@ -13,7 +13,7 @@
     <title>code-server login</title>
     <link rel="icon" href="{{CS_STATIC_BASE}}/src/browser/media/favicon-dark-support.svg" />
     <link rel="alternate icon" href="{{CS_STATIC_BASE}}/src/browser/media/favicon.ico" />
-    <link rel="manifest" href="{{CS_STATIC_BASE}}/src/browser/media/manifest.json" crossorigin="use-credentials" />
+    <link rel="manifest" href="{{BASE}}/manifest.json" crossorigin="use-credentials" />
     <link rel="apple-touch-icon" sizes="192x192" href="{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-192.png" />
     <link rel="apple-touch-icon" sizes="512x512" href="{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-512.png" />
     <link href="{{CS_STATIC_BASE}}/src/browser/pages/global.css" rel="stylesheet" />
@@ -30,7 +30,6 @@ <h1 class="main">Welcome to code-server</h1>
         <div class="content">
           <form class="login-form" method="post">
             <input class="user" type="text" autocomplete="username" />
-            <input id="base" type="hidden" name="base" value="/" />
             <div class="field">
               <input
                 required
@@ -49,5 +48,4 @@ <h1 class="main">Welcome to code-server</h1>
       </div>
     </div>
   </body>
-  <script data-cfasync="false" src="{{CS_STATIC_BASE}}/out/browser/pages/login.browserified.js"></script>
 </html>