Skip to content

Latest commit

 

History

History
473 lines (296 loc) · 31.5 KB

v1_61.md

File metadata and controls

473 lines (296 loc) · 31.5 KB
Raw
Order TOCTitle PageTitle MetaDescription MetaSocialImage Date DownloadVersion
70
September 2021
Visual Studio Code September 2021
Learn what is new in the Visual Studio Code September 2021 Release (1.61)
1_61/release-highlights.png
2021-10-07
1.61.0

September 2021 (version 1.61)

Welcome to the Insiders build. These are the preliminary notes for the September 1.61 release of Visual Studio Code. As we get closer to the release date, you'll find details below about new features and important fixes.

Until the September milestone release notes are available, you can still track our progress:

We really appreciate people trying our new features as soon as they are ready, so check back here often and learn what's new.

If you find issues or have suggestions, you can enter them in the VS Code repository on GitHub.

Workbench

Split an editor without creating a new group

A new command Split in Group (kb(workbench.action.splitEditorInGroup)) was added to split an editor into two sides without requiring a second editor group. This allows you to work in two editors side by side on the same file:

Split editor in group

There is a new setting workbench.editor.splitInGroupLayout for the splitting to be either vertical or horizontal.

There are new commands to use this new feature via keybindings:

  • workbench.action.splitEditorInGroup
  • workbench.action.toggleSplitEditorInGroup
  • workbench.action.joinEditorInGroup
  • workbench.action.toggleSplitEditorInGroupLayout

And to navigate between the sides, new commands were added as well:

  • workbench.action.focusFirstSideEditor
  • workbench.action.focusSecondSideEditor
  • workbench.action.focusOtherSideEditor

The new color sideBySideEditor.border is sets the color for the border to separate the one side from the other.

Locked editor groups

We introduced locked editor groups last milestone as experimental new feature. During this milestone, the settings experience was improved allowing you to easily select an editor that should lock a group automatically when opening:

Locked editor group setting

The setting is now called workbench.editor.autoLockGroups. Similar, the commands related to editor group locking have been renamed and are no longer experimental:

  • workbench.action.lockEditorGroup
  • workbench.action.unlockEditorGroup
  • workbench.action.toggleEditorGroupLock

Indicate deleted and readonly editors via decorations

Opened editors support to indicate whether they are readonly or whether their associated resource has been deleted from disk. This indication was given by appending "deleted" and/or "readonly" to the editor label, requiring quite a bit of space.

We now changed to using decorations for this purpose:

  • Editors with deleted resource appear with strikethrough and in red.
  • Editors with readonly resources appear with a lock icon.

Editor readonly and deleted decorations

Shorter labels for diff editors

When you compare two files, we typically had prefixed the file names with the workspace relative folder path, making it harder to actually see the file names that are compared.

In this release, the folder is now hidden from the label unless both file names are the same, matching what we had already done for normal editor labels.

If both file names are identical, a description is shown that hints at the folder difference:

Diff editor comparing two files

Allow to split an editor into an existing group

When you normally split an editor to the side, we open a new editor group, even if an existing group is present to the side. But sometimes you might want to split an editor into a group on the side that is already there.

Split into existing group

For that purpose new commands have been added:

  • workbench.action.splitEditorToPreviousGroup: Split into the previous group
  • workbench.action.splitEditorToNextGroup: Split into the next group
  • workbench.action.splitEditorToAboveGroup: Split into the group above the current one
  • workbench.action.splitEditorToBelowGroup: Split into the group below the current one
  • workbench.action.splitEditorToLeftGroup: Split into the group to the left of the current one
  • workbench.action.splitEditorToRightGroup: Split into the group to the right of the current one
  • workbench.action.splitEditorToFirstGroup: Split into first group
  • workbench.action.splitEditorToLastGroup: Split into last group

macOS: File menu changes

On macOS, if you select the Open... menu item from the File menu, you can open both files and folders. For new users, this may come as a surprise, especially since Open Workspace was often used to try to open a folder, but that menu item is specifically to open a .code-workspace file.

As such, we made slight adjustments to the file menu on macOS:

  • A new entry Open Folder... opens a folder.
  • Open Workspace... was renamed to Open Workspace from File...

macOS File Menu

File watching changes

The file watcher we use to detect changes to files and folders on disk changed to a library that can handle all of our supported platforms (Windows, Linux, macOS) and as such reduces the overhead of maintaining different watchers for different platforms. We plan to enable this library by default on all platforms. This iteration we enabled it on Windows and macOS, while Linux is planned shortly after.

The new watcher should be faster on startup and result in fewer CPU cycles spend on large folders. One downside of this benefit though is that the file watcher is no longer automatically detecting folders in a workspace that are symbolic links on macOS. If you have such a setup, you can use the new files.watcherInclude setting to explicitly add the path of a symbolic link to be included for file watching. On the upside, you can use this new setting on Windows to explicitly include symbolic link folders inside the workspace - something that was not possible before on Windows.

