update templates to use new test-cli package (#434)

* update templates to use new test-cli package

* update run test docs

generators/app/dependencyVersions/package.json

@@ -12,6 +12,7 @@
         "glob": "^10.3.10",
         "mocha": "^10.2.0",
         "typescript": "^5.2.2",
+        "@vscode/test-cli": "^0.0.4",
         "@vscode/test-electron": "^2.3.6",
         "@vscode/test-web": "^0.0.48",
         "@types/webpack-env": "^1.18.3",

generators/app/generate-command-js.js

@@ -52,6 +52,7 @@ export default {
 
         generator.fs.copyTpl(generator.templatePath('extension.js'), generator.destinationPath('extension.js'), extensionConfig);
         generator.fs.copyTpl(generator.templatePath('package.json'), generator.destinationPath('package.json'), extensionConfig);
+        generator.fs.copy(generator.templatePath('.vscode-test.mjs'), generator.destinationPath('.vscode-test.mjs'));
         generator.fs.copyTpl(generator.templatePath('.eslintrc.json'), generator.destinationPath('.eslintrc.json'), extensionConfig);
 
         if (extensionConfig.pkgManager === 'yarn') {

generators/app/generate-command-ts.js

@@ -52,6 +52,7 @@ export default {
         generator.fs.copyTpl(generator.templatePath('CHANGELOG.md'), generator.destinationPath('CHANGELOG.md'), extensionConfig);
         generator.fs.copyTpl(generator.templatePath('src/extension.ts'), generator.destinationPath('src/extension.ts'), extensionConfig);
         generator.fs.copy(generator.templatePath('src/test'), generator.destinationPath('src/test'));
+        generator.fs.copy(generator.templatePath('.vscode-test.mjs'), generator.destinationPath('.vscode-test.mjs'));
         generator.fs.copy(generator.templatePath('.eslintrc.json'), generator.destinationPath('.eslintrc.json'));
 
         if (extensionConfig.pkgManager === 'yarn') {

generators/app/generate-notebook-renderer.js

@@ -35,6 +35,7 @@ export default {
         generator.fs.copy(generator.templatePath('.vscodeignore'), generator.destinationPath('.vscodeignore'));
         generator.fs.copy(generator.templatePath('webpack.config.js'), generator.destinationPath('webpack.config.js'));
         generator.fs.copy(generator.templatePath('.eslintrc.json'), generator.destinationPath('.eslintrc.json'));
+        generator.fs.copy(generator.templatePath('.vscode-test.mjs'), generator.destinationPath('.vscode-test.mjs'));
 
         generator.fs.copyTpl(generator.templatePath('package.json'), generator.destinationPath('package.json'), extensionConfig);
         generator.fs.copyTpl(generator.templatePath('README.md'), generator.destinationPath('README.md'), extensionConfig);

generators/app/templates/ext-command-js/.vscode-test.mjs

@@ -0,0 +1,5 @@
+import { defineConfig } from '@vscode/test-cli';
+
+export default defineConfig({
+	files: 'test/**/*.test.js',
+});

generators/app/templates/ext-command-js/.vscodeignore

@@ -7,3 +7,4 @@ vsc-extension-quickstart.md
 **/jsconfig.json
 **/*.map
 **/.eslintrc.json
+**/.vscode-test.*

generators/app/templates/ext-command-js/package.json

@@ -20,16 +20,15 @@
   "scripts": {
     "lint": "eslint .",
     "pretest": "<%= pkgManager %> run lint",
-    "test": "node ./test/runTest.js"
+    "test": "vscode-test"
   },
   "devDependencies": {
     <%- dep("@types/vscode") %>,
     <%- dep("@types/mocha") %>,
     <%- dep("@types/node") %>,
     <%- dep("eslint") %>,
-    <%- dep("glob") %>,
-    <%- dep("mocha") %>,
     <%- dep("typescript") %>,
+    <%- dep("@vscode/test-cli") %>,
     <%- dep("@vscode/test-electron") %>
   }
 }

generators/app/templates/ext-command-js/vsc-extension-quickstart.md

@@ -27,11 +27,11 @@
 
 ## Run tests
 
-* Open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Extension Tests`.
-* Press `F5` to run the tests in a new window with your extension loaded.
-* See the output of the test result in the debug console.
-* Make changes to `src/test/suite/extension.test.js` or create new test files inside the `test/suite` folder.
-  * The provided test runner will only consider files matching the name pattern `**.test.ts`.
+* Install the [Extension Test Runner](https://marketplace.visualstudio.com/items?itemName=ms-vscode.extension-test-runner)
+* Open the Testing view from the activity bar and click the Run Test" button, or use the hotkey `Ctrl/Cmd + ; A`
+* See the output of the test result in the Test Results view.
+* Make changes to `test/extension.test.js` or create new test files inside the `test` folder.
+  * The provided test runner will only consider files matching the name pattern `**.test.js`.
   * You can create folders inside the `test` folder to structure your tests any way you want.
 
 ## Go further

generators/app/templates/ext-command-js/vscode/extensions.json

@@ -2,6 +2,7 @@
 	// See https://go.microsoft.com/fwlink/?LinkId=733558
 	// for the documentation about the extensions.json format
 	"recommendations": [
-		"dbaeumer.vscode-eslint"
+		"dbaeumer.vscode-eslint",
+        "ms-vscode.extension-test-runner"
 	]
-}
+}

generators/app/templates/ext-command-js/vscode/launch.json

@@ -12,15 +12,6 @@
 			"args": [
 				"--extensionDevelopmentPath=${workspaceFolder}"
 			]
-		},
-		{
-			"name": "Extension Tests",
-			"type": "extensionHost",
-			"request": "launch",
-			"args": [
-				"--extensionDevelopmentPath=${workspaceFolder}",
-				"--extensionTestsPath=${workspaceFolder}/test/suite/index"
-			]
 		}
 	]
 }

generators/app/templates/ext-command-ts/.vscode-test.mjs

@@ -0,0 +1,5 @@
+import { defineConfig } from '@vscode/test-cli';
+
+export default defineConfig({
+	files: 'out/test/**/*.test.js',
+});

generators/app/templates/ext-command-ts/.vscodeignore

@@ -8,3 +8,4 @@ vsc-extension-quickstart.md
 **/.eslintrc.json
 **/*.map
 **/*.ts
+**/.vscode-test.*

generators/app/templates/ext-command-ts/package.json

@@ -26,7 +26,7 @@
     "watch": "tsc -watch -p ./",
     "pretest": "<%= pkgManager %> run compile && <%= pkgManager %> run lint",
     "lint": "eslint src --ext ts",
-    "test": "node ./out/test/runTest.js"<% if (insiders) { %>,
+    "test": "vscode-test"<% if (insiders) { %>,
     "update-proposed-api": "vscode-dts dev"<% } %>
   },
   "devDependencies": {
@@ -36,9 +36,8 @@
     <%- dep("@typescript-eslint/eslint-plugin") %>,
     <%- dep("@typescript-eslint/parser") %>,
     <%- dep("eslint") %>,
-    <%- dep("glob") %>,
-    <%- dep("mocha") %>,
     <%- dep("typescript") %>,
+    <%- dep("@vscode/test-cli") %>,
     <%- dep("@vscode/test-electron") %><% if (insiders) { %>,
     <%- dep("vscode-dts") %><% } %>
   }

generators/app/templates/ext-command-ts/vsc-extension-quickstart.md

@@ -27,10 +27,11 @@
 
 ## Run tests
 
-* Open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Extension Tests`.
-* Press `F5` to run the tests in a new window with your extension loaded.
-* See the output of the test result in the debug console.
-* Make changes to `src/test/suite/extension.test.ts` or create new test files inside the `test/suite` folder.
+* Install the [Extension Test Runner](https://marketplace.visualstudio.com/items?itemName=ms-vscode.extension-test-runner)
+* Run the "watch" task via the **Tasks: Run Task** command. Make sure this is running, or tests might not be discovered.
+* Open the Testing view from the activity bar and click the Run Test" button, or use the hotkey `Ctrl/Cmd + ; A`
+* See the output of the test result in the Test Results view.
+* Make changes to `src/test/extension.test.ts` or create new test files inside the `test` folder.
   * The provided test runner will only consider files matching the name pattern `**.test.ts`.
   * You can create folders inside the `test` folder to structure your tests any way you want.
 

generators/app/templates/ext-command-ts/vscode-webpack/.vscodeignore

@@ -11,3 +11,4 @@ vsc-extension-quickstart.md
 **/.eslintrc.json
 **/*.map
 **/*.ts
+**/.vscode-test.*

generators/app/templates/ext-command-ts/vscode-webpack/package.json

@@ -29,7 +29,7 @@
     "watch-tests": "tsc -p . -w --outDir out",
     "pretest": "<%= pkgManager %> run compile-tests && <%= pkgManager %> run compile && <%= pkgManager %> run lint",
     "lint": "eslint src --ext ts",
-    "test": "node ./out/test/runTest.js"<% if (insiders) { %>,
+    "test": "vscode-test"<% if (insiders) { %>,
     "update-proposed-api": "vscode-dts dev"<% } %>
   },
   "devDependencies": {
@@ -39,12 +39,11 @@
     <%- dep("@typescript-eslint/eslint-plugin") %>,
     <%- dep("@typescript-eslint/parser") %>,
     <%- dep("eslint") %>,
-    <%- dep("glob") %>,
-    <%- dep("mocha") %>,
     <%- dep("typescript") %>,
     <%- dep("ts-loader") %>,
     <%- dep("webpack") %>,
     <%- dep("webpack-cli") %>,
+    <%- dep("@vscode/test-cli") %>,
     <%- dep("@vscode/test-electron") %><% if (insiders) { %>,
     <%- dep("vscode-dts") %><% } %>
   }

generators/app/templates/ext-command-ts/vscode-webpack/vsc-extension-quickstart.md

@@ -11,7 +11,7 @@
 
 ## Setup
 
-* install the recommended extensions (amodio.tsl-problem-matcher and dbaeumer.vscode-eslint)
+* install the recommended extensions (amodio.tsl-problem-matcher, ms-vscode.extension-test-runner, and dbaeumer.vscode-eslint)
 
 
 ## Get up and running straight away
@@ -33,10 +33,11 @@
 
 ## Run tests
 
-* Open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Extension Tests`.
-* Press `F5` to run the tests in a new window with your extension loaded.
-* See the output of the test result in the debug console.
-* Make changes to `src/test/suite/extension.test.ts` or create new test files inside the `test/suite` folder.
+* Install the [Extension Test Runner](https://marketplace.visualstudio.com/items?itemName=ms-vscode.extension-test-runner)
+* Run the "watch" task via the **Tasks: Run Task** command. Make sure this is running, or tests might not be discovered.
+* Open the Testing view from the activity bar and click the Run Test" button, or use the hotkey `Ctrl/Cmd + ; A`
+* See the output of the test result in the Test Results view.
+* Make changes to `src/test/extension.test.ts` or create new test files inside the `test` folder.
   * The provided test runner will only consider files matching the name pattern `**.test.ts`.
   * You can create folders inside the `test` folder to structure your tests any way you want.
 

generators/app/templates/ext-command-ts/vscode-webpack/vscode/extensions.json

@@ -1,5 +1,5 @@
 {
   // See http://go.microsoft.com/fwlink/?LinkId=827846
   // for the documentation about the extensions.json format
-  "recommendations": ["dbaeumer.vscode-eslint", "amodio.tsl-problem-matcher"]
+  "recommendations": ["dbaeumer.vscode-eslint", "amodio.tsl-problem-matcher", "ms-vscode.extension-test-runner"]
 }

generators/app/templates/ext-command-ts/vscode-webpack/vscode/launch.json

@@ -16,20 +16,6 @@
 				"${workspaceFolder}/dist/**/*.js"
 			],
 			"preLaunchTask": "${defaultBuildTask}"
-		},
-		{
-			"name": "Extension Tests",
-			"type": "extensionHost",
-			"request": "launch",
-			"args": [
-				"--extensionDevelopmentPath=${workspaceFolder}",
-				"--extensionTestsPath=${workspaceFolder}/out/test/suite/index"
-			],
-			"outFiles": [
-				"${workspaceFolder}/out/**/*.js",
-				"${workspaceFolder}/dist/**/*.js"
-			],
-			"preLaunchTask": "tasks: watch-tests"
 		}
 	]
 }

generators/app/templates/ext-command-ts/vscode/extensions.json

@@ -2,6 +2,7 @@
 	// See http://go.microsoft.com/fwlink/?LinkId=827846
 	// for the documentation about the extensions.json format
 	"recommendations": [
-		"dbaeumer.vscode-eslint"
+		"dbaeumer.vscode-eslint",
+        "ms-vscode.extension-test-runner"
 	]
 }

generators/app/templates/ext-command-ts/vscode/launch.json

@@ -16,19 +16,6 @@
 				"${workspaceFolder}/out/**/*.js"
 			],
 			"preLaunchTask": "${defaultBuildTask}"
-		},
-		{
-			"name": "Extension Tests",
-			"type": "extensionHost",
-			"request": "launch",
-			"args": [
-				"--extensionDevelopmentPath=${workspaceFolder}",
-				"--extensionTestsPath=${workspaceFolder}/out/test/suite/index"
-			],
-			"outFiles": [
-				"${workspaceFolder}/out/test/**/*.js"
-			],
-			"preLaunchTask": "${defaultBuildTask}"
 		}
 	]
 }

generators/app/templates/ext-command-web/.vscodeignore

@@ -11,3 +11,4 @@ webpack.config.js
 **/.eslintrc.json
 **/*.map
 **/*.ts
+**/.vscode-test.*

generators/app/templates/ext-command-web/vsc-extension-quickstart.md

@@ -9,7 +9,7 @@
 
 ## Setup
 
-* install the recommended extensions (amodio.tsl-problem-matcher and dbaeumer.vscode-eslint)
+* install the recommended extensions (amodio.tsl-problem-matcher, ms-vscode.extension-test-runner, and dbaeumer.vscode-eslint)
 
 ## Get up and running the Web Extension