dependency: Update jquery to 3.4.1 #29837
Conversation
jennifer-shehane
changed the title
8 flaky tests on run #56120 ↗︎
Details:
|
|||||||||||||||||||||||||||||||||||||||||||||
| Test | Artifacts | |
|---|---|---|
| App/Cloud Integration - Latest runs and Average duration > when not using a branch > shows placeholders for all visible specs |
Test Replay
Screenshots
|
|
e2e/origin/commands/waiting.cy.ts • 1 flaky test • 5x-driver-electron
| Test | Artifacts | |
|---|---|---|
| ... > throws when foo cannot resolve |
Test Replay
|
|
cypress/proxy-logging.cy.ts • 1 flaky test • 5x-driver-electron
| Test | Artifacts | |
|---|---|---|
| Proxy Logging > request logging > fetch log shows resource type, url, method, and status code and has expected snapshots and consoleProps |
Test Replay
|
|
commands/waiting.cy.js • 1 flaky test • 5x-driver-chrome
| Test | Artifacts | |
|---|---|---|
| ... > errors > throws when waiting for 2nd response to route |
Test Replay
|
|
e2e/origin/commands/waiting.cy.ts • 1 flaky test • 5x-driver-chrome
| Test | Artifacts | |
|---|---|---|
| ... > throws when foo cannot resolve |
Test Replay
|
|
The first 5 flaky specs are shown, see all 6 specs in Cypress Cloud.
Review all test suite changes for PR #29837 ↗︎
| layerX: 492, | ||
| layerY: 215, |
There was a problem hiding this comment.
layerX and layerY properties are non-standard. We already had these mouse props commented out for Firefox because it was returning odd results. I'm removing the tests for these non-standard properties on all browsers. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/layerX
Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
|
|
||
| // width/height of scrollable container - width of parent viewport (minux scrollbars) / 2 to get the center | ||
| // browsers round up the pixel value so we need to round it | ||
| this.halfScrollPixels = Math.round((500 - 100) / 2) |
There was a problem hiding this comment.
just moving this calc to one place with some explanation because it took me a while to figure out these values from thin air.
| // pageY is 220.5 in headless Electron | ||
| // since updating to jquery 3.2+....why... | ||
| // pageY: 215, |
There was a problem hiding this comment.
This pageY value returns 220.5 in headless Electron. It is 215 in headed, it is 215 in Chrome, it is 215 in the version of Chromium 118 that I could find. I commented this out. I have no earthly idea why a change in jQuery would result in this pageY value being slightly different when clicking from 1 div to another div in Electron headless. I'm not sure that this quirk is worth further investigation, but open for debate.
|
@cacieprins Opened a followup issue here: #29846 |
Additional details
This bumps our jQuery version and the version included on
Cypress.$to 3.4.1.In jQuery 3.2.0 a change was introduced and further iterated on with the calculation of
.width()and.height(). Previously.width()and.height()would return the width and height of elements including scrollbars. In jQuery 3.2.0, they updated these methods to more closely match the CSS box model by returning the width and height excluding the scrollbars.This would introduce a breaking change to users using the
Cypress.$API.Additionally this change in width/height calculation changes our 'scrollTo' behavior since that relies on the width/height calculated by jQuery.
While technically the height/width calculations and scrollTo behavior are more correct, we don't want to introduce breaking changes in a non-breaking change release. Consequently, I have patched jQuery 3.4.1 to overwrite the height/width getters to use the old calculations. This could result in some confusion with jQuery.height and jQuery.width returning different results than Cypress, but I guess that's already the case today and no one has raised that.
jQuery 3.5.0 introduces some changes that broke more driver tests, so that would need further investigation.
Commits between jQuery 3.3.1 and 3.4.1
Features:
Deprecations:
Bugfixes:
Steps to test
All of the previous tests should pass.
How has the user experience changed?
Users should see more correct behavior from jQuery fixes and have access to new jQuery features like .css()
PR Tasks
cypress-documentation?type definitions?