Unable to enter decimal values into certain properties, including `Umb.PropertyEditorUi.Decimal`.

[markadrake]

Which Umbraco version are you using? (Please write the exact version, example: 10.1.0)

15.1.2

Bug summary

1. Typing decimal values into the Umb.PropertyEditorUi.Decimal property editor is challenging.

2. It also results in a quasi-error state.

Configuration and result below:

Specifics

• I have configured a content type, with a property of type Umb.PropertyEditorUi.Decimal.
• The default value is 0, and this value fills the box on first load.

• If I try to type .123 to create the value 0.123, the text box does not accept the . character and creates 1230 instead.

• If I highlight everything, backspace (and then backspace again because a 0 is inserted) I can now type the decimal portion of my number .123.

I can save and publish this now. The field will be highlighted in red, indicating a validation error, but the value is saved to the database and retained after a reload.

Steps to reproduce

The steps to reproduce this issue have already been included in the summary and specifics section.

Expected result / actual result

1. Fighting with the JS component that auto-fills the value to 0 is frustrating, even when backspacing. I question why we chose to do anything on the "input" event. Should we apply a validation pattern instead?
2. Allow the decimal character to be typed into the box at most once. Today, the input field does not accept this character unless it is the only character in the box (the value must be cleared twice to get to an empty state). Related to the "input" event again.
3. Handle the internationalization of the decimal indicator. Is this working as expected between cultures on the document?
4. Oddly enough, "e" is an acceptable character. Or are we allowing scientific notation? This relates to the #parseInt method, which is inappropriately named as it only verifies that the content is a number.
5. The quasi-error state I describe above occurs once you enter three or more digits to the right of the decimal.

[github-actions]

Hi there @markadrake!

Firstly, a big thank you for raising this issue. Every piece of feedback we receive helps us to make Umbraco better.

We really appreciate your patience while we wait for our team to have a look at this but we wanted to let you know that we see this and share with you the plan for what comes next.

• We'll assess whether this issue relates to something that has already been fixed in a later version of the release that it has been raised for.
• If it's a bug, is it related to a release that we are actively supporting or is it related to a release that's in the end-of-life or security-only phase?
• We'll replicate the issue to ensure that the problem is as described.
• We'll decide whether the behavior is an issue or if the behavior is intended.

We wish we could work with everyone directly and assess your issue immediately but we're in the fortunate position of having lots of contributions to work with and only a few humans who are able to do it. We are making progress though and in the meantime, we will keep you in the loop and let you know when we have any questions.

Thanks, from your friendly Umbraco GitHub bot 🤖 🙂

[markadrake]

Note that the issue seems to be with this component: umb-property-editor-ui-number.

[leekelleher]

@markadrake Thank you for reporting this, I appreciate the frustration it can cause. There are a few issues to resolve with this, some are in the CMS, others are in the UUI component library.

There is a couple of things in the property-editor itself: changing from the @input event to the @change event; relax auto-setting the empty value to 0. I'll look to resolve those in the CMS.

The bug about the decimal indicator, I've identified the cause in the <uui-input> component and raised an issue on the UUI repository: umbraco/Umbraco.UI#1004

[leekelleher]

Hi @markadrake, can you confirm what the Step size value is on the data-type configuration for the Decimal editor?

If it's 0.01, try increasing the decimal place size to 0.001.

From reading up about how the <input type=number> works, it will internally validate between integer and decimal based on the step attribute value. re: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number#allowing_decimal_values

[AndyButland]

Fixed with umbraco/Umbraco.UI#1004 and due in 15.3 (though with the proviso that one further issue exists in the underlying UI library, which is raised as umbraco/Umbraco.UI#1004).