Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Event missing using keymap #698

Open
guillermoamaral opened this issue Oct 31, 2024 · 2 comments
Open

Event missing using keymap #698

guillermoamaral opened this issue Oct 31, 2024 · 2 comments

Comments

@guillermoamaral
Copy link

guillermoamaral commented Oct 31, 2024

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!

@jaywcjlove
Copy link
Member

// 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.

@guillermoamaral
Copy link
Author

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants