Test: Sticky Scroll Folding + UX feedback

[Yoyokrazy]

Refs: #188974, #191561, #191632

• anyOS @aiday-mar
• anyOS @cwebster-99

Complexity: 3

Create Issue

---

Summary:

Notebook sticky scroll has gone through a couple more improvements, and now brings folding of markdown ranges to the table. In addition, there are two different UX styles to try out: flat, and indented. Settings are listed below
'notebook.stickyScroll.enabled': 'true'
'notebook.stickyScroll.mode': 'flat'
'notebook.stickyScroll.mode': 'indented'

Steps to Test:

• Enable sticky scroll via either of the following
  • Use command palette View: Toggle Notebook Sticky Scroll
  • Use the setting in UI or json notebook.stickyScroll.enabled
• Open a notebook with an assortment of markdown headers
  • Endgame notebooks are a great spot to test this feature, I know we all have them open :)
  • You can find a couple examples littered in my testing repo

During the following, toggle the indentation mode a bit, and try to work up some feedback on which you would prefer to see. There are a couple other instances of sticky scroll to compare/contrast against throughout VS Code, so feel free to bring up points you would like to see from others.

• Scroll until you have a sticky line/header rendered, and do the following:
  • Ensure that the cell toolbar is not rendered above the sticky scroll (as shown in z-index issues with cell-title-toolbar #188974)
  • Open another editor view to the left of your notebook. It doesn't need to be in full view, just side by side. Ensure that the sash is rendering properly, and is not interrupted by a sticky line (as shown in z-index issues with notebooks sticky scroll #191632)
• Click on the sticky line to focus the md cell with that header, ensure it is visible in the viewport.
• Try folding sections of your notebook via the folding icon/chevron rendered in the sticky line.
• If you find any issues, I would greatly appreciate a gif of the bug, alongside the file you are using to test! Any overall UX feedback is appreciated as well!

---

Thanks so much for testing!

[aiday-mar]

Great work! I feel that the indented mode looks better, as it highlights the hierarchical structure of the notebook

[cwebster-99]

All looks good to me! I, too, prefer 'notebook.stickyScroll.mode': 'indented' because it helps me understand the organization of the notebook visually. To me, 'notebook.stickyScroll.mode': 'flat' doesn't fully represent the structure.