Почему Chrome насильно изменяет точку на запятую в input number И как это исправить?

Question

[bpGusar]

Проблема, в моем случае, относится только к React, ибо когда делаешь такой инпут

<input
  type='number'
  defaultValue="0.5"
/>

при загрузке страницы в инпуте будет запятая, а нужна точка.

Можно ли как то победить такое поведение инпута, которое проявляется только в хроме?

Comments

[ProjectSoft]

Запятая берётся из настроек языка системы.
Измените для системы разделитель с запятой на точку и перезагрузите праузер. Теперь у вас точка вместо запятой.
Предложить можно только костыль на input[type="text"] - написать плагин.

Answer 1

[Dmitrij Shovery]

Хром использует для отображения настройки локали пользователя. В странах СНГ используется запятая. Для вывода точки нужно использовать паттерн для тега input

<input type="text" pattern="[0-9]+([\.][0-9]{1,2})?" name="amount">

Почему следует использовать именно type="text"? Для типа number без использования JS нельзя задать паттерн, насколько мне известно.

Answer 2

[Alex Step]

Единственное 100% рабочее решение которое удалось найти для input type=number - использование своего шрифта, только с цифрами и запятой которая выглядит как точка