Negative sign with decimal question on Samsung mobil

[jdugh]

Describe the bug On Samsung mobile phone, I don't have the minus sign on the decimal question.

To Reproduce

1. Create form with a decimal question
2. Open form on a Samsung mobile
3. Select the question and try to enter a negatif value

Screenshots

Browser and OS (please complete the following information):

• OS: Samsung
• Chrome

Additional context it seems that this problem is known and is not directly related to Enketo. I found a solution, but can produce some side effect :

• Change input balise type="number" by type="text"
• Add balise inputmode="numeric" Now, we have the minus sign. But, the style is broken (get the text style), and we can insert many minus or comma. So, this proposal need a style fix, and JS fix, and maybe other fix ...

The other solution I found is to install the google board.

Do you have the same issue and any other solution ? Thank's

[jdugh]

I have a proposal : Here : https://github.com/enketo/enketo-transformer/blob/c6dbb4502f453966e07b19a02997e1d44417ebe0/src/xsl/openrosa2html5form.xsl#L1794-L1796 Change number html type value by text

Here : https://github.com/enketo/enketo-transformer/blob/c6dbb4502f453966e07b19a02997e1d44417ebe0/src/xsl/openrosa2html5form.xsl#L1156-L1158 After this binding-attributes, add two other binding-attributes :

<xsl:if test="$xml-type = 'decimal'">
    <xsl:attribute name="inputmode">numeric</xsl:attribute>
</xsl:if>
<xsl:if test="$xml-type = 'int'">
    <xsl:attribute name="inputmode">numeric</xsl:attribute>
</xsl:if>

At this point, Samsung Keyboard has the minus sign, but you can insert an incorrect number (like 5.5.5 or 5.-5-5.8-) So, adapt this function : https://github.com/enketo/enketo-core/blob/827c1f30a62d7e8a9093f7c9b1dac7b2b54151b4/src/js/mask.js#L33

Change this part : https://github.com/enketo/enketo-core/blob/827c1f30a62d7e8a9093f7c9b1dac7b2b54151b4/src/js/mask.js#L37-L46 By :

if (event.target.matches(selector)) {
    const position = event.target.selectionStart; // The position of the new keyDown
    const currentValue = `${event.target.value.substring(0, position)}${event.key}${event.target.value.substring(position)}`; // The final value desired by the user
    const respectRegex = ( currentValue.trim() == '-' || validRegex.test( currentValue.trim() ) ); // Is the value is a minus or a validRegex, allow it.
     // The "key" property is the correct standards-compliant property to use 
     // but needs some corrections for non-standard-compliant IE behavior. 
    if (
        this._isNotPrintableKey(event) ||
        this._isKeyboardCutPaste(event) ||
        ( allowedChars.indexOf(event.key) !== -1 && respectRegex  )
    ) {
        return true;
    }
}

What do you think about this solution ? Thank

[lognaturel]

@eyelidlessness this feels thematically related to #792, https://github.com/enketo/enketo-core/issues/484, #696 in that it's again about numeric inputs.

but you can insert an incorrect number (like 5.5.5 or 5.-5-5.8-)

That's #792