diff --git a/docs/rules/assertion-before-screenshot.md b/docs/rules/assertion-before-screenshot.md index 4c127015..0e22f660 100644 --- a/docs/rules/assertion-before-screenshot.md +++ b/docs/rules/assertion-before-screenshot.md @@ -1,19 +1,22 @@ -## Assertion Before Screenshot +# Require screenshots to be preceded by an assertion (`cypress/assertion-before-screenshot`) + If you take screenshots without assertions then you may get different screenshots depending on timing. For example, if clicking a button makes some network calls and upon success, renders something, then the screenshot may sometimes have the new render and sometimes not. +## Rule Details + This rule checks there is an assertion making sure your application state is correct before doing a screenshot. This makes sure the result of the screenshot will be consistent. -Invalid: +Examples of **incorrect** code for this rule: ```js cy.visit('myUrl'); cy.screenshot(); ``` -Valid: +Examples of **correct** code for this rule: ```js cy.visit('myUrl'); diff --git a/docs/rules/no-assigning-return-values.md b/docs/rules/no-assigning-return-values.md index ef228d1d..2c3cf7da 100644 --- a/docs/rules/no-assigning-return-values.md +++ b/docs/rules/no-assigning-return-values.md @@ -1,3 +1,8 @@ -## No Assigning Return Values +# Disallow assigning return values of `cy` calls (`cypress/no-assigning-return-values`) + +💼 This rule is enabled in the ✅ `recommended` config. + + +## Further Reading See [the Cypress Best Practices guide](https://on.cypress.io/best-practices#Assigning-Return-Values). diff --git a/docs/rules/no-async-before.md b/docs/rules/no-async-before.md index bd01e535..b69a1b47 100644 --- a/docs/rules/no-async-before.md +++ b/docs/rules/no-async-before.md @@ -1,6 +1,7 @@ -# Prevent using async/await in Cypress test cases (no-async-tests) +# Disallow using `async`/`await` in Cypress `before` methods (`cypress/no-async-before`) -Cypress commands that return a promise may cause side effects in before/beforeEach hooks, possibly causing unexpected behavior. + +Cypress commands that return a promise may cause side effects in `before`/`beforeEach` hooks, possibly causing unexpected behavior. ## Rule Details @@ -38,12 +39,11 @@ describe('my feature', () => { // other operations }) }) - ``` ## When Not To Use It -If there are genuine use-cases for using `async/await` in your before then you may not want to include this rule (or at least demote it to a warning). +If there are genuine use-cases for using `async/await` in your `before` hooks then you may not want to include this rule (or at least demote it to a warning). ## Further Reading diff --git a/docs/rules/no-async-tests.md b/docs/rules/no-async-tests.md index efe62642..0d99b82a 100644 --- a/docs/rules/no-async-tests.md +++ b/docs/rules/no-async-tests.md @@ -1,6 +1,10 @@ -# Prevent using async/await in Cypress test cases (no-async-tests) +# Disallow using `async`/`await` in Cypress test cases (`cypress/no-async-tests`) -Cypress tests [that return a promise will error](https://docs.cypress.io/guides/references/error-messages.html#Cypress-detected-that-you-returned-a-promise-from-a-command-while-also-invoking-one-or-more-cy-commands-in-that-promise) and cannot run successfully. An `async` function returns a promise under the hood, so a test using an `async` function will also error. +💼 This rule is enabled in the ✅ `recommended` config. + + +Cypress tests [that return a promise will error](https://docs.cypress.io/guides/references/error-messages.html#Cypress-detected-that-you-returned-a-promise-from-a-command-while-also-invoking-one-or-more-cy-commands-in-that-promise) and cannot run successfully. +An `async` function returns a promise under the hood, so a test using an `async` function will also error. ## Rule Details @@ -38,7 +42,6 @@ describe('my feature', () => { // other operations }) }) - ``` ## When Not To Use It diff --git a/docs/rules/no-force.md b/docs/rules/no-force.md index 44c3068d..7aed6a83 100644 --- a/docs/rules/no-force.md +++ b/docs/rules/no-force.md @@ -1,5 +1,6 @@ -# disallow using of 'force: true' option (no-force) +# Disallow using `force: true` with action commands (`cypress/no-force`) + Using `force: true` on inputs appears to be confusing rather than helpful. It usually silences the actual problem instead of providing a way to overcome it. See [Cypress Core Concepts](https://docs.cypress.io/guides/core-concepts/interacting-with-elements.html#Forcing). @@ -8,15 +9,15 @@ If enabling this rule, it's recommended to set the severity to `warn`. ## Rule Details -This rule aims to disallow using of the `force` option on:[`.click()`](https://on.cypress.io/click), +This rule disallows using the `force` option on:[`.click()`](https://on.cypress.io/click), [`.dblclick()`](https://on.cypress.io/dblclick), [`.type()`](https://on.cypress.io/type), [`.rightclick()`](https://on.cypress.io/rightclick), [`.select()`](https://on.cypress.io/select), [`.focus()`](https://on.cypress.io/focus), [`.check()`](https://on.cypress.io/check), and [`.trigger()`](https://on.cypress.io/trigger). + Examples of **incorrect** code for this rule: ```js - cy.get('button').click({force: true}) cy.get('button').dblclick({force: true}) cy.get('input').type('somth', {force: true}) @@ -26,13 +27,11 @@ cy.get('input').rightclick({force: true}) cy.get('input').check({force: true}) cy.get('input').select({force: true}) cy.get('input').focus({force: true}) - ``` Examples of **correct** code for this rule: ```js - cy.get('button').click() cy.get('button').click({multiple: true}) cy.get('button').dblclick() @@ -42,10 +41,8 @@ cy.get('input').rightclick({anyoption: true}) cy.get('input').check() cy.get('input').select() cy.get('input').focus() - ``` - ## When Not To Use It If you don't mind using `{ force: true }` with action commands, then turn this rule off. diff --git a/docs/rules/no-pause.md b/docs/rules/no-pause.md index 757c332c..49ead924 100644 --- a/docs/rules/no-pause.md +++ b/docs/rules/no-pause.md @@ -1,14 +1,17 @@ -## Do not use `cy.pause` command +# Disallow using `cy.pause()` calls (`cypress/no-pause`) -It is recommended to remove [cy.pause](https://on.cypress.io/pause) command before committing the specs to avoid other developers getting unexpected results. + +It is recommended to remove any [cy.pause](https://on.cypress.io/pause) commands before committing specs to avoid other developers getting unexpected results. -Invalid: +## Rule Details + +Examples of **incorrect** code for this rule: ```js cy.pause(); ``` -Valid: +Examples of **correct** code for this rule: ```js // only the parent cy.pause command is detected diff --git a/docs/rules/no-unnecessary-waiting.md b/docs/rules/no-unnecessary-waiting.md index b291c3ea..594879d6 100644 --- a/docs/rules/no-unnecessary-waiting.md +++ b/docs/rules/no-unnecessary-waiting.md @@ -1,3 +1,8 @@ -## No Unnecessary Waiting +# Disallow waiting for arbitrary time periods (`cypress/no-unnecessary-waiting`) + +💼 This rule is enabled in the ✅ `recommended` config. + + +## Further Reading See [the Cypress Best Practices guide](https://on.cypress.io/best-practices#Unnecessary-Waiting). diff --git a/docs/rules/require-data-selectors.md b/docs/rules/require-data-selectors.md index 4c073e7a..9d321169 100644 --- a/docs/rules/require-data-selectors.md +++ b/docs/rules/require-data-selectors.md @@ -1,13 +1,14 @@ -## Only allow `data-*` attribute selectors (require-data-selectors) -only allow `cy.get` to allow selectors that target `data-*` attributes +# Require `data-*` attribute selectors (`cypress/require-data-selectors`) -See [the Cypress Best Practices guide](https://docs.cypress.io/guides/references/best-practices.html#Selecting-Elements). + +Require `cy.get` to use only selectors that target `data-*` attributes. > Note: If you use this rule, consider only using the `warn` error level, since using `data-*` attribute selectors may not always be possible. -### Rule Details +## Rule Details + +Examples of **incorrect** code for this rule: -examples of **incorrect** code with `require-data-selectors`: ```js cy.get(".a") cy.get('[daedta-cy=submit]').click() @@ -16,8 +17,13 @@ cy.get(".btn-large").click() cy.get(".btn-.large").click() ``` -examples of **correct** code with `require-data-selectors`: +Examples of **correct** code for this rule: + ```js cy.get('[data-cy=submit]').click() cy.get('[data-QA=submit]') ``` + +## Further Reading + +See [the Cypress Best Practices guide](https://docs.cypress.io/guides/references/best-practices.html#Selecting-Elements). diff --git a/docs/rules/unsafe-to-chain-command.md b/docs/rules/unsafe-to-chain-command.md index 5186175b..6ae2a4d1 100644 --- a/docs/rules/unsafe-to-chain-command.md +++ b/docs/rules/unsafe-to-chain-command.md @@ -1,3 +1,18 @@ -## Unsafe to chain command +# Disallow actions within chains (`cypress/unsafe-to-chain-command`) + +💼 This rule is enabled in the ✅ `recommended` config. + + +### Options + + + +| Name | Description | Type | Default | +| :-------- | :---------------------------------------------------------- | :---- | :------ | +| `methods` | An additional list of methods to check for unsafe chaining. | Array | `[]` | + + + +## Further Reading See [retry-ability guide](https://docs.cypress.io/guides/core-concepts/retry-ability#Actions-should-be-at-the-end-of-chains-not-the-middle).