vaadin / web-components

A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+
https://vaadin.com/docs/latest/components
467 stars 83 forks source link

[number-field] Consider detecting inputmode based on device (iPhone, Android) #3100

Open web-padawan opened 2 years ago

web-padawan commented 2 years ago

Motivation

Part of #3102

Originally implemented as part of #3071 but based on feedback by @sissbruecker, I decided to create a separate ticket.

Original comments: https://github.com/vaadin/web-components/pull/3071#pullrequestreview-813804740, https://github.com/vaadin/web-components/pull/3071#discussion_r755242736

I'm not very enthusiastic about the keyboard layout detection feature. It looks brittle, and neither of the linked tickets are about implementing such a feature.

I wonder if changing the keyboard layout based on whether negative values are allowed is really worth it. I can image these layouts changing at some point, or being different between:

  • mobile OS versions
  • browsers
  • custom keyboards that the user has installed

and this logic diverging between Vaadin versions. Looking at the code right now, I'm pretty sure that there are already cases that this doesn't cover. It might be better to keep this as dumb as possible, rather than implying that we have a solid keyboard layout detection feature here.

Same goes for decimal vs. numeric.

Also setting inputmode to text for iPhones seems questionable. That optimizes the whole thing for users who want to enter negative numbers, rather than those who want to enter positive numbers (I assume that a user can still switch the layout to get a minus character somehow).

In short, I would suggest to just use a single default keyboard layout, regardless whether negative or decimal numbers are allowed. Ideally developers can still override it if they want to attempt to implement some logic like the one that is suggested by this PR.

Proposed solution

  1. Test the current implementation using inputmode="numeric" on iPhone and Android devices,
  2. List findings as a separate comments in this issue and decide whether to implement or close it.
web-padawan commented 2 years ago

This was prototyped in #3071 and resulted in a bigger amount of work than planned. As an outcome from reviewing that PR and discussion, the issue was created: #3102