Event missing using keymap
Hello sr!
For some reason that I ignore, after upgrading version (I guess that was what happen), I stop getting the event in the handler of an extra key specified in keymap (and I do need to stop event propagation):
<CodeMirror
extensions={[Prec.highest(keymap.of(this.extraKeys()))]}
theme={this.theme()}
value={value}
onChange={this.valueChanged}
/>
extraKeys() {
return [
{
key: "Enter",
run: this.enterPressed,
},
{
key: "Shift-Enter",
run: this.enterPressed,
},
];
}
enterPressed = (editor, event) => {
if (event.shiftKey || event.altKey) {
event.stopPropagation();
return;
}
event.preventDefault();
if (this.props.onAccept) this.props.onAccept();
this.clear();
return true;
};
Any help is wellcome. Thanks!
// Define custom key bindings
const myKeymap = [
{
key: "Ctrl-s",
run: (view) => {
console.log("Save triggered!"); // Action to be taken when "Ctrl-s" is pressed
return true; // Return true to indicate the key was successfully handled
},
preventDefault: true, // Prevents the default browser action for this key
},
{
key: "Ctrl-b",
run: (view) => {
console.log("Bold formatting triggered!"); // Action to be taken when "Ctrl-b" is pressed
return true; // Return true to indicate the key was successfully handled
},
preventDefault: true, // Prevents the default browser action for this key
},
];
<CodeMirror
extensions={[...myKeymap]} // Add keymap as an extension in the editor setup
/>
@guillermoamaral I’m not sure where the issue is, so here’s an example for your reference.
Thanks!
The issue was that my hanlders (e.g., enterPressed = (editor, event)), expected (and received in a previous version) the event as a second parameter (with which they did things like event.preventDefault()). For some reason that stop happening and my handlers broke because event argument was undefined. I changed my code to use the property preventDefault and remove event argument from my handlers.