From 1cef96f9fa3be39fa616976cbc18aa824dd403f0 Mon Sep 17 00:00:00 2001 From: Nicholas Boll Date: Mon, 3 Feb 2020 16:26:38 -0700 Subject: [PATCH 1/2] docs: Update Cypress Testing Library scoping example Recently https://github.com/testing-library/cypress-testing-library/pull/108 added a way to take the previous subject of a previous command to scope the query. Also `find*` queries handle `.should('not.exist')` and should be preferred over `query*` which require additional logic for eventual non-existence queries. --- docs/cypress-testing-library/intro.md | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/docs/cypress-testing-library/intro.md b/docs/cypress-testing-library/intro.md index abbc9a4e6..e2a893fe5 100644 --- a/docs/cypress-testing-library/intro.md +++ b/docs/cypress-testing-library/intro.md @@ -27,9 +27,8 @@ and `queryAllBy` commands off the global `cy` object. [See the `DOM Testing Library` docs for reference](https://testing-library.com/docs/dom-testing-library/api-queries). > Note: the `get*` queries are not supported because for reasonable Cypress tests you -> need retryability and `find*` queries already support that. The reason the `query*` -> variants are supported is to allow you to assert that elements do _not_ appear on -> the screen. +> need retryability and `find*` queries already support that. `query*` queries are not +> necessary, but supported. ## With TypeScript @@ -53,9 +52,12 @@ To show some simple examples (from ```javascript cy.findAllByText('Jackie Chan').click() -cy.queryByText('Button Text').should('exist') -cy.queryByText('Non-existing Button Text').should('not.exist') -cy.queryByLabelText('Label text', {timeout: 7000}).should('exist') +cy.findByText('Button Text').should('exist') +cy.findByText('Non-existing Button Text').should('not.exist') +cy.findByLabelText('Label text', {timeout: 7000}).should('exist') + +// findAllByText _inside_ a form element +cy.get('form').findByText('Button Text').should('exist') cy.get('form').within(() => { cy.findByText('Button Text').should('exist') }) From f69a8d53effa58709d066c93e70517029869ad6d Mon Sep 17 00:00:00 2001 From: Nicholas Boll Date: Wed, 5 Feb 2020 17:00:58 -0700 Subject: [PATCH 2/2] docs: update note about other query types --- docs/cypress-testing-library/intro.md | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/docs/cypress-testing-library/intro.md b/docs/cypress-testing-library/intro.md index e2a893fe5..2bc1d1228 100644 --- a/docs/cypress-testing-library/intro.md +++ b/docs/cypress-testing-library/intro.md @@ -27,8 +27,9 @@ and `queryAllBy` commands off the global `cy` object. [See the `DOM Testing Library` docs for reference](https://testing-library.com/docs/dom-testing-library/api-queries). > Note: the `get*` queries are not supported because for reasonable Cypress tests you -> need retryability and `find*` queries already support that. `query*` queries are not -> necessary, but supported. +> need retryability and `find*` queries already support that. `query*` queries are no longer +> necessary since v5 and will be removed in v6. `find*` fully support built-in Cypress +> assertions (removes the only use-case for `query*`). ## With TypeScript @@ -58,9 +59,6 @@ cy.findByLabelText('Label text', {timeout: 7000}).should('exist') // findAllByText _inside_ a form element cy.get('form').findByText('Button Text').should('exist') -cy.get('form').within(() => { - cy.findByText('Button Text').should('exist') -}) cy.get('form').then(subject => { cy.findByText('Button Text', {container: subject}).should('exist') })