1191519 - Android Firefox Does Not Support Comma Decimals in `number` Fields (for Language/Regional support)

Status: RESOLVED WORKSFORME

(Firefox for Android Graveyard :: General, defect)

Description

[james.curd]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2472.0 Safari/537.36
Firefox for Android

Steps to reproduce:

A live example for testing and thorough details can be found here: http://codepen.io/aminimalanimal/pen/bdOzRG

French Canadians use different decimal and thousands separators than the US. Instead of expecting $1,000,000.57, they are accustomed to seeing $1 000 000,57.
Firefox for Android 

1. Set Android 5's OS language to French (Canada). If using older versions of Android, set Firefox's language preference to French (Canada).
2. Fill out a `number` field using commas as decimals.
3. Check the field's `val`.


Actual results:

The field's `val` becomes empty because Firefox on Android assumes that a comma within a `number` field is invalid.


Expected results:

Ideally, the field's value would be interpreted like it is on desktop Firefox, resulting in the decimal-comma being translated to a decimal-period in the `val` for consistent form submission and validation while the decimal-comma remains in the sighted field.

A less-ideal, but still-functional solution would just be to *not* automatically validate the field, and allow developers to scrub the inconsistency themselves. By clearing it out, developers are prevented from being able to allow commas in `number` fields at all.

As is, to support French Canadian users in Firefox on Android, we would either be forced to use `input[type="text"]` or not allow decimal entry, or implement an overly-complex masked-field hack.

Comment 1

[Gingerbread Man]

Seems to work in desktop Firefox. If I type in 1,2 the output says

The Number field's val is now:
1.2

Comment 2

[james.curd]

(In reply to Gingerbread Man from comment #1)
> Seems to work in desktop Firefox. If I type in 1,2 the output says
> 
> The Number field's val is now:
> 1.2

Indeed! I meant to mark this as an Android-Firefox issue only.

Comment 3

[Olivier Houdas]

Be careful to also take into account the pattern property.
For example, 
<input type='number' pattern='[0-9]+([\.,][0-9]+)?' step='any' lang='fr'>
should allow for the user to use both point and comma as separator.
However, this is not the case in FF 50 desktop ("invalid number" message from FF).
The only way to make FF 50 desktop accept both point and comma is to indicate
<input type='number' pattern='[0-9]+([\.,][0-9]+)?' step='any' lang='en-us'>

Comment 4

[Olivier Houdas]

(In reply to Olivier Houdas from comment #3)
> Be careful to also take into account the pattern property.
> For example, 
> <input type='number' pattern='[0-9]+([\.,][0-9]+)?' step='any' lang='fr'>
> should allow for the user to use both point and comma as separator.
> However, this is not the case in FF 50 desktop ("invalid number" message
> from FF).
> The only way to make FF 50 desktop accept both point and comma is to indicate
> <input type='number' pattern='[0-9]+([\.,][0-9]+)?' step='any' lang='en-us'>

Note: I entered #1322110 about this for the Desktop version of Firefox. This comment is only a reminder to take "pattern" into account when fixing this issue on the Android version.

Comment 5

[miralobontiu]

Hi,

I was not able to reproduce the issue.

Tested with:
Browser / Version: Firefox Mobile Nightly 63.0a1 (2018-08-12)
Operating System: LG G4 (Android 6.0)

Could you download the latest Nightly and retry?

Thank you!

Comment 6

[Kevin Brosnan [Ex-Mozilla]]

This was likely fixed with adding the ICU library to Firefox for Android which has shipped for quite some time (1 year+).