Skip to content

Reinstate colors of symbol codicons when used in custom tree views#320391

Open
gjsjohnmurray wants to merge 1 commit into
microsoft:mainfrom
gjsjohnmurray:fix-299479
Open

Reinstate colors of symbol codicons when used in custom tree views#320391
gjsjohnmurray wants to merge 1 commit into
microsoft:mainfrom
gjsjohnmurray:fix-299479

Conversation

@gjsjohnmurray

Copy link
Copy Markdown
Contributor

This PR fixes #299479

Issue was caused by #267787

Copilot AI review requested due to automatic review settings June 8, 2026 10:48

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Updates tree view icon rendering so theme icons without an explicit color get a fallback CSS class applied.

Changes:

  • Add codicon-colored class when node.themeIcon has no color configured.

Comment on lines 1474 to 1477
templateData.icon.style.color = this.themeService.getColorTheme().getColor(node.themeIcon.color.id)?.toString() ?? '';
} else {
iconClass = iconClass + ' codicon-colored';
}

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

This issue appears to predate this PR

@gjsjohnmurray

Copy link
Copy Markdown
Contributor Author

Validated using the extension-samples branch documented at #299479 (comment)

image

@n-gist

n-gist commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

@gjsjohnmurray can #311339 be affected by this? (SVG currentColor is not replaced by current theme colors, resulting in black unless color is set explicitly)
I can test something if needed.

@n-gist

n-gist commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

@gjsjohnmurray did some testing of this PR, maybe I'm doing something wrong, but can't confirm colors fallback to defaults:

tvicons

Icons assigned as TreeItem.iconPath = new ThemeIcon(codiconId)

Can be related to the issue - even some debug-* icons which are colored in window.createQuickPick() don't get colored when used in the tree view.

@gjsjohnmurray

Copy link
Copy Markdown
Contributor Author

@n-gist is the source of your test extension available somewhere? I'm puzzled that symbol-* codicons aren't colored in the quickpick.

@n-gist

n-gist commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

@gjsjohnmurray it is not released yet, but I can share current version. Do you need source code or vsix would be enough? Send it somewhere?
For quickpick, it doesn't supports custom colors, but theme icons are supported, at least those inferred from resourceUri #308704

@n-gist

n-gist commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

@gjsjohnmurray sent an invite to https://github.com/n-gist/temp.vscode.focus

To test icons - open a project and drop some files/folders to the extension view, and their icons will be customizeable.
To be free from resourceUri effects - create a group item by Arrange > Group, and customize its icon instead.

Customize > Icon for edit the value used in new ThemeIcon(id, color), format - id or id, color, like heart, problemsErrorIcon.foreground.

Customize > Icon Select is similar but through quickpick built over a list of builtin codicon ids.

Open issue in repo for any needs, I would be happy to assist with testing/fixing icons issues.

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.

Symbol theme icons are no longer colored when used in custom tree view items

4 participants