microsoft / microsoft/vscode-notebook-renderers
Unnecessary scroll bars on plots and images
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 140
- Forks
- 44
- Avg merge
- 12d 9h
- Merged PRs (30d)
- 4
Description
When you use ipywidgets to interact with a matplotlib plot, it shows these black scrollbars even when there is no need to scroll:
This is due to this line of CSS, which specifies overflow: scroll on that image element:
https://github.com/microsoft/vscode-notebook-renderers/blob/06da5364c387f95b1bf811989ef75624c64e52f2/src/client/render.tsx#L85
This should be changed to overflow: auto. Not sure what that comment in the code about Jupyterlab means since these scrollbars do not appear in Jupyterlab.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Open src/client/render.tsx around line 85 and inspect the CSS applied to the image element, including the nearby JupyterLab comment. Change the unnecessary scrollbar behavior as described, then verify that interactive matplotlib plots and images no longer show scrollbars when their content does not overflow.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 1/5
- Estimated time
- Under an hour
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 52/100