Inspector Icons not visible

[RPossberg]

Environment (please complete the following information):

• OS (Windows 11 Pro 23H2): Build 22635.3139

• Extension version (Insiders v2.1.4):
  The extension version can be found by hovering or selecting "Microsoft Edge Tools for VS Code" in the VS Code Extensions Marketplace panel.

Describe the bug:
The icons used to navigate the tools are not displaying and cannot be read unless hovering the mouse.

Repro steps:
The error has been occurring when opening Edge Dev Tools in VS Code Insiders Edition since even before todays update. When opening in VS Code, the tool window icons work and are visible with no issue.

Expected behavior:
To work as is it does in the standard release.

Additional context:

See attached comparison screen shots

[captainbrosset]

Thanks for filing. Marking this as part of our backlog for investigation.

[captainbrosset]

@RPossberg I just talked to one of our engineers, and they said it could be a problem with Edge not being up to date on your device.

The new version (2.1.4) has already been published and the icons seem to look fine there. It could be that the extension points to a browser version that's out of date and doesn't have the icon fix.

Could you please try updating browser versions on your device and see if that resolves the problem?

[vidorteg]

Just to add to the previous answer (thank you @captainbrosset 👍) you could also try a different channel. I was able to repro it with the latest insider version and Canary/Dev but works as expected on the latest stable:

[RPossberg]

@captainbrosset
I initially considered the browser as a possible problem and after updating and checking, I then submitted this error as a possible bug. Since then I tried again with the stable release, this time using the "Generate launch.json" option, and now the problem is present in the stable version as well. Version 1.86

[vidorteg]

Hi @RPossberg,

I'm having a difficult time reproing the issue, this is how it looks for me on the latest vscode insider (stable channel):

• How do your Extension settings look like?
• Do you have headless enabled or disabled? (Extension settings)

As an example this is my setting look in the same machine:

[RPossberg]

@vidorteg I've tried all the Browser flavor settings, still no difference.

1. Updated latest RTX Nvidia drivers and still the same.
2. Tried to run from a VMware machine on a 3rd display, and same issue.
3. Updated Edge Browser Version 122.0.2365.16 (Official build) stable app, beta channel (64-bit)
4. Works as expected in the external browser, not in the IDE
5. Tried re-installing VS Code Insiders Version: 1.87.0-insider (user setup)

[vidorteg]

Thank you for your patience in this issue. I am able to repro the bug, my initial investigation currently points that this is an issue affecting only Edge 122+ versions (Beta, Dev and Canary). A temporary workaround is to select the stable (121) channel from the extension settings. We will investigate more and come back with a fix. Thanks for reporting this

[ColinConwell]

+1 to say I am seeing this issue with the following specs:

MacOS: 2016 M1 Max Sonoma 14.3.1
VSCode: 1.86.2 (Universal)
Edge: 122.0.2365.52 (Official build) (arm64)

[Fefedu973]

Same issue

Version: 1.86.2 (user setup)
Commit: 903b1e9d8990623e3d7da1df3d33db3e42d80eda
Date: 2024-02-13T19:40:56.878Z
Electron: 27.2.3
ElectronBuildId: 26908389
Chromium: 118.0.5993.159
Node.js: 18.17.1
V8: 11.8.172.18-electron.0
OS: Windows_NT x64 10.0.26058

Edge:
Version 122.0.2365.52 (Version officielle) application stable, canal beta (64 bits)

[jandersen-yahoo]

Same. Thanks

Version: 1.86.2 (system setup)
Commit: 903b1e9d8990623e3d7da1df3d33db3e42d80eda
Date: 2024-02-13T19:40:56.878Z
Electron: 27.2.3
ElectronBuildId: 26908389
Chromium: 118.0.5993.159
Node.js: 18.17.1
V8: 11.8.172.18-electron.0
OS: Windows_NT x64 10.0.19044

Edge for Business:
Version 122.0.2365.52 (Official build) (64-bit)

[zhuxining]

Same issue

vscode
版本: 1.86.2
提交: 903b1e9d8990623e3d7da1df3d33db3e42d80eda
日期: 2024-02-13T19:42:12.210Z
Electron: 27.2.3
ElectronBuildId: 26908389
Chromium: 118.0.5993.159
Node.js: 18.17.1
V8: 11.8.172.18-electron.0
OS: Darwin arm64 23.3.0

---

Microsoft Edge Developer Tools for Visual Studio Code
版本: 2.1.4

---

Microsoft Edge
版本 122.0.2365.59 (正式版本) (arm64)

[velocd]

Ditto. And I think v122 is now stable since selecting "Stable" channel in the extension settings doesn't workaround the bug anymore.

macOS Sonoma 14.3.1
Microsoft Edge Tools for VS Code 2.1.4
Microsoft Edge Version 122.0.2365.59 (Official build) (arm64)

VS Code Version: 1.87.0 (Universal)
Commit: 019f4d1419fbc8219a181fab7892ebccf7ee29a2
Date: 2024-02-27T23:42:56.944Z
Electron: 27.3.2
ElectronBuildId: 26836302
Chromium: 118.0.5993.159
Node.js: 18.17.1
V8: 11.8.172.18-electron.0
OS: Darwin arm64 23.3.0

[vidorteg]

Hi everyone,

Thank you the reports, the Devtools team is investigating the issue and we will put out a fix for this soon.

[vidorteg]

We just released v2.1.5 which should address this issue.