1205133 - Ship inputmode attribute

Status: RESOLVED FIXED

(Core :: DOM: Core & HTML, enhancement, P3)

Description

[Jonathan Watt [:jwatt]]

+++ This bug was initially created as a clone of Bug #1164402 +++

On mobile devices and tablets it is common for content authors to want the numberic keyboard to be brought up for fields that are not really numbers such as fields for credit card numbers or zip codes. This is causing content authors to use <input type=number> inappropriately. (Inappropriately because these "numbers" are actually strings of digits, not numbers, and may require leading zeros. In the case of a 16 digit credit card numbers only 90% of them can accurately be represented by a double precision floating point number.)

We've had the 'inputmode' attribute implemented behind the pref dom.forms.inputmode for more than a couple of years now (see bug 857355). We should push to ship at least inputmode=numeric

Comment 1

[Jonathan Watt [:jwatt]]

It seems that the browser on iOS brings up the numeric keyboard for <input type=text pattern="[0-9]*">. That might be a simpler alternative to get shipped to address the credit card and zip code field issues.

Comment 2

[garri.hovhannisyan]

Yes, but for android I remember it doesn't show numeric key pad.

Comment 3

[Nikita E]

For now spec says, that inputmode should be lowercase https://html.spec.whatwg.org/#the-input-element
And it is implemented as lowercase, so i think the whole inputmode should be shipped (not only numeric)

Comment 4

[Julien Wajsberg [:julienw]]

Chrome reportedly will ship it soon: https://bugs.chromium.org/p/chromium/issues/detail?id=244688

Comment 5

[Julien Wajsberg [:julienw]]

I see we enable it on nightly already. (works well for me :) )

Comment 6

[Firefox Bug Husbandry Bot]

Migrating Webcompat whiteboard priorities to project flags. See bug 1547409.

Comment 7

[Firefox Bug Husbandry Bot]

See bug 1547409. Migrating whiteboard priority tags to program flags.

Comment 8

[Tom S [:evilpie]]

Seems like gov.uk just switched to inputmode=numeric.

Comment 9

[Tom S [:evilpie]]

Thanks m_kato for opening those bugs. I think inputmode is most important on Android, so could we ship it there first, in case Windows or GTK support is more work?

Comment 10

[Makoto Kato [:m_kato]]

(In reply to Tom Schuster [:evilpie] from comment #9)

Thanks m_kato for opening those bugs. I think inputmode is most important on Android, so could we ship it there first, in case Windows or GTK support is more work?

Windows and GTK fix are easy since we already have hint logic for <input type>. Since this feature already has the preference, if both isn't fixed, we can turn on this for Android only.

Comment 12

[Makoto Kato [:m_kato]]

smaug, Although I would like to ship this feature on Desktop, do you have any concerns to enable this? Actually inputmode has an spec issue such as https://github.com/whatwg/html/issues/4876, but Gecko's behavior is same as WebKit. Changing virtual keyboard layout dynamically causes setting/removing composition string unfortunately.

Comment 13

[Olli Pettay [:smaug][[e-mail]]]

Does composition string removal happen in other browsers too? Since if not, that might be a blocker I think.

Comment 14

[Makoto Kato [:m_kato]]

Does composition string removal happen in other browsers too? Since if not, that might be a blocker I think.

• Chrome/Windows is that composition string is committed when changing inputmode. No way to keep composition state.
• Chrome/Android depends on current software keyboard. GBoard with English type mode keeps composition string expected, but some IMEs (GBoard with Japanese input mode and PoBOX etc) removes composition string. Others such as GBboard with Korean commits composition string.
• Safari/iOS works with default OS keyboard. But 3rd party software keyboard cannot handle compositing string due to API limitation. So I cannot test on others.

I think that this is the limitation of OS API. If we can support dynamically updating for this attribute, these unexpected behaviors occur like Chrome.

Comment 15

[Makoto Kato [:m_kato]]

but Gecko's behavior is same as WebKit

That #12's comment was incorrect. comment #14 is the latest test result.

Comment 16

[Makoto Kato [:m_kato]]

OK, I will try dynamic change support to Gecko since other browsers support it.

Comment 17

[Makoto Kato [:m_kato]]

Attachment: Bug 1205133 - Ship inputmode attribute. r=smaug!

Since we have fixed all compatibility bugs and dependencies, so let's
ship this attribute since all browsers already support this.

Comment 18

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/6c759f88aed3
Ship inputmode attribute. r=smaug,preferences-reviewers

Comment 19

[Marian-Vasile Laza]

https://hg.mozilla.org/mozilla-central/rev/6c759f88aed3

Comment 20

[Hamish Willee]

FYI FF95 docs work for this can be tracked in https://github.com/mdn/content/issues/10144#issuecomment-962849650