googlearchive / core-a11y-keys Goto Github PK

right now el.fire('keydown', { keyIdentifier: 'Left'}) won't be picked up by core-a11y-keys because keyboardEventToKey is looking directly on the event object for the key information. It would be great to also be able to simulate key presses without going through the pain of creating native key events and dispatching them (since e.g. the modern KeyboardEvent constructor isn't supported yet in IE, initKeyboardEvent is (was?) buggy in Safari, etc).

AFAICT we could get away with just adding an additional transformKeyIdentifier(ev.detail.keyIdentifier) to the creation of normalizedKey at https://github.com/Polymer/core-a11y-keys/blob/master/core-a11y-keys.html#L226 (or .key, since the comments indicate you prefer it over keyIdentifier). 🎅 👍

http://www.polymer-project.org/components/core-a11y-keys/demo.html from 0.4.1 doesn't log keys when I focus the grey box.

This was done for paper-shadow (https://github.com/Polymer/paper-shadow/blob/master/paper-shadow.html#L28) and makes it convenient to use the element without data binding features.

I have this paper-input based statement:

<base-phone-number-input label="{{inputLabel}}" id="PhoneNumber" on-phone-number-validation-error="{{validationError}}" value="{{phoneNumber}}"></base-phone-number-input>

I have this core-a11y-key statement:

<core-a11y-keys target="{{}}" keys="enter tab" on-keys-pressed="{{handleKeypress}}"></core-a11y-keys>

Then following function returns an empty this.phoneNumber even if I input value into the input.

handleKeypress: function(e, detail) {
        console.log("Key pressed: "+detail.key+" phoneNumber: "+this.phoneNumber);
}

Any ideas?

ex. https://github.com/esprehn/chromium-codereview/blob/master/ui/components/cr-keyboard.html

I like to do something like:

<core-a11y-keys prevent-default="false" ...></core-a11y-keys>

so that if for example the target is a textbox and keys="up" the cursor still moves...

My key-target and paper-input is in a conditional template, like the core-a11-keys listener is too. When displaying the template first everything works nicely. But when hiding and showing the template again, the key-press listener is not working no more.

Code is like this:

<template if="{{ showInput }}">
  <paper-input id="myinput"></paper-input>
  <core-a11y-keys target="{{ $.myinput }}" on-key-pressed="{{ doSomething }}></core-a11y-keys>
</template>

When removing the target the key-event is captured and everything back to normal.

Any ideas? I tried to look at the attach and detach methods of the core-a11y-keys, which seem to work as proposed. The target property contains the right DOM node, but i'm not sure whether it is already attached to the page again or not...

Here is a test case: http://jsbin.com/qemacahatu/1/edit?html,console,output