Remove image preview in favor of core image previewer by lramos15 · Pull Request #341900 · microsoft/vscode

Logan Ramos (lramos15) · 2026-10-16T00:01:01Z

This helps reduce duplication across image carousel and the image preview extension

The built-in media-preview extension is removed. Its image, video and audio previews now live in core under src/vs/workbench/contrib/mediaPreview:

Shared ImageViewer: zoom, a context menu and Copy. Used by both the new core image editor and the image carousel, so the carousel now has a context menu.
Image editor: reloads on file changes, including changes reported by extension file systems. Supports view state, Save As, the Git LFS pointer message, and status bar zoom, dimensions and file size. The status bar also follows the focused side of media diffs.
Audio and video: rendered in a webview editor, because the workbench CSP doesn't allow blob: media sources.
Copy: PNG sources are copied as is. Other formats are encoded in a worker, with a main-thread fallback, which keeps the fix for the delayed copy from Fix image preview copy performance by using a worker for encoding #341783. Desktop writes through a new IClipboardService.writeImage, because the workbench window can't use clipboard-sanitized-write. Copy works with Cmd/Ctrl+C through the copy command and the browser's native copy event.
Compatibility: the editor IDs imagePreview.previewEditor, vscode.videoPreview and vscode.audioPreview are kept, and editors restored from the old custom editor are migrated.

How to test

Open PNG, JPEG, SVG, video and audio files. Check zoom, the context menu, Copy (including Cmd/Ctrl+C) and the status bar.
Compare two images and click each side. The status bar should follow the focused side.
Open the image carousel in the Agents window. Check the context menu and Copy, and navigate quickly between images.
Change an open image on disk. The preview should reload.

Validation

npm run typecheck-client: passed
npm run eslint -- <changed files>: passed
npm run valid-layers-check: passed
Hygiene pre-commit hook: passed
./scripts/test.sh --reporter dot with the 5 mediaPreview test files and the 2 imageCarousel test files: 40 passing
Manual check in Code OSS: image/video/audio previews, Copy, and the image diff status bar

Copilot

🟡 Changes recommended

Unresolved copying, refresh, navigation, and accessibility regressions prevent approval.

6 open findings

Web workbench no longer copies images with Cmd/Ctrl+C · New
Stale image loads commit after navigation · New
Media previews miss uncorrelated file change events · New
Removing worker encoding delays image copying · New
Viewer hides keyboard focus indicator · New
Media diff status bar information is cleared · New

What changed in this PR

Moves image, audio, and video previews from the bundled extension into the workbench, sharing image rendering with the carousel.

Changes:

Adds core preview editors, commands, status information, and legacy-editor migration.
Shares image zooming and copying, with browser and native clipboard support.
Removes the extension and updates tests, build configuration, and localization.

File	Description
src/vs/workbench/workbench.common.main.ts	Loads core media previews.
src/vs/workbench/test/electron-browser/workbenchTestServices.ts	Adds native clipboard stub.
src/vs/workbench/test/browser/componentFixtures/imageCarousel.fixture.ts	Provides context-menu service.
src/vs/workbench/services/clipboard/electron-browser/clipboardService.ts	Forwards image writes.
src/vs/workbench/contrib/mediaPreview/test/common/mediaPreview.test.ts	Tests LFS detection.
src/vs/workbench/contrib/mediaPreview/test/browser/mediaPreviewErrors.test.ts	Tests text-editor fallback.
src/vs/workbench/contrib/mediaPreview/test/browser/mediaPreviewEditorInputs.test.ts	Tests input behavior and saving.
src/vs/workbench/contrib/mediaPreview/test/browser/imageViewer.test.ts	Tests shared viewer behavior.
src/vs/workbench/contrib/mediaPreview/test/browser/imagePreviewEditor.test.ts	Tests asynchronous image reloads.
src/vs/workbench/contrib/mediaPreview/common/mediaPreview.ts	Defines preview identifiers and helpers.
src/vs/workbench/contrib/mediaPreview/browser/mediaPreviewStatusBar.ts	Displays preview metadata.
src/vs/workbench/contrib/mediaPreview/browser/mediaPreviewSaveAs.ts	Implements media Save As.
src/vs/workbench/contrib/mediaPreview/browser/mediaPreviewErrors.ts	Provides text-editor recovery.
src/vs/workbench/contrib/mediaPreview/browser/mediaPreviewActions.ts	Registers preview actions.
src/vs/workbench/contrib/mediaPreview/browser/mediaPreview.contribution.ts	Registers editors and migration.
src/vs/workbench/contrib/mediaPreview/browser/mediaPlayerEditorInput.ts	Implements audio/video previews.
src/vs/workbench/contrib/mediaPreview/browser/media/imageViewer.css	Styles the shared viewer.
src/vs/workbench/contrib/mediaPreview/browser/media/imagePreviewEditor.css	Styles image previews.
src/vs/workbench/contrib/mediaPreview/browser/imageViewer.ts	Shares rendering, zoom, and copying.
src/vs/workbench/contrib/mediaPreview/browser/imagePreviewEditorInput.ts	Defines image editor inputs.
src/vs/workbench/contrib/mediaPreview/browser/imagePreviewEditor.ts	Loads and watches image resources.
src/vs/workbench/contrib/imageCarousel/browser/media/imageCarousel.css	Uses shared viewer styling.
src/vs/workbench/contrib/imageCarousel/browser/imageCarouselEditor.ts	Adopts the shared viewer.
src/vs/workbench/contrib/imageCarousel/AGENTS.md	Documents shared viewer behavior.
src/vs/sessions/sessions.common.main.ts	Enables previews in Agents Window.
src/vs/platform/native/electron-main/nativeHostMainService.ts	Writes native clipboard images.
src/vs/platform/native/common/native.ts	Extends native clipboard contract.
src/vs/platform/clipboard/test/common/testClipboardService.ts	Records image writes in tests.
src/vs/platform/clipboard/common/clipboardService.ts	Adds image-writing API.
src/vs/platform/clipboard/browser/clipboardService.ts	Implements browser image writes.
src/vs/base/common/network.ts	Adds Git URI scheme constant.
extensions/vscode-api-tests/src/singlefolder-tests/env.test.ts	Replaces removed extension reference.
extensions/media-preview/tsconfig.json	Removes extension compiler configuration.
extensions/media-preview/tsconfig.browser.json	Removes browser compiler configuration.
extensions/media-preview/src/videoPreview.ts	Removes extension video provider.
extensions/media-preview/src/util/uuid.ts	Removes duplicated UUID helper.
extensions/media-preview/src/util/dom.ts	Removes extension HTML helper.
extensions/media-preview/src/util/dispose.ts	Removes extension disposal helper.
extensions/media-preview/src/ownedStatusBarEntry.ts	Removes extension status ownership.
extensions/media-preview/src/mediaPreview.ts	Removes extension preview base.
extensions/media-preview/src/imagePreview/zoomStatusBarEntry.ts	Removes extension zoom status.
extensions/media-preview/src/imagePreview/sizeStatusBarEntry.ts	Removes extension dimension status.
extensions/media-preview/src/imagePreview/index.ts	Removes extension image provider.
extensions/media-preview/src/extension.ts	Removes extension activation.
extensions/media-preview/src/binarySizeStatusBarEntry.ts	Removes extension file-size status.
extensions/media-preview/src/audioPreview.ts	Removes extension audio provider.
extensions/media-preview/README.md	Removes extension documentation.
extensions/media-preview/package.nls.json	Removes extension localization strings.
extensions/media-preview/package.json	Removes extension manifest.
extensions/media-preview/package-lock.json	Removes extension dependency lockfile.
extensions/media-preview/media/videoPreview.js	Removes video webview script.
extensions/media-preview/media/videoPreview.css	Removes video webview styles.
extensions/media-preview/media/loading.svg	Removes loading asset.
extensions/media-preview/media/loading-hc.svg	Removes high-contrast loading asset.
extensions/media-preview/media/loading-dark.svg	Removes dark loading asset.
extensions/media-preview/media/imagePreview.js	Removes image webview implementation.
extensions/media-preview/media/imagePreview.css	Removes image webview styles.
extensions/media-preview/media/audioPreview.js	Removes audio webview script.
extensions/media-preview/media/audioPreview.css	Removes audio webview styles.
extensions/media-preview/esbuild.mts	Removes Node bundling configuration.
extensions/media-preview/esbuild.browser.mts	Removes browser bundling configuration.
extensions/media-preview/.vscodeignore	Removes packaging exclusions.
extensions/media-preview/.npmrc	Removes extension npm configuration.
eslint.config.js	Removes extension entries; corrects comment.
build/npm/dirs.ts	Removes extension installation directory.
build/lib/i18n.resources.json	Registers core preview localization.
build/gulpfile.extensions.ts	Removes extension compilation entry.
.eslint-allowed-javascript-files	Removes deleted script exemptions.

Files not reviewed (1)

extensions/media-preview/package-lock.json: Generated file

🧠 Review effort: Balanced

💡 Configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Encode copied images in a worker and pass PNG sources through as is, handle the browser's native copy event, discard stale carousel image loads, refresh previews on uncorrelated file changes from extension file systems, keep the keyboard focus ring, and show status bar info for the focused side of media diffs. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

vs-code-engineering · 2026-10-20T14:43:33Z

📬 CODENOTIFY

The following users are being notified based on files changed in this PR:

Benjamin Christopher Simmonds (@benibenj)

Matched files:

src/vs/workbench/browser/parts/editor/sideBySideEditor.ts

Copilot

🟡 Changes recommended

Unresolved correctness and keyboard-accessibility regressions remain in media previews and image diffs.

6 open issues

6 resolved since last review

1 file not reviewed

extensions/media-preview/package-lock.json: Generated file

_{Review effort: Balanced}

Open the image context menu from the keyboard on the viewer's focus target, copy the image that is displayed rather than re-reading the file, show Git LFS and load errors within the preview so the other side of a diff stays visible, and make the zoom actions and status bar follow the focused side of image diffs. Tests now await signals or use faked timers instead of polling. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Logan Ramos (lramos15) requested review from TylerLeonhardt, Alexandru Dima (alexdima), Alex Ross (alexr00) and SteVen Batten (sbatten) as code owners October 16, 2026 00:01

Copilot AI balanced review requested due to automatic review settings October 16, 2026 00:01

Copilot started reviewing on behalf of Logan Ramos (lramos15) October 16, 2026 00:01

View session

Agent Host changes for lramos15/agents/image-preview-context-menu-fix

51d287a

Copilot AI reviewed Oct 16, 2026

View reviewed changes

Logan Ramos (lramos15) marked this pull request as draft October 16, 2026 00:19

Logan Ramos (lramos15) force-pushed the lramos15/agents/image-preview-context-menu-fix branch from 4425e2c to 6d61fcd Compare October 16, 2026 00:36

vs-code-engineering Bot assigned Logan Ramos (lramos15) Oct 16, 2026

Merge branch 'main' into lramos15/agents/image-preview-context-menu-fix

fa17a5b

Logan Ramos (lramos15) requested a balanced review from Copilot October 20, 2026 14:42

Logan Ramos (lramos15) marked this pull request as ready for review October 20, 2026 14:42

Copilot started reviewing on behalf of Logan Ramos (lramos15) October 20, 2026 14:43

View session

Alexandru Dima (alexdima) previously approved these changes Oct 20, 2026

View reviewed changes

Copilot AI reviewed Oct 20, 2026

View reviewed changes

Logan Ramos (lramos15) dismissed Alexandru Dima (alexdima)’s stale review via ea55903 October 20, 2026 15:23

Dmitriy Vasyura (dmitrivMS) approved these changes Oct 20, 2026

View reviewed changes

Ben Villalobos (benvillalobos) approved these changes Oct 20, 2026

View reviewed changes

roblourens approved these changes Oct 20, 2026

View reviewed changes

TylerLeonhardt approved these changes Oct 20, 2026

View reviewed changes

Logan Ramos (lramos15) merged commit e7d9908 into main Oct 20, 2026
55 of 60 checks passed

Logan Ramos (lramos15) deleted the lramos15/agents/image-preview-context-menu-fix branch October 20, 2026 18:06

vs-code-engineering Bot added this to the 1.144.0 milestone Oct 20, 2026

Eliel Vipata (elielvipata) mentioned this pull request Oct 23, 2026

Reconstruct batch 115/124: 2026-10-19 → 2026-10-21 (sessions, chat, agenthost, workbench) TechnicalPlaygroundOrg/vscode#115

Open

Caio Amaral (caioaamaral) mentioned this pull request Oct 29, 2026

Tab API: image, video and audio tabs no longer expose their URI since 1.144 (media preview moved to core) #344975

Closed

Navigation Menu

Repository navigation

Remove image preview in favor of core image previewer - #341900

Remove image preview in favor of core image previewer#341900
Logan Ramos (lramos15) merged 4 commits into
mainfrom
lramos15/agents/image-preview-context-menu-fix

Logan Ramos (lramos15) commented Oct 16, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

vs-code-engineering Bot commented Oct 20, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Conversation

Logan Ramos (lramos15) commented Oct 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

How to test

Validation

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

vs-code-engineering Bot commented Oct 20, 2026

📬 CODENOTIFY

Benjamin Christopher Simmonds (@benibenj)

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Logan Ramos (lramos15) commented Oct 16, 2026 •

edited

Loading