#OpenToWorkOpen to new opportunities: Technical Lead or DevRel let's chat and
explore possibilities!
Contact Elio
Handle links in the terminal from your Visual Studio Code extension
June 16, 2022
For a while now, I have been thinking about a way to handle links shown in the Visual Studio Code terminal. By default, when you control/command + click on a link, you navigate to them, but in my case, I wanted to be able to handle the link in the extension.
To look for a solution, I opened the Visual Studio Code editor its code and found the registerTerminalLinkProvider API, which is also available for extensions.
The terminal link provider allows you to register a provider that enables the detection and handling of links within the terminal. This API is exactly what I have been looking for, and it is also reasonably easy to start using it.
The solution
The registerTerminalLinkProvider method requires two properties:
provideTerminalLinks: The provider that detects the links;
handleTerminalLink: The handler when you click on the link.
The solution I came up with is to check if the terminal line contains a link, and if it does, provide the Terminal Link action.
In the terminal link handler, I let Visual Studio Code show an information message to allow the user to choose between navigating to the link or running it in the extension.
import*asvscodefrom'vscode';exportconstUrlRegex=/(http|https):\/\/([\w_-]+(?:(?:\.[\w_-]+)+)|(localhost))([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])/gi;interfaceCustomTerminalLinkextendsvscode.TerminalLink{data: string;}exportfunctionactivate(context: vscode.ExtensionContext){vscode.window.registerTerminalLinkProvider({provideTerminalLinks:(context: vscode.TerminalLinkContext,token: vscode.CancellationToken)=>{// Detect the first instance of the word "link" if it exists and linkify it
constmatches=[...context.line.matchAll(UrlRegex)];if(matches.length===0){return[];}returnmatches.map(match=>{constline=context.line;conststartIndex=line.indexOf(match[0]);return{startIndex,length: match[0].length,tooltip:'Handle link',data: match[0],}asCustomTerminalLink;})},handleTerminalLink:(link: CustomTerminalLink)=>{vscode.window.showInformationMessage(`How would you like to handle the link?`,'Navigate','Run in extension').then(action=>{if(action==='Navigate'){vscode.commands.executeCommand('vscode.open',vscode.Uri.parse(link.data));}elseif(action==='Run in extension'){// Do something else with the link
}});}});}// this method is called when your extension is deactivated
exportfunctiondeactivate() {}