testcafe icon indicating copy to clipboard operation
testcafe copied to clipboard

Not possible to type text in PrimeReact number input

Open wombatka opened this issue 1 year ago • 2 comments

What is your Scenario?

I cannot type text into number input

What is the Current behavior?

Nothing is typed when use t.typeText

What is the Expected behavior?

Text should be typed

What is the public URL of the test page? (attach your complete example)

import {Selector, t} from "testcafe"; fixture example

test("not possible to type in number field", async t => { await t.navigateTo("https://primereact.org/inputnumber/"); const input = Selector("#integeronly"); await t.typeText(input, "1234", {replace: true}); await t.expect(input.value).eql("1234") })

What is your TestCafe test code?

import {Selector, t} from "testcafe"; fixture example

test("not possible to type in number field", async t => { await t.navigateTo("https://primereact.org/inputnumber/"); const input = Selector("#integeronly"); await t.typeText(input, "1234", {replace: true}); await t.expect(input.value).eql("1234") })

Your complete configuration file

package.json: { "name": "testcafeexamples", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "npm test" }, "author": "", "license": "ISC", "dependencies": { "testcafe": "^3.6.0" } }

Your complete test report

  • Chrome 124.0.0.0 / Ubuntu 22.04

example ✖ not possible to type in number field

  1. AssertionError: expected '42,723' to deeply equal '1234'

    • expected - actual

    -42,723 +1234

    Browser: Chrome 124.0.0.0 / Ubuntu 22.04

    3 | 4 |test("not possible to type in number field", async t => { 5 | await t.navigateTo("https://primereact.org/inputnumber/"); 6 | const input = Selector("#integeronly"); 7 | await t.typeText(input, "1234", {replace: true});

    8 | await t.expect(input.value).eql("1234") 9 |})

    at (/home/asia/testcafeExamples/index.js:8:33) at asyncGeneratorStep (/home/asia/testcafeExamples/index.js:1:38) at _next (/home/asia/testcafeExamples/index.js:1:38)

1/1 failed (8s)

Process finished with exit code 1

AssertionError: expected '42,723' to deeply equal '1234'

  • expected - actual

-42,723 +1234

Screenshots

No response

Steps to Reproduce

  1. run the above test
  2. Not ok text is not typed

TestCafe version

3.6.0

Node.js version

21.7.1

Command-line arguments

npm test

Browser name(s) and version(s)

Chrome 124

Platform(s) and version(s)

Ubuntu 22.04.2 LTS

Other

No response

wombatka avatar May 20 '24 12:05 wombatka

We appreciate you taking the time to share information about this issue. We reproduced the bug and added this ticket to our internal task queue. We'll update this thread once we have news.

github-actions[bot] avatar May 23 '24 07:05 github-actions[bot]

I would appreciate if someone could come up with some workaround. I tried different approaches and could not come up with any working solution,

wombatka avatar May 23 '24 08:05 wombatka

I would appreciate if someone could come up with some workaround. I tried different approaches and could not come up with any working solution,

the only workaround I was able to come up with is

await t.dispatchEvent(numberInput, 'keydown', { key: '1', code: 'Digit1' })
await t.dispatchEvent(numberInput, 'keyup', { key: '1', code: 'Digit1' })
await t.dispatchEvent(numberInput, 'keydown', { key: '2', code: 'Digit2' })
await t.dispatchEvent(numberInput, 'keyup', { key: '2', code: 'Digit2' })
await t.dispatchEvent(numberInput, 'keydown', { key: '3', code: 'Digit3' })
await t.dispatchEvent(numberInput, 'keyup', { key: '3', code: 'Digit3' })

because t.typeText(numberInput, "123", {paste: true}) doesn't trigger any input/change event in this particular use case, so it just changes the view but doesn't update the state

idzmag avatar May 24 '24 09:05 idzmag

@idzmag thank's for the workaround! I used it in example and works

test("not possible to type in number field", async t => { await t.navigateTo("https://primereact.org/inputnumber/"); const input = Selector("#integeronly"); await t.selectText(input).pressKey("delete"); for(const letter of '1,234') { await t.dispatchEvent(input, 'keydown', { key: letter, code: Digit${letter} }); } await t.expect(input.value).eql("1,234") })

wombatka avatar May 24 '24 09:05 wombatka

I'm having a similar issue with typeText I logged here https://stackoverflow.com/questions/78545921/testcafe-3-throws-uncaught-object-was-thrown-throw-error-instead-using-t

anthonyferroHU avatar May 30 '24 13:05 anthonyferroHU

Hello @anthonyferroHU, it seems you encountered a different issue. Please create a separate ticket using this template and also share a Minimal Working Example in that ticket so that the TestCafe team can research the issue and help you. We do not ask you to share your source code but a reproducible minimal example that we can run on our end.

Bayheck avatar May 31 '24 08:05 Bayheck

This issue is a rare case scenario that has a workaround. A potential fix is quite complex and thus has a low priority at present. This means that we don’t have immediate plans to work on this task, and I will close it for a while.

Bayheck avatar May 31 '24 08:05 Bayheck