diff --git a/packages/lib/src/number-input/NumberInput.test.tsx b/packages/lib/src/number-input/NumberInput.test.tsx
index f0f3a37f7..d37498765 100644
--- a/packages/lib/src/number-input/NumberInput.test.tsx
+++ b/packages/lib/src/number-input/NumberInput.test.tsx
@@ -586,4 +586,15 @@ describe("Number input component tests", () => {
}
expect(handlerOnSubmit).toHaveBeenCalled();
});
+ test("Number input keeps type number while typing so typed digits keep their order", async () => {
+ const user = userEvent.setup();
+ const { getByLabelText } = render();
+ const number = getByLabelText("Number label") as HTMLInputElement;
+ await user.click(number);
+ await user.keyboard("1");
+ expect(number.getAttribute("type")).toBe("number");
+ await user.keyboard("5");
+ expect(number.getAttribute("type")).toBe("number");
+ expect(number.value).toBe("15");
+ });
});
diff --git a/packages/lib/src/text-input/TextInput.tsx b/packages/lib/src/text-input/TextInput.tsx
index 34d3a6c9f..5c76f3cc7 100644
--- a/packages/lib/src/text-input/TextInput.tsx
+++ b/packages/lib/src/text-input/TextInput.tsx
@@ -477,7 +477,6 @@ const DxcTextInput = ({
}
if (numberInputContext != null) {
setNumberProps(
- numberInputContext.typeNumber,
numberInputContext.minNumber,
numberInputContext.maxNumber,
numberInputContext.stepNumber,
@@ -548,7 +547,7 @@ const DxcTextInput = ({
maxLength={maxLength}
minLength={minLength}
tabIndex={tabIndex}
- type="text"
+ type={numberInputContext?.typeNumber ?? "text"}
value={value ?? innerValue}
/>
diff --git a/packages/lib/src/text-input/utils.ts b/packages/lib/src/text-input/utils.ts
index 0d6faffe5..587ad1795 100644
--- a/packages/lib/src/text-input/utils.ts
+++ b/packages/lib/src/text-input/utils.ts
@@ -151,9 +151,8 @@ export const incrementNumber = (
}
};
-export const setNumberProps = (type?: string, min?: number, max?: number, step?: number, ref?: HTMLInputElement) => {
+export const setNumberProps = (min?: number, max?: number, step?: number, ref?: HTMLInputElement) => {
if (min != null) ref?.setAttribute("min", min.toString());
if (max != null) ref?.setAttribute("max", max.toString());
if (step != null) ref?.setAttribute("step", step.toString());
- if (type != null) ref?.setAttribute("type", type);
};