Keyboard not updating for repeated key press about dash-extensions HOT 9 CLOSED

Works perfectly! Many thanks for the quick update! 🥇

from dash-extensions.

It is the general convention in Dash that callbacks are only fired, when a property changes. If you press the key twice, the value does not change and the callback not firing is expected behavior.

That being said, i agree that it is a limitation that subsequent key presses cannot be captured. One possible solution could be to add an n_keydowns (like n_clicks for buttons) property, which changes every time a key press event occurs. What do you think?

from dash-extensions.

@emilhe Yes, n_keydowns seems like complaint with the standard html components as I just found out.

Would you (or the maintainer of this repo, whoever that may apply) want a PR?
Or I can also wait for this to be fixed, though this is kind of blocking me (I also kind of don't want to roll my own component just for this), so it will be good to know what's the priority of this for the maintainer, thanks!

from dash-extensions.

I am the maintainer of this repo, and i always happy to look at a PR :). But this seems like a rather simple feature, so i just made an attempt to implement it right away. You can try it out here,

https://pypi.org/project/dash-extensions/0.0.29rc1/

Let me know if it works as intended and/or you have ideas on how to improve the syntax. Here is a small example,

import dash
import dash_html_components as html
import json

from dash.dependencies import Output, Input
from dash_extensions import Keyboard

app = dash.Dash()
app.layout = html.Div([Keyboard(id="keyboard"), html.Div(id="output")])


@app.callback(Output("output", "children"), [Input("keyboard", "keydown"), Input("keyboard", "n_keydowns")])
def keydown(event, n_keydowns):
    return f"{json.dumps(event)}\n{n_keydowns}"


if __name__ == '__main__':
    app.run_server()

You can install from pip like this,

pip install https://files.pythonhosted.org/packages/8a/9f/96d7cf5caf0d068d7b1763ff35316e8e61e842956edb81949c8dbf9598ca/dash-extensions-0.0.29rc1.tar.gz

from dash-extensions.

@emilhe Wow thanks for the quick update!

import dash
import dash_html_components as html
import json

from dash.dependencies import Output, Input, State
from dash_extensions import Keyboard

app = dash.Dash()
app.layout = html.Div([Keyboard(id="keyboard"), html.Div(id="output")])


@app.callback(Output("output", "children"), [Input("keyboard", "n_keydowns")],
              [State("keyboard", "keydown")])
def keydown(n_keydowns, event):
  print(event, n_keydowns)
  return json.dumps(event)


if __name__ == '__main__':
  app.run_server(debug=True)

I was trying the above and ran into the following JS errors:

react_devtools_backend.js:2273 Error: Invalid argument `n_keydowns` passed into Keyboard with ID "keyboard".
Expected `object`.
Was supplied type `number`.
Value provided: 1

The only essential difference between your example and mine is the app.run_server(debug=True). Seems like under debug mode some JS type assertion is triggered?

from dash-extensions.

Ah, yes. Good catch! I made a mistake in the prop definition (i didn't notice as i didn't test with debug=True). Try (0.0.29rc2),

pip install https://files.pythonhosted.org/packages/51/bd/4aae6a805f13ed829897255a10224af5d0f3cbf38de9bb242e207abfb441/dash-extensions-0.0.29rc2.tar.gz

https://pypi.org/project/dash-extensions/0.0.29rc2/

from dash-extensions.

May I please suggest that the n_keydowns property gets added to the README? I think it's a crucial feature, to be able to catch multiple of the same key presses in a row, but I had to dig through the source code/closed issues to find it! Thank you very much for this useful library.

from dash-extensions.

See #47

from dash-extensions.

This thread helped me as well. Thanks.

Problem: If you press the keys too fast, it creates several callbacks.
Ideas: Maybe a way to prevent the key press event before finishing the execution of the previous callback.
Or, maybe simpler, setting a minimum time between 2 key press events, such as 0.5s.

from dash-extensions.