cypress-real-events icon indicating copy to clipboard operation
cypress-real-events copied to clipboard

Add support for mouse scroll

Open fernyb opened this issue 4 years ago • 7 comments

Add support for mouse scroll as I couldn't get the cy.trigger("wheel") to work.

fernyb avatar Oct 03 '21 04:10 fernyb

Thank you for this addition. Left a couple of comments

dmtrKovalenko avatar Oct 03 '21 05:10 dmtrKovalenko

I see the 1 failling test, any ideas what can be the reason?

dmtrKovalenko avatar Oct 04 '21 18:10 dmtrKovalenko

The build says the failure is in "realTouch".

https://app.circleci.com/pipelines/github/dmtrKovalenko/cypress-real-events/274/workflows/951c24fc-f0a9-4862-9b15-54129a931080/jobs/829/artifacts

touches using provided 0 for one of the axis https://829-315086372-gh.circle-artifacts.com/1/cypress/screenshots/touch.spec.ts/cy.realTouch%20--%20touches%20using%20provided%200%20for%20one%20of%20the%20axis%20%28failed%29.png

touches with a custom radius https://829-315086372-gh.circle-artifacts.com/1/cypress/screenshots/touch.spec.ts/cy.realTouch%20--%20touches%20with%20a%20custom%20radius%20%28failed%29.png

fernyb avatar Oct 04 '21 23:10 fernyb

This is what I found out. When test runs and scale is not 100% then test fails in certain cases. When the scale is 100% the all tests pass. So I've updated tests to set viewport small enough to get 100% scale.

fernyb avatar Oct 09 '21 04:10 fernyb

What do you mean by scale? When window is zoomed? We have a guard for that and correctly handling this in getCypressElementCoorsinate

dmtrKovalenko avatar Oct 09 '21 05:10 dmtrKovalenko

What do you mean by scale? When window is zoomed? We have a guard for that and correctly handling this in getCypressElementCoorsinate

image This one fails because the scale is not 100%. In the screenshot it says 86%.

This when it's 100% scale it passes. Strange.. image

fernyb avatar Oct 09 '21 05:10 fernyb

I feel like there is something wrong with the way "position" is calculated when scale is not "1". When I do a "cy.trigger" the correct box receives the wheel event. cy.get(".main").trigger("wheel", { x: ($main.width() - $smallbox.width()) - 2, y, deltaX: 14, deltaY: 14 });

But when I do the same position for realMouseWheel it fails when scale is less than 1. cy.get(".main").realMouseWheel({ position: { x: ($main.width() - $smallbox.width()) - 2, y }, deltaX: 11, deltaY: 11 });

I'm calling "getCypressElementCoordinates". const { x, y } = getCypressElementCoordinates(subject, options.position, options.scrollBehavior);

Do you think there is a way to do it the way cypress does for "trigger" ?

fernyb avatar Oct 10 '21 03:10 fernyb