[Bug]: Not working on VS Code `v1.78.0`

[microhobby]

Is there an existing issue for this?

• [X] I have searched the existing issues

Current Behavior

When executing Enable Vibrancy the process appears to execute successcully but after the restart nothing happens. Looking to the developer console, we have:

Refused to create a TrustedTypePolicy named 'VscodeVibrancy' because it violates the following Content Security Policy directive: "trusted-types amdLoader
                    cellRendererEditorText
                    defaultWorkerFactory
                    diffEditorWidget
                    diffReview
                    domLineBreaksComputer
                    dompurify
                    editorGhostText
                    editorViewLayer
                    notebookRenderer
                    stickyScrollViewLayer
                    tokenizeToString

Expected Behavior

Transparency applied to the VS Code Window

Steps To Reproduce

1. Update VS Code to v1.78.0
2. Run Enable Vibrancy
3. Restart

Environment

Version: 1.78.0
Commit: 252e5463d60e63238250799aef7375787f68b4ee
Date: 2023-05-03T20:09:00.748Z
Browser: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Code/1.78.0 Chrome/108.0.5359.215 Electron/22.4.8 Safari/537.36

Anything else?

No response

[hjnnjh]

The same problem, I have rolled back to v1.77.3

[Th3Gl0w]

The same problem, I have rolled back to v1.77.3

how did you rolled back?

[hjnnjh]

@Th3Gl0w I installed Vscode via homebrew, you can read my note to get the details of rollback.

[Filiperss]

I am having the same problem with the same errors.

[illixion]

Seems like the newest version of VSCode restricted CSP even further, so it’s no longer possible to create custom policies to load the necessary resources. I’ll see what can be done about this.

[minseok128]

plz···! fix it asap

[illixion]

Solution found, the issue was a lot simpler: the meta tag responsible for the CSP was updated, and the regex that was used to update it didn't account for the new format. I'm updating the relevant code to improve how this is handled and will push an update as soon as that's done.

[Th3Gl0w]

@Th3Gl0w I installed Vscode via homebrew, you can read my note to get the details of rollback.

🙏 Thanks 🙏

[illixion]

Updated version v1.1.15 is now available on the Marketplace, closing as completed.

[ShashwatPK]

Doesn't work in mac as well for v1.80 @illixion

[PedroCavaleiro]

Doesn't work in mac as well for v1.80 @illixion

Ensure that you have the plugin version v1.1.20 and reload Vibrancy (command + shift + p -> Reload Vibrancy)

I have it working on macOS Sonoma with VSCode v.1.80

After each VS Code update you must reload Vibrancy

[Miaozxje]

Doesn't work in mac as well for v1.80 @illixion

Ensure that you have the plugin version v1.1.20 and reload Vibrancy (command + shift + p -> Reload Vibrancy)

I have it working on macOS Sonoma with VSCode v.1.80

After each VS Code update you must reload Vibrancy

Its doesn't work on my machine either, this is my VSCode's "About" For OS, I'm using Windows 11 22H2 Version: 1.80.2 (system setup) Date: 2023-07-27T20:40:28.909Z Electron: 22.3.14 ElectronBuildId: 22695494 Chromium: 108.0.5359.215 Node.js: 16.17.1 V8: 10.8.168.25-electron.0 OS: Windows_NT x64 10.0.22621

[illixion]

Mind elaborating a bit on what you’re seeing on your end @Miaozxje? What steps did you take to enable Vibrancy, and did you get any errors? Also, ensure that your using a supported theme like Dark+.

[Miaozxje]

Mind elaborating a bit on what you’re seeing on your end @Miaozxje? What steps did you take to enable Vibrancy, and did you get any errors? Also, ensure that your using a supported theme like Dark+.

sorry for my lack of information I've followed all the step given in the docs but still, nothing happened and there wasn't any error given by VSCode (beside the warning that has been shown in the docs) and of course, I've switched to Dark+ like docs said

[illixion]

Mind elaborating a bit on what you’re seeing on your end @Miaozxje? What steps did you take to enable Vibrancy, and did you get any errors? Also, ensure that your using a supported theme like Dark+.

sorry for my lack of information I've followed all the step given in the docs but still, nothing happened and there wasn't any error given by VSCode (beside the warning that has been shown in the docs) and of course, I've switched to Dark+ like docs said

I'm unable to reproduce this issue with the same environment (though I'm using a user setup). Can you open the Developer Tools through VSCode's command palette and check the Console section for any errors when running the "Reload Vibrancy" action?

[Miaozxje]

Mind elaborating a bit on what you’re seeing on your end @Miaozxje? What steps did you take to enable Vibrancy, and did you get any errors? Also, ensure that your using a supported theme like Dark+.

sorry for my lack of information I've followed all the step given in the docs but still, nothing happened and there wasn't any error given by VSCode (beside the warning that has been shown in the docs) and of course, I've switched to Dark+ like docs said

I'm unable to reproduce this issue with the same environment (though I'm using a user setup). Can you open the Developer Tools through VSCode's command palette and check the Console section for any errors when running the "Reload Vibrancy" action?

nothing is showing on the console, thought there are logs of the extension show it's been actived

[illixion]

nothing is showing on the console, thought there are logs of the extension show it's been actived

It looks like Vibrancy has already been applied, as normal Dark+ looks a lot more different to what is in your screenshot. Please ensure that Vibrancy's opacity setting is not set to 1, which would render the whole window opaque, and also that you're not using VSCode in full-screen mode as it's not supported.

[Miaozxje]

nothing is showing on the console, thought there are logs of the extension show it's been actived

It looks like Vibrancy has already been applied, as normal Dark+ looks a lot more different to what is in your screenshot. Please ensure that Vibrancy's opacity setting is not set to 1, which would render the whole window opaque, and also that you're not using VSCode in full-screen mode as it's not supported.

I'm using window mode and here is the list of VSCode default theme, and also I had set opacity to 0.5

[illixion]

I'm using window mode and here is the list of VSCode default theme, and also I had set opacity to 0.5

I'm not sure why it's not transparent for you then, it looks like it should be working. Perhaps you have other extensions that modify VSCode's files in some way? Also, please try re-installing VSCode (or installing the Insider edition if you just want to test), sometimes that can solve problems with Vibrancy as well.

[Miaozxje]

I'm using window mode and here is the list of VSCode default theme, and also I had set opacity to 0.5

I'm not sure why it's not transparent for you then, it looks like it should be working. Perhaps you have other extensions that modify VSCode's files in some way? Also, please try re-installing VSCode (or installing the Insider edition if you just want to test), sometimes that can solve problems with Vibrancy as well.

these are extensions that I've installed in my VSCode, and I doesn't modified any thing in settings.json file that are impacted the theme

[PedroCavaleiro]

Something there must be interfering I'm not even using the theme Dark+ but it's working nonetheless

Attempt to disable the vscode-icons and vscode-pets as they might be causing some issues, the rest I can't be really sure

[Miaozxje]

Something there must be interfering I'm not even using the theme Dark+ but it's working nonetheless

Attempt to disable the vscode-icons and vscode-pets as they might be causing some issues, the rest I can't be really sure

still not working, do you have any idea what may cause this problem

[PedroCavaleiro]

If I understand correctly the plug-in changes the CSS of VSCode (the the error when you enable it) correct me if I’m wrong

I would start by disabling all extensions (except Vibrancy ofc) and enabling one by one and see which one (if any) is causing the conflict

If with 0 extensions, aside this one, enabled you still can’t get the transparency I would guess one Windows update screwed with something that this extension relies on

This extension works on Windows and macOS by using their APIs if either Apple or Microsoft make some breaking changes to the API it might result in the extension stop working. This is all the help I can give. Anything more in detail only the developer can help

[Miaozxje]

If I understand correctly the plug-in changes the CSS of VSCode (the the error when you enable it) correct me if I’m wrong

I would start by disabling all extensions (except Vibrancy ofc) and enabling one by one and see which one (if any) is causing the conflict

If with 0 extensions, aside this one, enabled you still can’t get the transparency I would guess one Windows update screwed with something that this extension relies on

This extension works on Windows and macOS by using their APIs if either Apple or Microsoft make some breaking changes to the API it might result in the extension stop working. This is all the help I can give. Anything more in detail only the developer can help

I have disable all extionsions, beside this one, and still cannot get transparency. It seem like Microsoft had updated something on their API(s) that the extension not working properly. But the part that me couldn't understand that there was no error was shown in the Developer Console

[illixion]

@Miaozxje what sort of computer do you have? Is it a laptop or a PC, and which GPU does it have? I think it's more likely to be a GPU driver issue or a laptop power-saving feature that causes this. I'd recommend reinstalling VSCode as I've suggested earlier, as well as making sure that your GPU drivers are up-to-date. Also, does transparency work in the Windows Terminal app?

[Miaozxje]

rolling back to VSCode 1.77.3 and there are errors similar to the first person create this issue

[illixion]

Roll back Vibrancy to 1.1.14, the fix for newer versions may not be compatible with older VSCode releases.

[Miaozxje]

@Miaozxje what sort of computer do you have? Is it a laptop or a PC, and which GPU does it have? I think it's more likely to be a GPU driver issue or a laptop power-saving feature that causes this. I'd recommend reinstalling VSCode as I've suggested earlier, as well as making sure that your GPU drivers are up-to-date. Also, does transparency work in the Windows Terminal app?

I'm using laptop with no power-saving turning on. My GPU is GTX 1050Ti GPU with the lastest driver installed. And no, the transparency doesn't working in the Windows Terminal

[Miaozxje]

rolling back both VSCode to 1.77.3 and Vibrancy to 1.1.14 does not resolve this issue

I might thing this problem came from some windows settings (?)

[illixion]

Alright, I think I've figured it out, you've probably disabled transparency effects globally in Accessibility settings. I'm able to reproduce this issue with it disabled. Check out this screenshot for where to find it:

[Miaozxje]

Alright, I think I've figured it out, you've probably disabled transparency effects globally in Accessibility settings. I'm able to reproduce this issue with it disabled. Check out this screenshot for where to find it:

Turn on Transparency in this setting can make my VSCode turn transparency. (VSCode 1.80.2 and Vibrancy 1.1.20) Please add this into the document so others can fix this issue

[Miaozxje]

just another small buggy thing, this part of VSCode doesn't have transparency

[illixion]

This is because you have Native Window Controls enabled, which is a default setting and Vibrancy does try to disable it automatically, but it seems like it wasn’t successful in your case. You can disable this manually in VSCode settings to fix this issue.

[Miaozxje]

thank you, that resolved the issue