Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: rule documentation harmonization #198

Merged
merged 4 commits into from
Apr 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions docs/rules/assertion-before-screenshot.md
Original file line number Diff line number Diff line change
@@ -1,19 +1,22 @@
## Assertion Before Screenshot
# Require screenshots to be preceded by an assertion (`cypress/assertion-before-screenshot`)

<!-- end auto-generated rule header -->
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');
Expand Down
7 changes: 6 additions & 1 deletion docs/rules/no-assigning-return-values.md
Original file line number Diff line number Diff line change
@@ -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.

<!-- end auto-generated rule header -->
## Further Reading

See [the Cypress Best Practices guide](https://on.cypress.io/best-practices#Assigning-Return-Values).
8 changes: 4 additions & 4 deletions docs/rules/no-async-before.md
Original file line number Diff line number Diff line change
@@ -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.
<!-- end auto-generated rule header -->
Cypress commands that return a promise may cause side effects in `before`/`beforeEach` hooks, possibly causing unexpected behavior.

## Rule Details

Expand Down Expand Up @@ -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

Expand Down
9 changes: 6 additions & 3 deletions docs/rules/no-async-tests.md
Original file line number Diff line number Diff line change
@@ -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.

<!-- end auto-generated rule header -->
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

Expand Down Expand Up @@ -38,7 +42,6 @@ describe('my feature', () => {
// other operations
})
})

```

## When Not To Use It
Expand Down
11 changes: 4 additions & 7 deletions docs/rules/no-force.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
# disallow using of 'force: true' option (no-force)
# Disallow using `force: true` with action commands (`cypress/no-force`)

<!-- end auto-generated rule header -->
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).
Expand All @@ -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})
Expand All @@ -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()
Expand All @@ -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.
11 changes: 7 additions & 4 deletions docs/rules/no-pause.md
Original file line number Diff line number Diff line change
@@ -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.
<!-- end auto-generated rule header -->
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
Expand Down
7 changes: 6 additions & 1 deletion docs/rules/no-unnecessary-waiting.md
Original file line number Diff line number Diff line change
@@ -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.

<!-- end auto-generated rule header -->
## Further Reading

See [the Cypress Best Practices guide](https://on.cypress.io/best-practices#Unnecessary-Waiting).
18 changes: 12 additions & 6 deletions docs/rules/require-data-selectors.md
Original file line number Diff line number Diff line change
@@ -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).
<!-- end auto-generated rule header -->
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()
Expand All @@ -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).
17 changes: 16 additions & 1 deletion docs/rules/unsafe-to-chain-command.md
Original file line number Diff line number Diff line change
@@ -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.

<!-- end auto-generated rule header -->
### Options

<!-- begin auto-generated rule options list -->

| Name | Description | Type | Default |
| :-------- | :---------------------------------------------------------- | :---- | :------ |
| `methods` | An additional list of methods to check for unsafe chaining. | Array | `[]` |

<!-- end auto-generated rule options list -->

## 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).