2

When snapshot testing a component I want to only test the component itself, not the actions, state or the connecting function that is in Redux. This is because I have tests for these functions in other places.

This messes up your code coverage because it expects that you test all functions.

For example:

export const EarningsInfo = ({ close }) => ( /* ... */ );

const mapStateToProps = _ => ({});

const mapActionsToProps = dispatch => ({
  close: _ => dispatch(closeModal()),
});

export default connect(mapStateToProps, mapActionsToProps)(EarningsInfo);

Jest is expecting that you test

  1. earningsInfo
  2. mapStateToProps
  3. mapActionsToProps
  4. connect

So if you have a simple test like this:

import { EarningsInfo } from '../components/EarningsInfo';

it('renders correctly', () => {
  const tree = renderer.create(
    <EarningsInfo close={ () => null } />
  ).toJSON();

  expect(tree).toMatchSnapshot();
});

Code coverage reports that you are only testing 25% of the file. I am sure this is working as intended.

My question is two fold

  1. Am I correct in my thinking that mapStateToProps, mapActionsToProps and connect shouldn't need to be tested.
  2. Is there a way to ignore a function name in for coverage purposes?
2
  • Actually after looking at this redux.js.org/docs/recipes/… I believe I am right in thinking the tests should be on the component itself, not the other functions. So really what would be the best way to ignore function names in Jest? Commented Sep 28, 2016 at 17:26
  • Personally, I would export the EarningsInfo component as a named export (in addition to the default export of the connected component) and just test the raw EarningsInfo component. Then have a few integration tests that make sure things are wired together properly. Commented Sep 28, 2016 at 18:22

1 Answer 1

1
  1. connect should not be tested as react-redux's own tests already cover this. If mapStateToProps or mapActionsToProps have any non-standard / complicated / business logic then it may make sense to test them.

  2. Yes, but it can be a bit fragile - http://blog.dmbcllc.com/es2015-code-coverage-and-jest-react-js-unit-testing/

Don't worry about 100% code coverage, focus on what is critical AND can be tested well/easily with unit testing.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.