element selector: ":last" vs ":last-child"

[xmquan]

cypress-example-kitchensink/cypress/e2e/2-advanced-examples/assertions.cy.js

Line 12 in 277e055

.find('tbody tr:last')

should be changed to .find('tbody tr:last-child') to get the last element. The :last-child is accepted in CSS while not :last .

[MikeMcC399]

@zeromquan

Interesting find! The one line of code is not the only place where :last is used.

Documentation

The reason that :last works is as follows:

The Cypress find command documentation says:

The querying behavior of this command matches exactly how
.find() works in jQuery.

jQuery > Category: Selectors includes the :last Selector.

HOWEVER, this positional selector is deprecated!

Deprecation

The jQuery > :last Selector was deprecated in jQuery 3.4.0 released on April 10, 2019. See section "Deprecating positional selectors and the sunset of Sizzle", where it says:

jQuery 3.4.0 is deprecating :first, :last, :eq, :even, :odd, :lt, :gt, and :nth.

Suggestion

Review and revise all use of the deprecated jQuery positional selectors such as :first and :last, both in this repository and in the Cypress documentation repository.

[xmquan]

for the positional selector, .first() .last() are more Cypressic way.

[alexsch01]

Cypress seems to be using jquery 3.1.1 currently, which was released on Sep 23, 2016

https://github.com/cypress-io/cypress/blob/f741635b91d8e1e9d9a0ec7ac3680d05b0bc01fd/package.json#L270

    "**/jquery": "3.1.1",

Now Cypress is using jquery 3.4.1 https://docs.cypress.io/app/references/changelog#13-15-2:~:text=Updated%20jquery%20from%203.1.1%20to%203.4.1

[MikeMcC399]

@alexsch01

Thanks for spotting that Cypress >= 13.13.1 is using jquery@3.4.1! I have hidden my post, which you quoted, as outdated.

The suggestion in #753 (comment) to update the usage is still valid and the tests continue to work with the current Cypress 13.15.2 despite the deprecation.