gaucho-labs/leptos-hotkeys

Panic when autocomplete on input is triggered

boyswan opened this issue · 1 comments

boyswan commented

When triggering autocomplete of an input, onkeydown does not return a true leptos::ev::KeyboardEvent like it is typed in leptos. This causes a panic in leptos-hotkeys. Testing in latest chrome.

Uncaught TypeError: Cannot read properties of undefined (reading 'length')
    at passStringToWasm0 (leppy.js:100:31)
    at imports.wbg.__wbg_key_dccf9e8aa1315a8e (leppy.js:1445:14)
    at web_sys::features::gen_KeyboardEvent::KeyboardEvent::key::h05b0022609f7fd9a (leppy.wasm:0x1657789)
    at leptos_hotkeys::hotkeys_provider::provide_hotkeys_context::{{closure}}::{{closure}}::{{closure}}::hc8c6175319fb3a5f (leppy.wasm:0x150315d)

I have run into the same bug myself and have worked around it via:

  let on_keydown = move |e: leptos::ev::KeyboardEvent| {
    // The original event can sometimes actually be a regular Event
    // in the case of textfield autocomplete instead of keydown.
    // the leptos KeyboardEvent is wrong.
    let event: Option<&web_sys::Event> = e.dyn_ref();
    if let Some(event) = event.cloned() {
      if let Ok(e) = event.dyn_into::<KeyboardEvent>() {
        if let Some(target) = e.target() {
          if let Ok(input_element) = target.dyn_into::<HtmlInputElement>() {
             // .... we know e.keys() exists here
            }
          }
        }
      }
    }
  };

I'll open an issue in leptos and link this one!