search

PolymerElements / gold-phone-input

An input element that only allows phone numbers
https://webcomponents.org/element/PolymerElements/gold-phone-input
13 stars 30 forks source link

Documentation states "change" should be fired when the input changes due to user interaction. #77

Closed GeoffAtHome closed 7 years ago

GeoffAtHome commented 7 years ago

Description

Documentation states "change" should be fired when the input changes due to user interaction.

Expected outcome

'change' event should be fired.

Actual outcome

No 'change' event seen.

Steps to reproduce

Use element as below: <gold-phone-input label="" country-code="44" phone-number-pattern="XXXX-XXX-XXX" auto-validate on-change="_inputHasChanged"

_inputHasChanged is never called.

With a listeners listeners: { 'change': '_inputHasChanged', },

_inputHasChanged is never called.

Similar issues seen with gold-email-input.

Browsers Affected

notwaldorf commented 7 years ago

Are you tabbing away from the field? The change event, unlike the input event is not fired every time you type, but rather when the element loses focus.

Here's an example: http://jsbin.com/tupumew/edit?html,console,output. If you tab (or click) away from each field, you'll see logs in the console.

Closing, as I can't repro this

GeoffAtHome commented 7 years ago

Thanks. I can see the example working. What I can't get working is doing this declarative. Attached is an example of this not working. My expectation is that it would work in a similar manner to how I have wrapped paper-input in the other attached example.

phone-picker.zip input-picker.zip