Repository navigation
CM6: Line numbering misalignment, temporary font-size compression and unexpected fold arrow rendering on larger screens #4144
Description
p5.js version
No response
What is your operating system?
None
Web browser and version
No response
Actual Behavior
In the cm6 branch, the editor UI has a few visual inconsistencies compared to the current editor implementation.
The current editor (attached preview) renders correctly with proper line number alignment, stable spacing and expected behavior. However, in the cm6 branch, there are multiple UI regressions affecting readability and layout consistency.
- Line number alignment is off
- Font-size change causes temporary compression
- Unexpected function closing/fold arrow rendering on larger screens
Expected Behavior
The cm6 editor should match the behavior and visual consistency of the current editor:
- Properly aligned line numbers
- Stable layout during font-size changes (no temporary compression)
- No unexpected fold/function arrow rendering on larger screens
Steps to reproduce
Steps:
- Open the editor
- Open settings and try changing the font size
CM6 preview:
https://github.com/user-attachments/assets/fae89573-5b8a-4dbb-bc1f-f5ec79fc939d
Expected/Current:
Activity
parthjadhao01 commentedon Jun 2, 2026
Hi @khanniie, I'd like to work on this once it gets approved.
khanniie commentedon Jun 2, 2026
@parthjadhao01 sounds good! Thank you!
yugalkaushik commentedon Jun 2, 2026
@parthjadhao01 Just a suggestion, before directly jumping into the fix, check the develop branch first and compare the methods and CSS being used there with what is currently missing in the codemirror branch. It will help you understand the existing implementation better and identify gaps before making changes in the codebase.
parthjadhao01 commentedon Jun 2, 2026
Thanks for the suggestion! I'll make sure to check the develop branch first before making any changes
fix: restore CM6 editor visual consistency with CM5 #4144