|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172 |
- # disallow large snapshots (`no-large-snapshots`)
-
- When using Jest's snapshot capability one should be mindful of the size of
- created snapshots. As a general best practice snapshots should be limited in
- size in order to be more manageable and reviewable. A stored snapshot is only as
- good as its review and as such keeping it short, sweet, and readable is
- important to allow for thorough reviews.
-
- ## Usage
-
- Because Jest snapshots are written with back-ticks (\` \`) which are only valid
- with
- [ES2015 onwards](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals)
- you should set `parserOptions` in your config to at least allow ES2015 in order
- to use this rule:
-
- ```js
- module.exports = {
- parserOptions: {
- ecmaVersion: 2015,
- },
- };
- ```
-
- ## Rule Details
-
- This rule looks at all Jest inline and external snapshots (files with `.snap`
- extension) and validates that each stored snapshot within those files does not
- exceed 50 lines (by default, this is configurable as explained in `Options`
- section below).
-
- Example of **incorrect** code for this rule:
-
- ```js
- exports[`a large snapshot 1`] = `
- line 1
- line 2
- line 3
- line 4
- line 5
- line 6
- line 7
- line 8
- line 9
- line 10
- line 11
- line 12
- line 13
- line 14
- line 15
- line 16
- line 17
- line 18
- line 19
- line 20
- line 21
- line 22
- line 23
- line 24
- line 25
- line 26
- line 27
- line 28
- line 29
- line 30
- line 31
- line 32
- line 33
- line 34
- line 35
- line 36
- line 37
- line 38
- line 39
- line 40
- line 41
- line 42
- line 43
- line 44
- line 45
- line 46
- line 47
- line 48
- line 49
- line 50
- line 51
- `;
- ```
-
- Example of **correct** code for this rule:
-
- ```js
- exports[`a more manageable and readable snapshot 1`] = `
- line 1
- line 2
- line 3
- line 4
- `;
- ```
-
- ## Options
-
- This rule has options for modifying the max number of lines allowed for a
- snapshot:
-
- In an `eslintrc` file:
-
- ```json
- {
- "rules": {
- "jest/no-large-snapshots": ["warn", { "maxSize": 12, "inlineMaxSize": 6 }]
- }
- }
- ```
-
- Max number of lines allowed could be defined by snapshot type (Inline and
- External). Use `inlineMaxSize` for
- [Inline Snapshots](https://jestjs.io/docs/en/snapshot-testing#inline-snapshots)
- size and `maxSize` for
- [External Snapshots](https://jestjs.io/docs/en/snapshot-testing#snapshot-testing-with-jest).
- If only `maxSize` is provided on options, the value of `maxSize` will be used to
- both snapshot types (Inline and External).
-
- Since `eslint-disable` comments are not preserved by Jest when updating
- snapshots, you can use the `allowedSnapshots` option to have specific snapshots
- allowed regardless of their size.
-
- This option takes a map, with the key being the absolute filepath to a snapshot
- file, and the value an array of values made up of strings and regular
- expressions to compare to the names of the snapshots in the `.snap` file when
- checking if the snapshots size should be allowed.
-
- Note that regular expressions can only be passed in via `.eslintrc.js` as
- instances of `RegExp`.
-
- In an `.eslintrc.js` file:
-
- ```javascript
- module.exports = {
- rules: {
- 'jest/no-large-snapshots': [
- 'error',
- {
- allowedSnapshots: {
- '/path/to/file.js.snap': ['snapshot name 1', /a big snapshot \d+/],
- },
- },
- ],
- },
- };
- ```
-
- Since absolute paths are typically not very portable, you can use the builtin
- `path.resolve` function to expand relative paths into absolutes like so:
-
- ```javascript
- const path = require('path');
-
- module.exports = {
- rules: {
- 'jest/no-large-snapshots': [
- 'error',
- {
- allowedSnapshots: {
- [path.resolve('test/__snapshots__/get.js.snap')]: ['full request'],
- [path.resolve('test/__snapshots__/put.js.snap')]: ['full request'],
- },
- },
- ],
- },
- };
- ```
|