Quill keyboard bindings: add a shortcut without breaking normal editing

An original maintenance-note form has a visible “Prepare review” button. Its keyboard shortcut should capture the current note for that same review step, while Enter must still create paragraphs and code blocks must retain their editing behavior. The shortcut should not become an invisible second save implementation.

Define the shortcut while constructing the editor

In application code where Quill 2 is loaded, configure the binding before initialization finishes:

function createMaintenanceEditor(element, prepareReview) {
  return new Quill(element, {
    theme: 'snow',
    modules: {
      keyboard: {
        bindings: {
          prepareMaintenanceReview: {
            key: 'Enter',
            shortKey: true,
            shiftKey: false,
            altKey: false,
            handler: function (range, context) {
              if (context.format['code-block']) return true;
              prepareReview(this.quill.getContents());
              return false;
            }
          }
        }
      }
    }
  });
}

Load the application's usual Quill styles and retain any other required options when adapting this fragment. element is the intended editor container. prepareReview is the application's existing callback that opens or updates a review step; this code captures a Delta and does not persist or submit it by itself.

The ordinary function syntax preserves the keyboard module's documented this binding. An arrow function would capture its surrounding this instead, so this.quill would no longer refer to the module's editor through that mechanism.

Give the binding a distinct name. A configuration entry that reuses the name of a default binding can replace that named entry. prepareMaintenanceReview makes the application-specific purpose clear and avoids relying on an accidental name collision.

Decide which handler receives the key

The handler checks whether the cursor is in a code block. Returning true delegates that case to later handlers. For the ordinary note, it calls the review callback and consumes the shortcut. Quill runs matching handlers synchronously in their registered order; the return value controls that chain.

If a binding added later with quill.keyboard.addBinding() seems to have no effect, inspect earlier handlers for the same key and modifiers. Quill's defaults are registered during initialization. An added handler does not automatically move ahead of them. Put a required override in the initial configuration and preserve ordinary behavior for the contexts your override does not handle.

Context can also restrict a binding by selection state, line offset, or active formats. Use those restrictions for a real editing rule, such as an action that only applies to a collapsed cursor. Avoid a document-wide keydown listener that bypasses the editor's model and consumes keys even when the note is not focused.

Keep the visible button and shortcut consistent

Connect the visible button to the same review operation using the same current editor instance:

prepareButton.addEventListener('click', () => {
  prepareReview(quill.getContents());
});

Here quill is the instance returned from createMaintenanceEditor, and prepareButton is the application's type="button" control. Keep the shortcut instruction near that control and use the correct platform wording. People should be able to discover and invoke the action without knowing the shortcut.

If preparing a review involves asynchronous work, put pending-state handling, failure feedback, and duplicate-request prevention inside the shared application operation. Do not rely on the keyboard handler's return value to report that a server saved the note. It only controls keyboard-handler propagation.

Exercise the surrounding editing behavior

Use a fictional note with the sentence “Replace the intake filter” and a separate code block containing a diagnostic command. Test the shortcut in the paragraph and confirm the review step receives the current sentence. Edit the final word and invoke it again so the second capture cannot be an older snapshot.

Then check the nearby behavior:

Run these checks on the keyboard layouts and browsers the application supports. A shortcut that conflicts with an operating-system or browser command needs a different product choice; a JavaScript binding cannot guarantee that every environment delivers the key.

The Quill document import guide covers loading and capturing supported content. Once the shortcut opens the intended review step, read its captured intake-filter instruction and let the application's explicit submission control handle the actual save or handoff.