Show number keyboard on mobile onscreen keyboards

[AnmAtAnm]

Problem statement

FieldNumber editors should provide the correct <input> attributes to help touch/mobile device onscreen keyboards.

Expected Behavior

Number fields editors should use <input id="number" type="number" ...>.

Need to verify the change does not have unexpected impact on non-touch platforms.

Actual Behavior

field_number currently use the following for editor:

<input class="blocklyHtmlInput" spellcheck="true" value="0" style="font-size: 11pt;">

[alschmiedt]

Tried fixing this in #2607 by setting the htmlInput_.type to number. However, on mobile it shows a prompt editor so the htmlInput_ is undefined and breaks. More information on this issue can be found here: #2659.

[maribethb]

There is no good way to do this, unfortunately. The current behavior is that you should be able to enter any value that JavaScript can convert to a number with Number(value) (after we do our transformations). This includes Infinity and hexadecimal numbers.

The default mobile experience is to use modal inputs instead of the text input anyway. It's only pretty recently that we supported disabling these inputs in core and even more recently that that experience worked well enough on all mobile browsers for anyone to turn it on. So largely this doesn't even matter, because if you're using modal inputs, which use window.prompt there is no way to control the kind of keyboard shown.

But if you are disabling the modal inputs then:

• type="number" doesn't work because the browser is too strict about what a number is. It doesn't let you enter any non-digit text so you cannot enter Infinity or hexadecimal numbers, for example.
• inputMode="numeric" is the preferred approach, and it works well on desktop and iOS. The browser will still let you enter any text. On iOS it will show the number keypad by default but it will still let you switch to the alpha keyboard so you can still enter Infinity. However, on Android, it will show the number keyboard but not let you switch to alpha.
• None of the input modes supported by android let you show the number keyboard and switch to alpha.

Thus, on Android, there would not be any way to both show the number keyboard and allow users to enter values like Infinity.

Instead, we could solve this by providing a specific mobile-friendly number input as a plugin, maybe with a popout numpad widget, and a separate Infinity math block. Developers who come across this issue and want this feature and don't care about Infinity or hexadecimal should feel free to subclass the number field and add inputMode="numeric" to the HTML.