Summary: As mentioned in a component test PR I'd like to add some ESlint rules for Jest testing.

I'm adding jest/recommended rules and no-large-snapshots rule with a limit to max. 100 lines.

I'm overriding the default 50 lines as I think that's pretty hard to acheive and 100 lines is still OK to review but please let me know what you think. We're having around 50 to 90 lines in each snapshot here - can be tested by temporarly reduce the maximum line config in .eslintrc to 50.

@melanieseltzer you asked on Gitter how we could limit the size of snapshots and I have some ways to limit the size per snapshot - not sure if it's good practice but I think it's working & OK (note the overall size of the file doesn't count, it's the size of each .toMatchSnapshot that's counted):

split the snapshot render into multiple snapshots by using find with a specific title what we're expecting to see in the snapshot e.g. should render background (active)
use renderProp to snapshot the return value for the render function instead of the wrapping component
extract the conditionally rendered part into a instance method so we can use it to create snapshots
reduce size of props e.g. use a mockSvg instead of a real svg icon
mocking a component that we already tested separately is also OK to reduce snapshot size

Note I probably need to check the snapshot of each open component test PR because of this but I think it will help to keep our snapshot focused and we're not creating snapshots with over 300 lines (e.g. BigClickableButton was that huge because of a single snapshot & a real svg icon). So I'll merge this to the pending PRs once we're having it on Master.

Codecov Report

Merging #366 into master will increase coverage by 0.03%. The diff coverage is 100%.

@@            Coverage Diff             @@
##           master     #366      +/-   ##
==========================================
+ Coverage    37.5%   37.54%   +0.03%     
==========================================
  Files         158      158              
  Lines        3538     3540       +2     
  Branches      449      449              
==========================================
+ Hits         1327     1329       +2     
  Misses       1928     1928              
  Partials      283      283

Impacted Files	Coverage Δ
src/reducers/dependencies.reducer.js	`89.04% <ø> (ø)`	:arrow_up:
...omponents/BigClickableButton/BigClickableButton.js	`100% <100%> (ø)`	:arrow_up:
src/components/ProgressBar/ProgressBar.js	`100% <100%> (ø)`	:arrow_up:
src/components/ProjectPage/ProjectPage.js	`89.28% <100%> (+0.82%)`	:arrow_up:
src/components/Button/StrokeButton.js	`100% <100%> (ø)`	:arrow_up:
src/components/ButtonWithIcon/ButtonWithIcon.js	`100% <100%> (ø)`	:arrow_up:

joshwcomeau / guppy

Setup ESlint rules for Jest #366

Codecov Report