With an input with a type of "number", there's a problem.
To replicate create an input like so:
<field.Input @type="number" step="0.01" />
When you try and type in 2.01 after typing the 0 the value will be reset to 2 with no decimal point. You can copy-paste the value in just fine.
What's happening is in handleInput(e: Event | InputEvent): void the input is getting transformed with parseFloat(e.target.value). That's the right thing (basically) because otherwise number fields would return string values.
However JS doesn't have the concept of "2.0" so it is parsed into "2" and set, wiping out the decimal point.
In short, it's impossible to type in decimal values that contain 0.
With an input with a type of "number", there's a problem.
To replicate create an input like so:
When you try and type in
2.01after typing the0the value will be reset to2with no decimal point. You can copy-paste the value in just fine.What's happening is in
handleInput(e: Event | InputEvent): voidthe input is getting transformed withparseFloat(e.target.value). That's the right thing (basically) because otherwise number fields would return string values.However JS doesn't have the concept of "2.0" so it is parsed into "2" and set, wiping out the decimal point.
In short, it's impossible to type in decimal values that contain 0.
I've added a test replicating the issue here: https://github.com/stackdevelopment/ember-headless-form-number-issue/tree/number-input-issue
I'd be happy to fix it if you point me in the direction for how you'd like to approach it.