I keep trying to get tabs to focus on the CodeMirror 6 Editor but it keeps shifting to other focusable elements, even after following the instructions CodeMirror Tab Handling Example. Here is a link to a demo displaying what I mean: https://codepen.io/okikio/pen/NWjzyRG?editors=0010
Interesting. I can see the issue in the codepen, but I can’t reproduce it locally with the same code. Keymaps in general don’t seem to work on that codepen (but do work for everybody else). If I simplify the code in the codepen to this, it works again:
import { keymap , EditorView } from "https://cdn.skypack.dev/@codemirror/view";
import { EditorState } from "https://cdn.skypack.dev/@codemirror/state";
import { defaultTabBinding, defaultKeymap } from "https://cdn.skypack.dev/@codemirror/commands";
let editor = new EditorView({
state: EditorState.create({
doc: "abc",
extensions: [
keymap.of([...defaultKeymap, defaultTabBinding]),
]
}),
parent: document.querySelector("#editor")
});
I think skypack is messing something up by duplicating dependencies, and that’s where the problem originates.