You should not notice any regressions in your day to day work, but if file watching is broken for you, please report an issue back to us. A new setting files.legacyWatcher was added to forcefully enable the old watcher in case of problems.

Telemetry setting deprecation

telemetry.enableTelemetry and telemetry.enableCrashReporter have been deprecated in favor of telemetry.telemetryLevel. In future iterations, the settings will be phased out completely. telemetry.telemetryLevel allows higher configuration granularity now allowing users to select if they want to only allow error telemetry to be sent. Values of "error" or above will also enable the crash reporter.

Editor

More fine grained support for minimap transparency

It is now possible to configure the minimap background opacity independently of the minimap text's opacity using the newly added minimap.foregroundOpacity color.

Terminal

Fixed dimensions

Statically set terminal dimensions for cases when line wrapping can be jarring or disruptive using workbench.action.terminal.setDimensions.

Toggle wrapped lines

Toggle the terminal width between fitting the full contents and wrapped lines via kb(workbench.action.terminal.sizeToContentWidth) or using the tab context menu action Toggle Size to Content Width.

Run to Line action in breakpoints gutter

State

Extensions can benefit from knowing whether or not a terminal has been interacted with by the user. For example, an extension might want to wait until a user has interacted with the terminal to run an action.

Terminal state, including isInteractedWith, can now be known by extensions using:

export const onDidChangeTerminalState: Event<Terminal>;
readonly state: TerminalState;

Custom title and description

Terminal names are traditionally the name of the process they're associated with. Thus, it can be difficult to distinguish between them.

We now support configuring both title and description to help with this using variables described in terminal.integrated.tabs.title and terminal.integrated.tabs.description

Emoji IMEs

Emojis are now supported for IMEs on macOS.

Alt buffer active context key

Some terminal UI apps, like nano, use keybindings that are consumed by the workbench, which limits their functionality when integrated within VS Code. A new context key, TerminalContextKeys.altBufferActive, directs keybindings to the terminal instead of the workbench when the alt buffer is active to work around this.

Languages

New JavaScript and TypeScript language status item

The current TypeScript version and IntelliSense state are now shown in the language status item:

The JavaScript and TypeScript IntelliSense status item

Previously the TypeScript version was always shown the in status bar. You can pin the version to restore the old behavior:

Pinning the version status

The language status item also shows the current file's jsconfig/tsconfig and will indicate if you are currently in partial mode.

IntelliSense across opened files on github.dev

More consistent folding of JSX tags

When you fold a JSX tag in JavaScript or TypeScript, we now continue to show the closing tag:

Folding in JSX

This matches how folding works in HTML.

Preview Features

TypeScript 4.5 support

Restore terminal sessions across application restarts

When a VS Code window is closed, terminal processes get disposed of.

This iteration, we've added opt-in support for restoring the buffer and recreating the processes under configurable conditions found under terminal.integrated.persistentSessionReviveProcess.

Contributions to extensions

Jupyter

Debugging

VS Code now supports full debug features for Jupyter notebooks. To try it out, make sure you have ipykernel v6+ installed as your selected kernel, set a breakpoint, and select the Debug Cell command.

Debugging Jupyter notebook

Remote Debugging

You can also use Run by Line and debug Jupyter notebooks using remote kernels. To try it out, connect to your remote kernel with the Jupyter: Specify local or remote Jupyter server for connections command, make sure you have ipykernel v6+ installed as your selected kernel, and use Run by Line or debugging as usual.

GitHub Pull Requests and Issues

Work continues on the GitHub Pull Requests and Issues extension, which allows you to work on, create, and manage pull requests and issues. Check out the changelog for the 0.31.0 release of the extension to see the highlights.

Extension authoring

Webview UI Toolkit for Visual Studio Code

The Webview UI Toolkit is a component library for building webview-based extensions in Visual Studio Code.

Webview Toolkit Component Artwork

Features of the library include:

  • Implements the Visual Studio Code design language: Create extensions that have a consistent look and feel with the rest of the editor.
  • Automatic support for color themes: All components are designed with theming in mind and will automatically display the current editor theme.
  • Use any tech stack: The library ships as a set of web components, meaning developers can use the toolkit no matter what tech stack (React, Vue, Svelte, etc.) their extension is built with.
  • Accessible out of the box: All components ship with web standard compliant ARIA labels and keyboard navigation.

Test Tags and Non-Error Output

This month we shipped additional APIs for extensions building on the new testing APIs. Test tags allow you configure if and how certain tests can be run--or not. Non-error output allows you to associate additional console output with specific test cases. Messages from the output are displayed inline, similarly to failure messages.

Image showing "hello world" displayed inline beside a console.log statement

Platform-specific extensions

Extensions can now publish different VSIXs for each platform (Windows, Linux, macOS) VS Code is running on. We call such extensions platform-specific extensions. Starting with version 1.61.0, VS Code looks for the extension package that matches the current platform.

Platform-specific extensions are useful if your extension has platform-specific libraries or dependencies, so you can control the exact binaries that are included in a platform package. A common use case is the use of native node modules.

