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.

[MikeMcC399]

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",