├── .gitignore ├── .vscode ├── launch.json ├── settings.json └── tasks.json ├── .vscodeignore ├── LICENSE ├── README.md ├── images ├── haskell-linter.gif └── yo-extension.PNG ├── package.json ├── src ├── extension.ts └── features │ └── hlintProvider.ts ├── test ├── extension.test.ts └── index.ts ├── tsconfig.json ├── typings ├── node.d.ts └── vscode-typings.d.ts └── vsc-extension-quickstart.md /.gitignore: -------------------------------------------------------------------------------- 1 | out 2 | node_modules -------------------------------------------------------------------------------- /.vscode/launch.json: -------------------------------------------------------------------------------- 1 | // A launch configuration that compiles the extension and then opens it inside a new window 2 | { 3 | "version": "0.1.0", 4 | "configurations": [ 5 | { 6 | "name": "Launch Extension", 7 | "type": "extensionHost", 8 | "request": "launch", 9 | "runtimeExecutable": "${execPath}", 10 | "args": ["--extensionDevelopmentPath=${workspaceRoot}" ], 11 | "stopOnEntry": false, 12 | "sourceMaps": true, 13 | "outDir": "out/src", 14 | "preLaunchTask": "npm" 15 | }, 16 | { 17 | "name": "Launch Tests", 18 | "type": "extensionHost", 19 | "request": "launch", 20 | "runtimeExecutable": "${execPath}", 21 | "args": ["--extensionDevelopmentPath=${workspaceRoot}", "--extensionTestsPath=${workspaceRoot}/out/test" ], 22 | "stopOnEntry": false, 23 | "sourceMaps": true, 24 | "outDir": "out/test", 25 | "preLaunchTask": "npm" 26 | } 27 | ] 28 | } -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | // Place your settings in this file to overwrite default and user settings. 2 | { 3 | "files.exclude": { 4 | "out": false // set this to true to hide the "out" folder with the compiled JS files 5 | }, 6 | "search.exclude": { 7 | "out": true // set this to false to include "out" folder in search results 8 | }, 9 | "typescript.tsdk": "./node_modules/typescript/lib" // we want to use the TS server from our node_modules folder to control its version 10 | } -------------------------------------------------------------------------------- /.vscode/tasks.json: -------------------------------------------------------------------------------- 1 | // Available variables which can be used inside of strings. 2 | // ${workspaceRoot}: the root folder of the team 3 | // ${file}: the current opened file 4 | // ${fileBasename}: the current opened file's basename 5 | // ${fileDirname}: the current opened file's dirname 6 | // ${fileExtname}: the current opened file's extension 7 | // ${cwd}: the current working directory of the spawned process 8 | 9 | // A task runner that calls a custom npm script that compiles the extension. 10 | { 11 | "version": "0.1.0", 12 | 13 | // we want to run npm 14 | "command": "npm", 15 | 16 | // the command is a shell script 17 | "isShellCommand": true, 18 | 19 | // show the output window only if unrecognized errors occur. 20 | "showOutput": "silent", 21 | 22 | // we run the custom script "compile" as defined in package.json 23 | "args": ["run", "compile", "--loglevel", "silent"], 24 | 25 | // The tsc compiler is started in watching mode 26 | "isWatching": true, 27 | 28 | // use the standard tsc in watch mode problem matcher to find compile problems in the output. 29 | "problemMatcher": "$tsc-watch" 30 | } -------------------------------------------------------------------------------- /.vscodeignore: -------------------------------------------------------------------------------- 1 | .vscode/** 2 | typings/** 3 | out/test/** 4 | test/** 5 | src/** 6 | **/*.map 7 | .gitignore 8 | tsconfig.json 9 | vsc-extension-quickstart.md 10 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Cody Hoover 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 | # Hello Extensions! 2 | 3 | This post will describe the pieces needed to create a linter extension for Haskell for VS Code. It will build up the pieces one at a time and then connect them all together in the end. If you want to follow along, make sure you have followed the Prerequisites, otherwise skip down to Features. 4 | 5 | **Note:** The source for the extension described here can be found in [this repository][5]. 6 | 7 | ## Prerequisites 8 | - [VS Code (>= 0.10.1)][1] 9 | - [Node][2] 10 | - [Hlint][3] (added to your system's $PATH) 11 | - Read the official "Hello World!" [example][4] 12 | 13 | Install the yeoman generator for VS Code, run it, and choose `New Extension (TypeScript)` (note: Spaces or special characters in your publisher name will lead to problems with publishing.) 14 | ```bash 15 | npm install -g yo generator-code 16 | yo code 17 | ``` 18 | ![YO](images/yo-extension.PNG?raw=true) 19 | In the generated `src/` directory create a subdirectory called `features/` with a file called `hlintProvider.ts`. 20 | ```bash 21 | mkdir HaskellLinter/src/features 22 | touch HaskellLinter/src/features/hlintProvider.ts 23 | ``` 24 | Change into the extension directory and launch it with VS Code 25 | ```bash 26 | cd HaskellLinter 27 | code . 28 | ``` 29 | 30 | # Adding the Features 31 | 32 | This extension will use [hlint][3] to lint our haskell file. The output from hlint will allow us to mark parts of the code with what VS Code calls diagnostics. These provide the squiggly underlines, marks in the gutters, and tooltips on hover. We'll also leverage the suggestions from hlint to provide code actions to refactor our haskell code. These result in the lightbulbs that appear when you select an area that VS Code has underlined. 33 | 34 | ![IDE](images/haskell-linter.gif) 35 | 36 | ## Diagnostics + Diagnostic Collection 37 | As described above, Diagnostics provide the underlines in the code. A `Diagnostic` object contains a range comprising the starting and ending line and column, a message, and a severity. To actually make them display, though, a `DiagnosticCollection` is needed. 38 | 39 | Using `cp.spawn()`, extensions can call any executable and process the results. The code below uses `cp.spawn()` to call hlint, parses the output into `Diagnostic` objects, and then adds them to a `DiagnosticCollection` with `this.diagnosticCollection.set(textDocument.uri, diagnostics);` which add the chrome in the UI. 40 | 41 | Copy the code below into `src/features/hlintProvider.ts`. 42 | 43 | ```js 44 | // src/features/hlintProvider.ts 45 | 'use strict'; 46 | 47 | import * as path from 'path'; 48 | import * as cp from 'child_process'; 49 | import ChildProcess = cp.ChildProcess; 50 | 51 | import * as vscode from 'vscode'; 52 | 53 | export default class HaskellLintingProvider { 54 | 55 | private diagnosticCollection: vscode.DiagnosticCollection; 56 | 57 | private doHlint(textDocument: vscode.TextDocument) { 58 | if (textDocument.languageId !== 'haskell') { 59 | return; 60 | } 61 | 62 | let decoded = '' 63 | let diagnostics: vscode.Diagnostic[] = []; 64 | 65 | let options = vscode.workspace.rootPath ? { cwd: vscode.workspace.rootPath } : undefined; 66 | let args = ['--json', textDocument.fileName]; 67 | 68 | let childProcess = cp.spawn('hlint', ['--json', textDocument.fileName], options); 69 | if (childProcess.pid) { 70 | childProcess.stdout.on('data', (data: Buffer) => { 71 | decoded += data; 72 | }); 73 | childProcess.stdout.on('end', () => { 74 | JSON.parse(decoded).forEach( item => { 75 | let severity = item.severity.toLowerCase() === "warning" ? vscode.DiagnosticSeverity.Warning : vscode.DiagnosticSeverity.Error; 76 | let message = item.hint + " Replace: " + item.from + " ==> " + item.to; 77 | let range = new vscode.Range(item.startLine - 1, item.startColumn - 1, 78 | item.endLine - 1, item.endColumn - 1); 79 | let diagnostic = new vscode.Diagnostic(range, message, severity); 80 | diagnostics.push(diagnostic); 81 | }); 82 | this.diagnosticCollection.set(textDocument.uri, diagnostics); 83 | }); 84 | } 85 | } 86 | } 87 | ``` 88 | 89 | ## Commands and CodeActionProviders 90 | Actions that should appear in the command palette (ctrl+shift+p) are declared in `packages.json` as a `command`. The generated Hello World extension has an example of this. These can then be registered by an extension to trigger any function with the line `vscode.commands.registerCommand('extension.commandId', functionNameOrDefinition)`. 91 | 92 | However, for an action that is context specific and shouldn't be in the command palette, don't register it in `packages.json`. But then how will it be triggered? That's where `CodeActionProviders` come in. 93 | 94 | A `CodeActionProvider` makes the lightbulb show up in VS Code allowing users to perform refactorings, fix spelling mistakes, etc. 95 | 96 | The `CodeActionProvider` interface defines a single method named `provideCodeActions()`. A class that implements this interface and registers with VS Code will have its `provideCodeActions()` method called whenever the user selects text or places the cursor in an area that contains a `Diagnostic`. It is up to the extension, then, to return an array of actions that are applicable for that `Diagnostic`. 97 | 98 | The objects returned by `provideCodeActions()` are nothing more than references to a command as discussed above and an array of arguments to pass it. These will display as options if the user clicks the lightbulb. And when the user clicks on the lightbulb? The arguments are passed to whatever function the extension registered for that command as described above. 99 | 100 | The code below illustrates how to add code actions to the `HaskellLintingProvider` class shown above. `provideCodeActions()` receives the diagnostics as a member of `CodeActionContext` and returns an array with a single command. `runCodeAction()` is the function that we want to trigger if a user selects our action. Using the arguments passed along with the command it uses a `WorkspaceEdit` to fix a users code according to the suggestions of hlint. 101 | 102 | Copy the following code into the body of `HaskellLintingProvider` from `src/features/hlintProvider` after the `doHlint()` function. 103 | 104 | ```js 105 | // src/features/hlintProvider.ts 106 | 107 | private static commandId: string = 'haskell.hlint.runCodeAction'; 108 | 109 | public provideCodeActions(document: vscode.TextDocument, range: vscode.Range, context: vscode.CodeActionContext, token: vscode.CancellationToken): vscode.Command[] { 110 | let diagnostic:vscode.Diagnostic = context.diagnostics[0]; 111 | return [{ 112 | title: "Accept hlint suggestion", 113 | command: HaskellLintingProvider.commandId, 114 | arguments: [document, diagnostic.range, diagnostic.message] 115 | }]; 116 | } 117 | 118 | private runCodeAction(document: vscode.TextDocument, range: vscode.Range, message:string): any { 119 | let fromRegex:RegExp = /.*Replace:(.*)==>.*/g 120 | let fromMatch:RegExpExecArray = fromRegex.exec(message.replace(/\s/g, '')); 121 | let from = fromMatch[1]; 122 | let to:string = document.getText(range).replace(/\s/g, '') 123 | if (from === to) { 124 | let newText = /.*==>\s(.*)/g.exec(message)[1] 125 | let edit = new vscode.WorkspaceEdit(); 126 | edit.replace(document.uri, range, newText); 127 | return vscode.workspace.applyEdit(edit); 128 | } else { 129 | vscode.window.showErrorMessage("The suggestion was not applied because it is out of date. You might have tried to apply the same edit twice."); 130 | } 131 | } 132 | ``` 133 | 134 | ## Wiring it all up 135 | `HaskellLintingProvider` now contains functions that will perform the linting and set the diagnostics, return a list of code actions to make the lightbulb appear, and perform a code action if one is selected. Now it just needs the wiring to make it all work. `activate()` and `dispose()` deal with set-up and tear-down in VS Code extensions. The code below registers the command so that the `CodeActionProvider` can call it and sets up listeners to trigger the linting action. 136 | 137 | Again, add the following code to the body of the `HaskellLintingProvider` class from `src/features/hlintProvider.ts`. 138 | 139 | ```js 140 | // src/features/hlintProvider.ts 141 | private command: vscode.Disposable; 142 | 143 | public activate(subscriptions: vscode.Disposable[]) { 144 | this.command = vscode.commands.registerCommand(HaskellLintingProvider.commandId, this.runCodeAction, this); 145 | subscriptions.push(this); 146 | this.diagnosticCollection = vscode.languages.createDiagnosticCollection(); 147 | 148 | vscode.workspace.onDidOpenTextDocument(this.doHlint, this, subscriptions); 149 | vscode.workspace.onDidCloseTextDocument((textDocument)=> { 150 | this.diagnosticCollection.delete(textDocument.uri); 151 | }, null, subscriptions); 152 | 153 | vscode.workspace.onDidSaveTextDocument(this.doHlint, this); 154 | 155 | // Hlint all open haskell documents 156 | vscode.workspace.textDocuments.forEach(this.doHlint, this); 157 | } 158 | 159 | public dispose(): void { 160 | this.diagnosticCollection.clear(); 161 | this.diagnosticCollection.dispose(); 162 | this.command.dispose(); 163 | } 164 | ``` 165 | 166 | `HaskellLintingProvider` does the bulk of the work for this extension but it isn't the entry point. The real entry point to our extension is shown below from `src/extension.ts`. When the extension is activated by VS Code it activates its own helper to handle the linting and then registers that helper as a code action provider. 167 | 168 | Replace the existing code in `src/extension.ts` with the code below. 169 | 170 | ```js 171 | // src/extension.ts 172 | import * as vscode from 'vscode'; 173 | 174 | import HaskellLintingProvider from './features/hlintProvider'; 175 | 176 | export function activate(context: vscode.ExtensionContext) { 177 | let linter = new HaskellLintingProvider(); 178 | linter.activate(context.subscriptions); 179 | vscode.languages.registerCodeActionsProvider('haskell', linter); 180 | } 181 | ``` 182 | 183 | The last piece of the puzzle is declaring the extension in `package.json`. The `main` property declares the entry point of the extension where `activate()` should be called. `package.json` should already contain this line: 184 | 185 | ```json 186 | "main": "./out/src/extension", 187 | ``` 188 | `contributes` can be used to declare commands, but this extension uses it to declare haskell as a language. This is important, because the `activationEvents` property relies on VS Code recognizing haskell files. Replace the properties `activationEvents` and `contributes` in `package.json` with the values below. 189 | 190 | ```json 191 | // package.json 192 | "contributes": { 193 | "languages": [ 194 | { 195 | "id": "haskell", 196 | "aliases": ["Haskell", "haskell"], 197 | "extensions": [".hs",".lhs"] 198 | } 199 | ] 200 | }, 201 | "activationEvents": [ 202 | "onLanguage:haskell" 203 | ], 204 | ``` 205 | 206 | # Running the Extension 207 | 208 | Everything should be in place to lint Haskell, now. Run the extension by pressing `F5`. VS Code will launch a new window running the extension. Using that new window, create a new file with a `.hs` estension and add the following lines of code: 209 | 210 | ```haskell 211 | doubleSecond xs = [x | x <- zipWith (*) xs (concat (repeat [1,2]))] 212 | function xs = a $ b $ c 213 | function2 xs = map xs 214 | ``` 215 | 216 | After saving the file, each line should be marked with a diagnostic. Press `ctrl+shift+m` to open the error list. Click on an issue to see the code selected. Hover over the selection to see the hlint suggestion. Press `ctrl+.` to activate the lightbulb and press `enter` to accept the suggestion. 217 | 218 | Alternatively, simply move the cursor into an underlined piece of code, click the lightbulb that appears, and click "Accept hlint suggestion". 219 | 220 | Keep in mind that the linting only occurs on save. 221 | 222 | If you have any issues: 223 | - Check that hlint is installed and added to your path 224 | - Reference [this repository][5] 225 | - Use the debugger 226 | 227 | # Done! 228 | 229 | That's it! I have also released a more sophisticated version of this linter in the [marketplace][6] that allows linting as you type, configuring arguments to pass to the linter, and more. Find the repo for that [here][7]. 230 | 231 | [1]: https://code.visualstudio.com 232 | [2]: https://nodejs.org/en/download/ 233 | [3]: http://community.haskell.org/~ndm/hlint/ 234 | [4]: https://code.visualstudio.com/docs/extensions/example-hello-world 235 | [5]: https://github.com/hoovercj/vscode-extension-tutorial 236 | [6]: https://marketplace.visualstudio.com/items/hoovercj.haskell-linter 237 | [7]: https://github.com/hoovercj/vscode-haskell-linter -------------------------------------------------------------------------------- /images/haskell-linter.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hoovercj/vscode-extension-tutorial/134c85c7c4cdc737f71c73593d3dbdb9061fecd9/images/haskell-linter.gif -------------------------------------------------------------------------------- /images/yo-extension.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hoovercj/vscode-extension-tutorial/134c85c7c4cdc737f71c73593d3dbdb9061fecd9/images/yo-extension.PNG -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "haskell-tutorial", 3 | "description": "A tutorial version of haskell-linter", 4 | "version": "0.0.1", 5 | "publisher": "hoovercj", 6 | "engines": { 7 | "vscode": "^0.10.1" 8 | }, 9 | "categories": [ 10 | "Languages", 11 | "Linters" 12 | ], 13 | "main": "./out/src/extension", 14 | "activationEvents": [ 15 | "onLanguage:haskell" 16 | ], 17 | "contributes": { 18 | "languages": [ 19 | { 20 | "id": "haskell", 21 | "aliases": ["Haskell", "haskell"], 22 | "extensions": [".hs",".lhs"] 23 | } 24 | ] 25 | }, 26 | "scripts": { 27 | "vscode:prepublish": "node ./node_modules/vscode/bin/compile", 28 | "compile": "node ./node_modules/vscode/bin/compile -watch -p ./" 29 | }, 30 | "devDependencies": { 31 | "typescript": "^1.6.2", 32 | "vscode": "0.10.x" 33 | } 34 | } -------------------------------------------------------------------------------- /src/extension.ts: -------------------------------------------------------------------------------- 1 | import * as vscode from 'vscode'; 2 | 3 | import HaskellLintingProvider from './features/hlintProvider'; 4 | 5 | export function activate(context: vscode.ExtensionContext) { 6 | let linter = new HaskellLintingProvider(); 7 | linter.activate(context.subscriptions); 8 | vscode.languages.registerCodeActionsProvider('haskell', linter); 9 | } -------------------------------------------------------------------------------- /src/features/hlintProvider.ts: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | import * as path from 'path'; 4 | import * as cp from 'child_process'; 5 | import ChildProcess = cp.ChildProcess; 6 | 7 | import * as vscode from 'vscode'; 8 | 9 | export default class HaskellLintingProvider implements vscode.CodeActionProvider { 10 | 11 | private static commandId: string = 'haskell.runCodeAction'; 12 | private command: vscode.Disposable; 13 | private diagnosticCollection: vscode.DiagnosticCollection; 14 | 15 | public activate(subscriptions: vscode.Disposable[]) { 16 | this.command = vscode.commands.registerCommand(HaskellLintingProvider.commandId, this.runCodeAction, this); 17 | subscriptions.push(this); 18 | this.diagnosticCollection = vscode.languages.createDiagnosticCollection(); 19 | 20 | vscode.workspace.onDidOpenTextDocument(this.doHlint, this, subscriptions); 21 | vscode.workspace.onDidCloseTextDocument((textDocument)=> { 22 | this.diagnosticCollection.delete(textDocument.uri); 23 | }, null, subscriptions); 24 | 25 | vscode.workspace.onDidSaveTextDocument(this.doHlint, this); 26 | 27 | // Hlint all open haskell documents 28 | vscode.workspace.textDocuments.forEach(this.doHlint, this); 29 | } 30 | 31 | public dispose(): void { 32 | this.diagnosticCollection.clear(); 33 | this.diagnosticCollection.dispose(); 34 | this.command.dispose(); 35 | } 36 | 37 | private doHlint(textDocument: vscode.TextDocument) { 38 | if (textDocument.languageId !== 'haskell') { 39 | return; 40 | } 41 | 42 | let decoded = '' 43 | let diagnostics: vscode.Diagnostic[] = []; 44 | 45 | let options = vscode.workspace.rootPath ? { cwd: vscode.workspace.rootPath } : undefined; 46 | let args = ['--json', textDocument.fileName]; 47 | 48 | let childProcess = cp.spawn('hlint', ['--json', textDocument.fileName], options); 49 | childProcess.on('error', (error: Error) => { 50 | console.log(error); 51 | vscode.window.showInformationMessage(`Cannot hlint the haskell file.`); 52 | }); 53 | if (childProcess.pid) { 54 | childProcess.stdout.on('data', (data: Buffer) => { 55 | decoded += data; 56 | }); 57 | childProcess.stdout.on('end', () => { 58 | JSON.parse(decoded).forEach( item => { 59 | let severity = item.severity.toLowerCase() === "warning" ? vscode.DiagnosticSeverity.Warning : vscode.DiagnosticSeverity.Error; 60 | let message = item.hint + " Replace: " + item.from + " ==> " + item.to; 61 | let range = new vscode.Range(item.startLine - 1, item.startColumn - 1, item.endLine - 1, item.endColumn - 1); 62 | let diagnostic = new vscode.Diagnostic(range, message, severity); 63 | diagnostics.push(diagnostic); 64 | }); 65 | this.diagnosticCollection.set(textDocument.uri, diagnostics); 66 | }); 67 | } 68 | } 69 | 70 | public provideCodeActions(document: vscode.TextDocument, range: vscode.Range, context: vscode.CodeActionContext, token: vscode.CancellationToken): vscode.Command[] { 71 | let diagnostic:vscode.Diagnostic = context.diagnostics[0]; 72 | return [{ 73 | title: "Accept hlint suggestion", 74 | command: HaskellLintingProvider.commandId, 75 | arguments: [document, diagnostic.range, diagnostic.message] 76 | }]; 77 | } 78 | 79 | private runCodeAction(document: vscode.TextDocument, range: vscode.Range, message:string): any { 80 | let fromRegex:RegExp = /.*Replace:(.*)==>.*/g 81 | let fromMatch:RegExpExecArray = fromRegex.exec(message.replace(/\s/g, '')); 82 | let from = fromMatch[1]; 83 | let to:string = document.getText(range).replace(/\s/g, '') 84 | if (from === to) { 85 | let newText = /.*==>\s(.*)/g.exec(message)[1] 86 | let edit = new vscode.WorkspaceEdit(); 87 | edit.replace(document.uri, range, newText); 88 | return vscode.workspace.applyEdit(edit); 89 | } else { 90 | vscode.window.showErrorMessage("The suggestion was not applied because it is out of date. You might have tried to apply the same edit twice."); 91 | } 92 | } 93 | } 94 | -------------------------------------------------------------------------------- /test/extension.test.ts: -------------------------------------------------------------------------------- 1 | // 2 | // Note: This example test is leveraging the Mocha test framework. 3 | // Please refer to their documentation on https://mochajs.org/ for help. 4 | // 5 | 6 | // The module 'assert' provides assertion methods from node 7 | import * as assert from 'assert'; 8 | 9 | // You can import and use all API from the 'vscode' module 10 | // as well as import your extension to test it 11 | import * as vscode from 'vscode'; 12 | import * as myExtension from '../src/extension'; 13 | 14 | // Defines a Mocha test suite to group tests of similar kind together 15 | suite("Extension Tests", () => { 16 | 17 | // Defines a Mocha unit test 18 | test("Something 1", () => { 19 | assert.equal(-1, [1, 2, 3].indexOf(5)); 20 | assert.equal(-1, [1, 2, 3].indexOf(0)); 21 | }); 22 | }); -------------------------------------------------------------------------------- /test/index.ts: -------------------------------------------------------------------------------- 1 | // 2 | // PLEASE DO NOT MODIFY / DELETE UNLESS YOU KNOW WHAT YOU ARE DOING 3 | // 4 | // This file is providing the test runner to use when running extension tests. 5 | // By default the test runner in use is Mocha based. 6 | // 7 | // You can provide your own test runner if you want to override it by exporting 8 | // a function run(testRoot: string, clb: (error:Error) => void) that the extension 9 | // host can call to run the tests. The test runner is expected to use console.log 10 | // to report the results back to the caller. When the tests are finished, return 11 | // a possible error to the callback or null if none. 12 | 13 | var testRunner = require('vscode/lib/testrunner'); 14 | 15 | // You can directly control Mocha options by uncommenting the following lines 16 | // See https://github.com/mochajs/mocha/wiki/Using-mocha-programmatically#set-options for more info 17 | testRunner.configure({ 18 | ui: 'tdd', // the TDD UI is being used in extension.test.ts (suite, test, etc.) 19 | useColors: true // colored output from test results 20 | }); 21 | 22 | module.exports = testRunner; -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "module": "commonjs", 4 | "target": "ES5", 5 | "outDir": "out", 6 | "noLib": true, 7 | "sourceMap": true 8 | }, 9 | "exclude": [ 10 | "node_modules" 11 | ] 12 | } -------------------------------------------------------------------------------- /typings/node.d.ts: -------------------------------------------------------------------------------- 1 | /// -------------------------------------------------------------------------------- /typings/vscode-typings.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /vsc-extension-quickstart.md: -------------------------------------------------------------------------------- 1 | # Welcome to your first VS Code Extension 2 | 3 | ## What's in the folder 4 | * This folder contains all of the files necessary for your extension 5 | * `package.json` - this is the manifest file in which you declare your extension and command. 6 | The sample plugin registers a command and defines its title and command name. With this information 7 | VS Code can show the command in the command palette. It doesn’t yet need to load the plugin. 8 | * `src/extension.ts` - this is the main file where you will provide the implementation of your command. 9 | The file exports one function, `activate`, which is called the very first time your extension is 10 | activated (in this case by executing the command). Inside the `activate` function we call `registerCommand`. 11 | We pass the function containing the implementation of the command as the second parameter to 12 | `registerCommand`. 13 | 14 | ## Get up and running straight away 15 | * press `F5` to open a new window with your extension loaded 16 | * run your command from the command palette by pressing (`Ctrl+Shift+P` or `Cmd+Shift+P` on Mac) and typing `Hello World` 17 | * set breakpoints in your code inside `src/extension.ts` to debug your extension 18 | * find output from your extension in the debug console 19 | 20 | ## Make changes 21 | * you can relaunch the extension from the debug toolbar after changing code in `src/extension.ts` 22 | * you can also reload (`Ctrl+R` or `Cmd+R` on Mac) the VS Code window with your extension to load your changes 23 | 24 | ## Explore the API 25 | * you can open the full set of our API when you open the file `node_modules/vscode/vscode.d.ts` 26 | 27 | ## Run tests 28 | * open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Launch Tests` 29 | * press `F5` to run the tests in a new window with your extension loaded 30 | * see the output of the test result in the debug console 31 | * make changes to `test/extension.test.ts` or create new test files inside the `test` folder 32 | * by convention, the test runner will only consider files matching the name pattern `**.test.ts` 33 | * you can create folders inside the `test` folder to structure your tests any way you want --------------------------------------------------------------------------------