More about this can be found in our platform-specific extensions documentation.

Enable file system providers to declare a file as readonly

File system providers can now mark individual files as readonly via a new permissions property on the FileStat by setting the value of the property to FilePermission.Readonly. Readonly files are not editable.

Note: If all files should be treated readonly, you can use the existing isReadonly option when calling registerFileSystemProvider.

Settings editor extension categories

The Settings editor now displays a subtree for an extension's contributes.configuration endpoint when there are categories.

To create multiple categories, the contributes.configuration accepts an array of configurations, and the title key of each configuration is used for the section headings. There is also an order field, which allows categories to be reordered within the subtree.

New Extension table of contents showing CSS language features having its own subtree

Type hierarchy

The API proposal for adding type hierarchy providers has been finalized.

WebviewOptions.enableForms

Running web extension tests on test data

The @vscode/test-web node module offers a CLI and API to test web extensions in Chromium, Firefox, or Webkit.

New for this milestone is the option folderPath that allows to open VS Code for the Web on test data. An in-memory file system contains the resources of the given location so that tests have something to work with.

vscode-test-web --browserType=chromium --extensionDevelopmentPath=$extensionLocation $testDataLocation

Updated codicons

The following new icons were added to our codicon library:

List of codicon icons that were added

  • beaker-stop
  • bracket-dot
  • bracket-error
  • bracket
  • debug-continue-small
  • graph-line
  • graph-scatter
  • pie-chart

Proposed extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always, we want your feedback. This is what you have to do to try out a proposed API:

  • You must use Insiders because proposed APIs change frequently.
  • You must have this line in the package.json file of your extension: "enableProposedApi": true.
  • Copy the latest version of the vscode.proposed.d.ts file into your project's source location.

You cannot publish an extension that uses a proposed API. There may be breaking changes in the next release and we never want to break existing extensions.

TaskPresentationOptions close property

The close property, which is a presentation property in the tasks.json schema, is available in the TaskPresentationOptions API. It functions in the same way as the matching tasks.json property by controlling whether the terminal will be closed upon completion of the task.

Tabs API

An API for reading and manipulating tabs has been added as proposed API. This unblocks common feature requests such as wanting access to the list of open resources when there is not a backing textDocument. Please provide any feedback regarding this API in issue #133532.

MarkdownString.supportHtml

The newly proposed supportHtml property on MarkdownString enables rendering of a safe subset of raw HTML that appears inside the Markdown text.

supportHtml defaults to false. When disabled, VS Code will instead strip out any raw HTML tags that appear in the Markdown text.

Kernel preloads now use JavaScript modules

Quick Pick keepScrollPosition property

The keepScrollPosition property on the QuickPick object that you get back from window.createQuickPick() has been added as proposed API. This allows you to control whether or not the scroll position (cursorTop) in the Quick Pick moves back to the top of the list. There are a few use cases we had in mind for this API:

  • Implementing a "remove this item from the list" using the also proposed QuickPickItemButtons (for example, Ctrl/Cmd + P x QuickPickItemButton).
  • Implementing a "toggle this item in some way" using the also proposed QuickPickItemButtons (for example, Insert Snippet command).
  • Asynchronously loading items in the Quick Pick (like setInterval adding an item to the list by reassigning the .items property... scroll shouldn't jump to the top).

Without the ability to control it, every one of these operations would force the scroll position of the Quick Pick to jump up to the top of the list of picks. The keepScrollPosition allows extension authors to control this behavior.

Engineering

Switching to DOMPurify to sanitize rendered HTML

We've switched to use DOMPurify internally to sanitize HTML that is rendered in the main workbench. This is mainly used for sanitizing rendered Markdown.

DOMPurify is well maintained and compliant with trusted types out of the box. This switch helps protect users and gives us more confidence in enabling features such as MarkdownString.supportHtml.

Using the open command for Big Sur CLI

On macOS Big Sur, we now use the open command to spawn VS Code when launched from the command line. This change allows Code to open as though it were launched from the dock, which fixes some issues involving entitlements.

Notable fixes

  • 130407: [trivial] settings>files: exclude changing pattern as (blank) won't deletable
  • 133910: Show an error when resolving shell environment fails or is timing out
  • 133567: accessibility: the labels for the top-level tree nodes in find references all just read "true"
  • 133149: Task terminal marked failed for info/warning-level problems.
  • 133976: Allow to open a .code-workspace via protocol URL

Thank you

Last but certainly not least, a big Thank You to the following people who contributed this month to VS Code:

Contributions to our issue tracking:

Contributions to vscode:

Contributions to vscode-eslint:

Contributions to vscode-html-languageservice:

Contributions to vscode-json-languageservice:

Contributions to vscode-languageserver-node:

Contributions to vscode-pull-request-github:

Contributions to vscode-references-view:

Contributions to vscode-vsce:

Contributions to language-server-protocol:

Contributions to monaco-editor-webpack-plugin: