Skip to content

Reduce token usage of "add element to chat"#314201

Merged
kycutler merged 2 commits intomainfrom
kycutler/csscontext
May 4, 2026
Merged

Reduce token usage of "add element to chat"#314201
kycutler merged 2 commits intomainfrom
kycutler/csscontext

Conversation

@kycutler
Copy link
Copy Markdown
Contributor

@kycutler kycutler commented May 4, 2026

Closes #314188
Fixes #291005

Reduces the attachment size by ~97-99% or more on some sites. This is mostly by eliding CSS properties that have not been changed, as well as rules and variables that do not apply to the element.

Also removes the chat.sendElementsToChat.attachCSS setting as it shouldn't be necessary to toggle anymore.

Co-authored-by: Copilot <copilot@github.com>
Copilot AI review requested due to automatic review settings May 4, 2026 19:01
@kycutler kycutler self-assigned this May 4, 2026
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR reduces the context/token footprint of the Integrated Browser “Add Element to Chat” attachment by switching from attaching large, verbose CSS payloads to attaching a compact set of applicable author rules plus a filtered/resolved subset of computed properties and referenced CSS variables. It also removes the chat.sendElementsToChat.attachCSS setting, making CSS attachment effectively always-on.

Changes:

  • Remove the chat.sendElementsToChat.attachCSS configuration setting.
  • Introduce shared CSS compaction helpers to (a) format matched author styles and (b) collapse resolved computed longhands into shorthands where possible, with unit tests.
  • Update the element-inspection + attachment pipeline to attach the compact CSS payload unconditionally and to filter the hover/metadata computed-style record.
Show a summary per file
File Description
src/vs/workbench/contrib/chat/browser/chat.contribution.ts Removes the chat.sendElementsToChat.attachCSS setting registration.
src/vs/workbench/contrib/browserView/electron-browser/features/browserEditorChatFeatures.ts Makes CSS attachment unconditional and simplifies the attached element context formatting.
src/vs/platform/browserView/electron-main/browserViewElementInspector.ts Builds a compact CSS payload using new helpers; filters computed styles to key props + referenced vars.
src/vs/platform/browserView/common/cssHelpers.ts New helpers for formatting author rules and collapsing computed styles into shorthands.
src/vs/platform/browserView/test/common/cssHelpers.test.ts Adds unit coverage for shorthand collapsing and author-style formatting behavior.

Copilot's findings

  • Files reviewed: 5/5 changed files
  • Comments generated: 2

@kycutler kycutler marked this pull request as ready for review May 4, 2026 20:32
@vs-code-engineering
Copy link
Copy Markdown
Contributor

📬 CODENOTIFY

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

@jruales

Matched files:

  • src/vs/platform/browserView/common/cssHelpers.ts
  • src/vs/platform/browserView/electron-main/browserViewElementInspector.ts
  • src/vs/platform/browserView/test/common/cssHelpers.test.ts
  • src/vs/workbench/contrib/browserView/electron-browser/features/browserEditorChatFeatures.ts

@kycutler kycutler merged commit e0b5fc2 into main May 4, 2026
25 of 27 checks passed
@kycutler kycutler deleted the kycutler/csscontext branch May 4, 2026 21:36
@vs-code-engineering vs-code-engineering Bot added this to the 1.120.0 milestone May 4, 2026
@tigernasir-debug tigernasir-debug mentioned this pull request May 4, 2026
27 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Reduce context size of add element to chat rendered text was not passed in with the attachment

3 participants