Skip to content

Conversation

@Hyd3r1
Copy link

@Hyd3r1 Hyd3r1 commented Jul 23, 2025

Problem

The / key wasn't opening the action list in the editor, particularly on mobile devices.

Investigation

Used event listener debugging to identify the root cause:

document.addEventListener('keydown', function(event) {
    console.log('Key pressed:', event.key);
    console.log('Key code:', event.keyCode);
});

Findings:

  • The slash key events were being captured but not properly handled
  • Mobile browsers handle keyboard events differently than desktop
  • Event propagation was being prevented before reaching the action list trigger

Solution

Enhanced the onKeyDown handler to properly detect and handle slash commands across all browsers and input methods:

if ((event.key === '/' ||
     event.keyCode === 191 ||
     event.which === 191 ||
     event.keyCode === 229 ||
     // [TODO] - event.code Slash works for both '/' and '?' keys
     event.code === 'Slash' ||
     event.key==='/') && !event.defaultPrevented) {
  const slate = findSlateBySelectionPath(editor, { at: editor.path.current });
  
  if (slate?.selection) {
    event.preventDefault();
    editor.showActionList();
    return;
  }
}

Key changes:

  • event.keyCode === 191 - Standard slash key code
  • event.which === 191 - Legacy browser support
  • event.keyCode === 229 - IME composition events (mobile)
  • event.code === 'Slash' - Modern physical key detection
  • Multiple event.key checks for redundancy

@vercel
Copy link

vercel bot commented Jul 23, 2025

@Hyd3r1 is attempting to deploy a commit to the dargo's projects Team on Vercel.

A member of the Team first needs to authorize it.

@Hyd3r1 Hyd3r1 marked this pull request as draft July 23, 2025 12:22
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

Successfully merging this pull request may close these issues.

1 participant