Add infrastructure for VS Code extension tests (#757)

Author: juliasilge

.github/workflows/ci.yaml renamed to .github/workflows/build.yaml

@@ -0,0 +1,31 @@
+
+name: Test VS Code Extension
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+  workflow_dispatch:
+
+jobs:
+  test-extension:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: latest
+
+      - name: Update build environment and install XVFB
+        run: |
+          sudo apt-get -y update
+          sudo apt-get -y install --fix-missing xvfb
+
+      - name: Compile and run tests
+        run: |
+          yarn install --immutable --immutable-cache --check-cache
+          xvfb-run yarn test-vscode

.github/workflows/test.yaml

@@ -15,3 +15,5 @@ public/dist
 .luarc.json
 .ipynb_checkpoints
 /.luarc.json
+.vscode-test
+*.vsix

.gitignore

@@ -1,2 +1,3 @@
 out/
 *.vsix
+test-out/

apps/vscode/.gitignore

@@ -0,0 +1,8 @@
+import { defineConfig } from '@vscode/test-cli';
+
+export default defineConfig([
+  {
+    files: 'test-out/*.test.js',
+    workspaceFolder: 'src/test/examples',
+  },
+]);

apps/vscode/.vscode-test.mjs

@@ -7,14 +7,19 @@ yarn             # install dependencies
 yarn dev-vscode  # run development/debug version of extension
 ```
 
+Run the extension tests with:
+
+```sh
+yarn test-vscode # compile the test files and run them with the vscode-test CLI
+```
+
 Install the dev version of the extension in VS Code or Positron with:
 
 ```sh
 yarn install-vscode
 yarn install-positron
 ```
 
-
 # Debugging the extension
 
 The extension must have been built in dev mode (see the build section). The `dev` build flag is essential for debugging:

apps/vscode/CONTRIBUTING.md

@@ -14,14 +14,25 @@
  */
 
 import { runBuild } from "build";
+import * as glob from "glob";
 
 const args = process.argv;
 const dev = args[2] === "dev";
+const test = args[2] === "test";
+const testFiles = glob.sync("src/test/*.ts");
 
-runBuild({
+const testBuildOptions = {
+  entryPoints: testFiles,
+  outdir: 'test-out',
+  external: ['vscode'],
+};
+
+const defaultBuildOptions = {
   entryPoints: ['./src/main.ts'],
   outfile: './out/main.js',
   external: ['vscode'],
   minify: !dev,
   dev
-});
+};
+
+runBuild(test ? testBuildOptions : defaultBuildOptions);

apps/vscode/build.ts

@@ -1426,7 +1426,8 @@
     "build": "tsx build.ts",
     "dev": "yarn run build dev",
     "lint": "eslint src --ext ts",
-    "build-lang": "node syntaxes/build-lang"
+    "build-lang": "node syntaxes/build-lang",
+    "test": "yarn run build test && vscode-test"
   },
   "dependencies": {
     "axios": "^1.2.1",
@@ -1435,6 +1436,7 @@
     "editor-core": "*",
     "editor-server": "*",
     "editor-types": "*",
+    "glob": "^11.0.3",
     "highlight.js": "^11.7.0",
     "js-yaml": "^4.1.0",
     "lodash.debounce": "^4.0.8",
@@ -1472,7 +1474,8 @@
     "@types/which": "^2.0.2",
     "@typescript-eslint/eslint-plugin": "^5.45.0",
     "@typescript-eslint/parser": "^5.45.0",
-    "@vscode/test-electron": "^2.2.0",
+    "@vscode/test-cli": "^0.0.11",
+    "@vscode/test-electron": "^2.5.2",
     "@vscode/vsce": "^2.15.0",
     "build": "*",
     "esbuild": "^0.16.7",

apps/vscode/package.json

@@ -0,0 +1,10 @@
+---
+title: "Hello, Quarto"
+format: html
+---
+
+## Header
+
+```{python}
+1 + 1
+```

apps/vscode/src/test/examples/hello.qmd

@@ -0,0 +1,13 @@
+import * as vscode from "vscode";
+import * as assert from "assert";
+import { exampleWorkspacePath } from "./test-utils";
+import { isQuartoDoc } from "../core/doc";
+
+suite("Quarto basics", () => {
+  test("Can open a Quarto document", async () => {
+    const doc = await vscode.workspace.openTextDocument(exampleWorkspacePath("hello.qmd"));
+    const editor = await vscode.window.showTextDocument(doc);
+    assert.strictEqual(editor?.document.languageId, "quarto");
+    assert.strictEqual(isQuartoDoc(editor?.document), true);
+  });
+});