testcafe icon indicating copy to clipboard operation
testcafe copied to clipboard

.click() fails to scroll checkboxes into view for a long form (scrolls to top instead) (Chrome)

Open henrik-jmh opened this issue 3 months ago • 10 comments

What is your Scenario?

We have a long form. We want to check checkboxes on the form. The form is in an iframe. It fails in Chrome (123) but works in Firefox (123).

What is the Current behavior?

When the test tries to click on a checkbox, it scrolls the page to the top of the form, and then fails to check the checkbox.

What is the Expected behavior?

t.click() should select a checkbox even if it is at first out of scroll view.

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

https://www.johnmuirhealth.com/secure/community-support-request.html You can view the form, but please don't submit.

What is your TestCafe test code?

await t.navigateTo('https://www.johnmuirhealth.com/secure/community-support-request.html');
await t.switchToIframe('#aemFormFrame');
await t.click('input[aria-label="None of the above"]');
await t.debug();

Your complete configuration file

{ "screenshotPath": "./screenshots", "takeScreenshotsOnFails": true, "screenshotPathPattern": "${DATE}_${TIME}/${FIXTURE}.png", "hostnameWeb": "www.johnmuirhealth.com", "selectorTimeout": 50000 }

Your complete test report

$ npx testcafe chrome ./tests/jmhForms.test.js --test test1 -e Running tests in:

  • Chrome 123.0.0.0 / Windows 11

JMH Forms Tests Stopping TestCafe...

Screenshots

No response

Steps to Reproduce

  1. Run the code in this report against the URL specified in this report.
  2. Note that the checkboxes that are outside of view don't get checked.

TestCafe version

3.5.0

Node.js version

v16.19.1

Command-line arguments

npx testcafe chrome test.js --test test1 -e

Browser name(s) and version(s)

Chrome 123

Platform(s) and version(s)

Windows 11, Windows 10

Other

Note that if you quickly zoom out (e.g., using ctrl+scrollwheel), it works because then there is no need to scroll. So it seems to us, click() and hover() has an issue with checkboxes in an iframe in a long form in Chrome.

henrik-jmh avatar Mar 29 '24 23:03 henrik-jmh

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 Apr 01 '24 13:04 github-actions[bot]

Hello, I managed to reproduce the issue.

As a workaround, try using t.dispatchEvent(target, 'click') and let us know if it worked for you.

https://testcafe.io/documentation/403091/reference/test-api/testcontroller/dispatchevent

Bayheck avatar Apr 15 '24 08:04 Bayheck

Yes, the workaround does work. Thanks!

henrik-jmh avatar Apr 15 '24 22:04 henrik-jmh

@Aleksey28 do you plan to implement the fix in the library? I see the workaround but would be great if it works OOTB when t.click is used.

It used to be working without native automation, as described in https://github.com/DevExpress/testcafe/issues/8166.

darkowic avatar Apr 16 '24 19:04 darkowic

Hi @darkowic,

Due to the workaround that exists, the priority of this issue is relatively low. That means that we don’t have immediate plans to work on this task, and I closed it for a while.

Aleksey28 avatar Apr 22 '24 11:04 Aleksey28

It's breaking user experience as it requires additional knowledge and usage of not "standard" API. Obviously, the workaround should be documented on the page but I don't see this will happen. Also, as I mentioned above, it use to be working before v3.

At least keep the issue open to not forget about this... Closed issue will be forgotten forever.

darkowic avatar Apr 22 '24 23:04 darkowic

Hello, we are working on this issue. I will reopen it.

Bayheck avatar Apr 25 '24 12:04 Bayheck

Hello, we researched the issue further and found that the root cause is quite complex to fix at the moment.

We will get back to this issue if we give it a higher priority in the future.

For now, the solution is to use the workaround.

Bayheck avatar Apr 29 '24 17:04 Bayheck