Add a possible solution

dnbexperience · Jan 9, 2024 · 95c276f · 95c276f
1 parent ea2cf1e
commit 95c276f
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 11 deletions.
diff --git a/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js b/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
@@ -417,7 +417,10 @@ const useCallEvent = ({ setLocalValue }) => {
     const cleanedValue =
       numberValue === 0 && String(num).charAt(0) !== '0' ? '' : num
 
-    if (name === 'on_change' && numberValue === 0) {
+    if (
+      name === 'on_key_down' ||
+      (name === 'on_change' && numberValue === 0)
+    ) {
       correctCaretPosition(event.target, maskParams, props)
     }
 

diff --git a/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx b/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx
@@ -1702,25 +1702,21 @@ describe('InputMasked with custom mask', () => {
   })
 
   it('should set correct cursor position when navigating using keyboard', async () => {
-    render(
-      <InputMasked
-        value='1'
-        mask={[/\d/, ' ', /\d/]}
-      />
-    )
+    render(<InputMasked value="1" mask={[/\d/, ' ', /\d/]} />)
 
     const input = document.querySelector('input')
 
     {
       expect(document.body).toHaveFocus()
 
       await userEvent.tab()
+
       expect(input).toHaveFocus()
-      expect(input).toHaveValue(`1 `)
+      expect(input).toHaveValue('1 ')
+
+      await userEvent.keyboard('{ArrowRight}2') // Remove selection
 
-      await userEvent.keyboard('{arrowright}') // removes selection
-      await userEvent.keyboard('2')
-      expect(input).toHaveValue(`1 2`)
+      expect(input).toHaveValue('1 2')
     }
   })