# May 2023 (version 1.79) Welcome to the May 2023 release of Visual Studio Code. There are many updates in this version that we hope you'll like, some of the key highlights include: * **[Read-only mode](#readonly-mode)** - Mark specific files and folders in your workspace as read-only. * **['Paste as' options](#paste-as)** - Choose how you'd like item links pasted into the editor. * **[Automatic copy of external files](#copy-external-media-files-into-workspace-on-drop-or-paste-for-markdown)** - Drag or paste to Markdown adds new files to your workspace. * **[Default Git repo branch name](#default-branch-name)** - Use "main" as the default or override via a user setting. * **[Notebooks rich content search](#rich-content-search)** - Search based on Notebook output or filter on cell type. * **[Linked editing for JSX tags](#linked-editing-for-jsx-tags)** - Simultaneously change opening and closing JSX tags. * **[Preview: GitHub Copilot Chat improvements](#github-copilot)** - Easily manage your chat session history. Inline chat "live preview." * **[VS Code at Microsoft Build 2023](#vs-code-at-microsoft-build)** - Catch up on the sessions in the YouTube playlist. >If you'd like to read these release notes online, go to [Updates](https://code.visualstudio.com/updates) on [code.visualstudio.com](https://code.visualstudio.com). **Insiders:** Want to try new features as soon as possible? You can download the nightly [Insiders](https://code.visualstudio.com/insiders) build and try the latest updates as soon as they are available. ## Accessibility ### Verbosity settings Additional [accessibility.verbosity](https://code.visualstudio.com/updates/v1_78#_aria-verbosity-settings) settings have been added to inform screen reader users how to interact with features when they are focused. For [GitHub Copilot](#github-copilot), there are hints describing how to access the accessible help menus for the Copilot chat view and in editor code chat via: * `accessibility.verbosity.chat` * `accessibility.verbosity.interactiveEditor` These help menus provide information about what to expect, how to navigate from the input box to other elements, and more. Other new `verbosity` settings provide information for specific VS Code UI: * `accessibility.verbosity.keybindingsEditor` - when in the Keyboard Shortcuts editor. * `accessibility.verbosity.notebook` - when in a notebook. The `accessibility.verbosity` settings are enabled by default (set to 'true') but you can silence them individually. ### Settings editor VoiceOver on macOS now reads the descriptions of enum setting options in the Settings editor. Try it out with enum settings such as `files.autoSave` and `editor.accessibilitySupport`. ![onFocusChange option description of files.autoSave setting being displayed by VoiceOver's high-contrast textbox on macOS](images/1_79/enum-setting-voiceover.png) ## Workbench ### Readonly mode In some development scenarios, it can be helpful to explicitly mark some of a workspace's folders or files as read-only. For example, if the folder or file contents is being managed by a different process (such as the `node_modules` folder that is managed by Node.js package manager), marking them are read-only can avoid inadvertent changes. For this use case, there are new settings to mark file paths as read-only in the Explorer and in text and notebook editors: * `files.readonlyInclude` - Paths or glob patterns to make a file read-only if matching. * `files.readonlyExclude`- Paths or glob patterns to skip files from being read-only when they match `files.readonlyInclude`. * `files.readonlyFromPermissions` - Whether a file that has no write-permissions on disk should be read-only. According to the rules of the settings, if a path is considered to be read-only, you cannot modify it from the Explorer (for example, delete it) and the text or notebook editor is read-only. For more ad-hoc toggling of the read-only mode, there are new commands to change the mode for the current session only, overruling your setting configurations: * **Set Active Editor Readonly in Session** - Mark active editor read-only. * **Set Active Editor Writeable in Session** - Mark active editor writeable. * **Toggle Active Editor Readonly in Session** - Toggle between read-only and writeable. * **Reset Active Editor Readonly in Session** - Reset the session state. ### Windows UNC host allowlist improvements As part of an [important security fix](https://github.com/microsoft/vscode/security/advisories/GHSA-mmfh-4pv3-39hr), VS Code introduced an allowlist for UNC hosts. This milestone we addressed many of the usability problems reported by Windows users when they have UNC paths in their day to day work with VS Code. #### Dialog improvements The confirmation dialog to allow a UNC host on startup now updates the `security.allowedUNCHosts` setting and adds the host when you select the checkbox. ![Windows UNC allow dialog](images/1_79/unc-dialog.png) In addition, clicking the **Learn More** button no longer closes the dialog. #### New security.restrictUNCAccess setting A new setting `security.restrictUNCAccess` lets you disable the UNC allowlist for hosts and restore the behavior to how it was before this security fix. We strongly advise against changing this setting, as it makes your system vulnerable again to the [Information Disclosure Vulnerability](https://github.com/microsoft/vscode/security/advisories/GHSA-mmfh-4pv3-39hr). ### New tab sizing option fixed The `workbench.editor.tabSizing` setting has a new option `fixed` that makes each tab equal width. When space becomes limited, tabs will shrink equally up to a minimum. The new setting `workbench.editor.tabSizingFixedMaxWidth` sets the initial size of the tab. In this mode, when you rapidly close tabs using the mouse, the widths of tabs remain stable to allow for closing each tab by clicking onto the same point. The width is then adjusted when you leave the mouse from the editor tab area. ### Network quality indication When you are connected to a remote machine, the best experience for VS Code remote editing capabilities requires a good network connection with low latency. In this milestone, we updated the remote indicator in the Status bar to give you some feedback when either latency is very high or the network connection appears to be offline. #### High latency (web, desktop) We periodically measure the latency to the remote you are connected to. When a certain threshold is hit, the remote indicator updates to reflect that. ![Slow network detection shown in the right of the Status bar](images/1_79/slow-network.png) #### Offline detection (web only) If you are using a web browser to connect to a remote and you suddenly lose internet connection, the remote indicator updates to reflect that. ![Web offline detection displaying "Network appears to be offline" message from the Status bar](images/1_79/offline-indication.gif) ### Continue Working On The [Continue Working On](https://code.visualstudio.com/docs/sourcecontrol/github#_continue-working-on) feature allows you to store and retrieve working changes between VS Code development environments for the same repository, for example, when you upgrade from a local Git repository to a GitHub codespace, or when you switch between different machines for the same repository. You can now transfer working changes between development environments for a GitHub repository even if it is configured with an HTTP remote in one environment and an SSH remote in another. Additionally, we have started to transfer additional workbench state, such as your Source Control view state preference, for a more seamless transition. ## Editor ### Paste as When pasting a file into a text editor, there are multiple ways you might want to insert it. You may want an absolute path point to the file. You may want a path relative to the current workspace. Or you may even want something specific to the current editor's language, such as inserting a Markdown link to the file when pasting into Markdown. VS Code's new 'paste as' functionality gives you control over how the pasted content is inserted. After pasting, VS Code now shows a small 'paste as' control if there are other ways the pasted content could have been inserted: You can open the 'paste as' control by clicking on it or using the `kb(editor.changePasteType)` keyboard shortcut. The paste selector goes away as soon as you start typing or move the cursor outside of the inserted text. You can also fully disable the drop selector control using `"editor.pasteAs.showPasteSelector": "never"`. When you paste content into a Markdown cell in a notebook, for example, the 'paste as' control lets you switch between: * Inserting the image as an attachment * Inserting a Markdown image reference * Inserting a relative path (for files in the workspace) * Inserting an absolute path If you prefer selecting how content in the clipboard should be pasted before actually pasting, you can instead use the new **Paste As...** command. This lets you select how the content should be pasted: ![Using the Paste As... command to select how content is pasted](images/1_79/paste-as-command.png) ### Quick suggestions and snippets Quick suggestions mean that VS Code shows suggestions as you type, without having to press `kb(editor.action.triggerSuggest)`. This feature is widely popular, around 90% of all suggestion sessions are started by typing. A large number of suggestions are accepted via `Tab` (versus `Enter` and typing accept characters). When a snippet is being inserted, the `Tab` key is used to navigate between snippet placeholders. Now, when quick suggestion becomes active while a snippet is being inserted, the `Tab` key can accept a completion **or** navigate to the next snippet placeholder. To resolve this conflict, there is the `editor.suggest.snippetsPreventQuickSuggestions` setting to disable quick suggestions when a snippet is inserted. It defaulted to `true` and as long as this setting existed, we received feedback that it was confusing. So we have decided to change its default value to `false`, so that typing inside a snippet placeholder will trigger quick suggestions. You can then use the following keystrokes: * Press `Tab` to accept a completion. * Press `Escape` to hide quick suggestions. * And `Tab` without suggestions navigates to the next snippet placeholder. ## Terminal ### Automatic shell integration for fish shell [Shell integration](https://code.visualstudio.com/docs/terminal/shell-integration) and its enhanced user experience will now automatically activate for fish shell. You may need to update fish for this to work. ![Shell integration in fish enables several features](images/1_79/terminal-fish-si.png) ### Overline support The overline escape sequences (`SGR 53`, `SGR 55`) specified in ECMA-48 are now supported in the terminal. The most common use of this sequence is to add a line above an app's "status bar" on the bottom row of the terminal. ![The overline feature is similar to underline but will draw a line on top of the text](images/1_79/terminal-overline.png) ## Source Control ### Default branch name Starting with this milestone, all new Git repositories created using VS Code set `main` as their default branch. If you prefer a different name for the default branch, you can change it with the `git.defaultBranchName` setting. When the setting is set to empty, VS Code defers to the default branch name configured in Git. Publishing a folder to GitHub also honors the default branch name configured on GitHub. ### Branch picker integration with vscode.dev and GitHub You can now checkout a branch in vscode.dev or open it on GitHub.com from the branch picker on VS Code desktop. In the short video below, each branch listed in the branch picker dropdown has buttons on the right to either **Open on GitHub** or **Checkout on vscode.dev**. ### Similarity threshold [Git status](https://git-scm.com/docs/git-status#Documentation/git-status.txt---find-renamesltngt) uses a similarity index (number of additions/deletions compared to the file's size) to determine whether an add/delete pair is considered a rename. You can now configure the similarity threshold with the `git.similarityThreshold` setting, which takes a value between `0` and `100`. The default value is `50`. ## Notebooks ### Rich content search You can now search for rich content in open notebooks from the Search control. If your notebook is open, the Search control shows results based on how it appears in the notebook editor (rather than searching the content of the raw source file). This also allows for replacing text in the notebook inputs. Using the new notebook search toggle, you can also filter which types of cell content you would like to search in. ### Improved cell output interaction The new context key `notebookOutputInputFocused` was added to determine if a text box within a cell output has focus, so that raw hotkeys a/b/j/k can safely be used while the output has focus. Focusing on an input box prevents those hotkeys from triggering. ### Format on Run Notebooks now can format cells upon cell execution. This will trigger using **Run Cell**, **Run All**, **Run Above/Below**, and combined kernel+run commands. This feature can be turned on via setting `"notebook.formatOnCellExecution": true`. ### Code Actions on save Notebooks now support Code Actions being run upon save. Code Actions can be specified under the `notebook.codeActionsOnSave` setting. Extension authors can define providers using the standard typings for cell level Code Actions, or use the new `notebook.` prefix to define Code Actions that manage the entire notebook. You can review the [clean-nb-imports-ext](https://github.com/Yoyokrazy/clean-nb-imports-ext) sample extension to learn how extensions can use this new setting. ## Languages ### TypeScript 5.1 VS Code now ships with TypeScript 5.1.3. This major update brings new TypeScript language features, better performance, and many important improvements and bug fixes. You can read about TypeScript 5.1 on the [TypeScript blog](https://devblogs.microsoft.com/typescript/announcing-typescript-5-1). ### Linked editing for JSX tags With linked editing, when you change an opening JSX tag VS Code will automatically update the corresponding closing tag. This can be a great time saver: The feature is off by default but can be enabled by setting: ```json "editor.linkedEditing": true ``` You can also explicitly start linked editing with the **Start Linked Editing** command. ### Rename matching JSX tags using F2 When you trigger rename on a JSX tag, VS Code now renames just the matching tag instead of trying to update all references to the tag: This requires TypeScript 5.1+ and matches how rename works in HTML. You can disable this behavior using `javascript.preferences.renameMatchingJsxTags` and `typescript.preferences.renameMatchingJsxTags`. ### JSDoc @param completions When writing JSDoc comments, VS Code now shows suggestions for all missing parameters: ![JS Doc @param completions in a TypeScript file](images/1_79/js-param.png) This can help you quickly fill in the documentation. In JavaScript files, `@param` completions create placeholders for the parameter type description: ### Copy external media files into workspace on drop or paste for Markdown Want to add an image or video into a Markdown document? Instead of wasting time first manually copying the file into your workspace and then adding a link to it, now you can just drop or paste the file into your Markdown. If the file currently isn't part of the workspace, VS Code will automatically copy the file into your workspace and insert a link to it: This also works great for image data in the clipboard. For example, if you take a screenshot with the Snipping tool on Windows, you can press **Paste** in a Markdown file and VS Code will create a new image file from the clipboard data and insert a Markdown image link to the new file. This also works on macOS if you [hold the Ctrl key while taking a screenshot](https://support.apple.com/en-us/HT201361) to copy it to the clipboard. You can also customize the behavior of this feature using a few settings: #### markdown.copyFiles.destination The `markdown.copyFiles.destination` setting controls where new media files are created. This setting maps globs that match on the current Markdown document to image destinations. The image destinations can also use some simple variables. See the `markdown.copyFiles.destination` setting description for information about the available variables. For example, if we want every Markdown file under `/docs` in our workspace to put new media files into an `images` directory specific to the current file, we can write: ```jsonc "markdown.copyFiles.destination": { "/docs/**/*": "images/${documentBaseName}/" } ``` Now when a new file is pasted in `/docs/api/readme.md`, the image file is created at `/docs/api/images/readme/image.png`. You can even use simple regular expressions to transform variables in a [similar way to snippets](https://code.visualstudio.com/docs/editor/userdefinedsnippets#_variable-transforms). For example, this transform uses only the first letter of the document file name when creating the media file ```jsonc "markdown.copyFiles.destination": { "/docs/**/*": "images/${documentBaseName/(.).*/$1/}/" } ``` When a new file is pasted into `/docs/api/readme.md`, the image is now created under `/docs/api/images/r/image.png`. #### markdown.copyFiles.overwriteBehavior The `markdown.copyFiles.overwriteBehavior` setting controls whether newly created media files overwrite existing files. By default, VS Code will never overwrite existing files. Instead if you have a file called `image.png` and try pasting it into a Markdown document in a workspace where an `image.png` already exists, VS Code will instead create a new file called `image-1.png`. If you then try pasting another file called `image.png`, it will instead be created as `image-2.png`. If you prefer having existing files be overwritten by new files, set `"markdown.copyFiles.overwriteBehavior": "overwrite"`. Now VS Code will always use the original file name, overwriting any existing files that that path. #### Disabling copying files into the workspace VS Code will only try copying files into your workspace if they are not already part of workspace. Additionally, we currently only copy media files (images, videos, audio) into the workspace. However if you find this new behavior too intrusive, you can disable it for both drop and paste by setting: ```json "markdown.editor.drop.copyIntoWorkspace": "never" "markdown.editor.filePaste.copyIntoWorkspace": "never" ``` ### IntelliSense for HTML paths in Markdown files Many Markdown dialects allow raw HTML tags to be used in Markdown documents. In this update, we've extended most of VS Code's Markdown IntelliSense features to file paths used in these HTML tags. This includes support for: * [Path completions](https://code.visualstudio.com/docs/languages/markdown#_path-completions). * [Finding all references](https://code.visualstudio.com/docs/languages/markdown#_find-all-references-to-headers-and-links) to a linked to file. * [Automatically updating file paths](https://code.visualstudio.com/docs/languages/markdown#_automatic-link-updates-on-file-move-or-rename) when a file is renamed or moved. * [Safely renaming](https://code.visualstudio.com/docs/languages/markdown#_rename-headers-and-links) files using F2. * [Validating](https://code.visualstudio.com/docs/languages/markdown#_link-validation) that the linked to file exists in the workspace. ![Finding all references to an image file used in an HTML tag](images/1_79/md-html-support.png) ### Insert audio into Markdown When you drag and drop or copy and paste an audio file into a Markdown document, VS Code now inserts an `