Tabbing Gets Stuck in Code Editor

[Jatin24062005]

p5.js version

No response

What is your operating system?

None

Web browser and version

No response

Actual Behavior

When using the p5.js Web Editor, pressing the Tab key inside the Code Editor causes the focus to get trapped. It behaves like an indentation key (which is expected in a code editor), but this results in an infinite tab trap, making it impossible for users to navigate to any UI components outside the editor using only the keyboard

Expected Behavior

Users should be able to press a keyboard shortcut (e.g., Esc or Ctrl + M) to exit the editor and resume normal tab focus movement across the interface.

Alternatively, consider adding an invisible but focusable element after the editor to allow users to tab out.

Steps to reproduce

Steps:

1. Open the p5.js Web Editor
2. Click inside the code editor
3. Press the Tab key repeatedly
4. Notice that focus never leaves the editor

// Paste your code here :)

[raclim]

Thanks so much for opening this issue, this is a great catch!

Just a quick note: since we're currently in the process of upgrading CodeMirror to version 6, it might be best to use v6 as the reference point for any further investigation into this issue. Alternatively, it could make sense for us to wait until the new version is fully released. I’m going to temporarily add the “On Hold” label to reflect that, but just something to keep in mind here!

[yugalkaushik]

While working on this issue I noticed many buttons and components in editor lacks tab behavior. Is it from some specific CSS or something.