Shift + Enter Keyboard Shortcut Not Working in Quill 2.0.2

[unknown-user-github]

Hi Quill Team,

I am currently using Quill 2.0.2 on Windows 10 with Firefox 126.0.1. I encountered an issue with the "Shift + Enter" keyboard shortcut: it does not seem to work as expected. Specifically, when I press "Shift + Enter" while writing text in the editor, it always creates a new paragraph (

) instead of inserting a line break (
).

Here is a snippet of my current implementation:

var quill = new Quill('#editor', {
  theme: 'snow'
});

quill.keyboard.addBinding({
  key: 13,  // Enter key
  shiftKey: true
}, function(range, context) {
  quill.insertText(range.index, '\n');
  quill.setSelection(range.index + 1);
});

Could you help me understand what might be going wrong?

[kozi]

https://quilljs.com/docs/modules/keyboard#configuration

[lutzissler]

Isn’t this more about the fact that Quill doesn’t support line breaks (<br> tags) as any \n will be recognized as a new ‘row’ in Parchment?

[dstj]

I found #2872. This appears to be a long standing issue. Quite unfortunate, that was the last piece of the puzzle to migrate away from CKEditor5. :/

[lutzissler]

Try CodeMirror…

[dstj]

@lutzissler Thanks, but CodeMirror doesn't appear to have a toolbar for Bold, List, Headers, etc. It's specialized for code output. That's not my use case.

[lutzissler]

Sorry, meant the sister project, ProseMirror.

[kozi]

Is there any similar ProseMirror (or tiptap) based OpenSource solution?

[Diego-Franke]

We use an editor to manage our email templates. I resolved the visual alignment issue in the application by removing the top padding from the following CSS rule:

css

.quill-editor .ql-editor p {
    font-size: 14px;
}

This adjustment corrects the display issue. When rendering or sending the content, I apply the following transformations to format the output as desired:

php
// Replace <p><br></p> with <br> for standalone line breaks
$body = preg_replace('/<p><br><\/p>/', '<br>', $body);

// Replace </p><p> with <br> to combine paragraphs on the same line
$body = preg_replace('/<\/p>\s*<p>/', '<br>', $body);

This approach visually aligns the editor content while also formatting the HTML appropriately for rendering and sending.