search

microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
163.04k stars 28.8k forks source link

.NET Interactive Extension can change the background-color of the entire notebook editor #161515

Open IanMatthewHuff opened 2 years ago

IanMatthewHuff commented 2 years ago

I don't have permissions to transfer from dotnet repo. So recreating this issue here: https://github.com/dotnet/interactive/issues/2279 filed by: @burkeholland

Using an HTML code cell with .NET Interactive, if you set the background-color for the html tag, it changes the background for the whole notebook.

<style>
  html {
    background-color: white;
  }
</style>

https://user-images.githubusercontent.com/686963/191589817-ad8f0a94-bca2-493f-8c3a-5695627d7965.mp4

mjbvz commented 2 years ago

Just a quick note: we prevent this for markdown content by rendering in a shadow dom: https://github.com/microsoft/vscode/blob/f3f9f7a10d877fd2177daec3e1f6054706c7e5bc/extensions/markdown-language-features/notebook/index.ts#L279

However some users do want support for global css in their markdown (#125449). With the shadow dom approach, you also have to copy in external styles and it may break JS/CSS that relies on the output being part of the normal notebook dom

DonJayamanne commented 2 years ago

jupyter is one such extension that relies on this existing behaviour as Matt has pointed out. however this might help https://github.com/microsoft/vscode/issues/158714 @burkeholland /cc