React-testing-library: render does not work with jest coverage report.

Created on 25 Mar 2020  路  10Comments  路  Source: testing-library/react-testing-library

  • @testing-library/react version:
    10.0.1
  • react version:
    16.13.1
  • node version:
    12.14.0
  • npm (or yarn) version:
    6.13.4

    Relevant code or config:

import { render } from "@testing-library/react";
import React from "react";
import { ThemeProvider } from "emotion-theming";

const renderWithTheme = (ui: React.ReactChild, options = {}) => {
  const theme = {
    colors: {
      white: "#f7f7f7",
      borderColor: "#dde2e7",
      lightGray: "#9f9d9d",
      darkGray: "#343A40",
      black: "#2d2d2d",
      fontColor: "#212529",
      logoBlack: "#1d2122",
      accentColor: "#d83326",
    },
  };

  return render(<ThemeProvider theme={theme}>{ui}</ThemeProvider>, options);
};

export default renderWithTheme;

What you did:

running

npm run jest

vs

npm run jest --coverage

What happened:

running jest by itself works fine, no issues. running jest with coverage gives me this error:

Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

  17 |   };
  18 |
> 19 |   return render(<ThemeProvider theme={theme}>{ui}</ThemeProvider>, options);
     |          ^
  20 | };
  21 |
  22 | export default renderWithTheme;

Reproduction:

Problem description:

Suggested solution:

i see this similar issue here https://github.com/facebook/jest/issues/6827 , but honestly i don't know if the issue lies with jest or with react-testing-library. downgrading jest from 25.1.0 to 24.9.0 does not seem to help though.

Most helpful comment

so i still don't know what caused this to suddenly break for me, but changing the coverage provider and adding to my jest.config:

coverageProvider: "v8", 
testEnvironment: "jest-environment-jsdom-sixteen",

fixed the issue for me. I don't think this has anything to do with react-testing-library, so closing.

All 10 comments

sounds like an issue with how the --coverage flag instrumentation interacts with babel

I had the same issue. Delete my lockfile, and installed packages again. Removed my problem

@omBratteng unfortunately that didn't fix it for me. Thanks though.

I have the same issues, even after deleting my lock file.

After the latest jest and babel updates (don't know what exactly) had the same issue.

I solved this by adding moduleFileExtensions: ['js'] to jest.config.js.

It looks weird, but maybe will help someone too.

@prometium that didn't fix it for me either unfortunately. my jest.config.js already has
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],

so i still don't know what caused this to suddenly break for me, but changing the coverage provider and adding to my jest.config:

coverageProvider: "v8", 
testEnvironment: "jest-environment-jsdom-sixteen",

fixed the issue for me. I don't think this has anything to do with react-testing-library, so closing.

Same Issue here ... Is there any way to solve this Problem when CRA is not ejected?

@vishnu4 thanks, finally something that worked for me, I have already tried many solutions.

@dkleber89 I saw some people downgraded the react-scripts version (link here)

Do we know what the underlying issue here is? What changed in between CRA 3.4.0 & 3.4.1 that caused this to happen? Do we know if this issue will be resolved for the next CRA release?

https://github.com/facebook/create-react-app/compare/v3.4.0...v3.4.1

Was this page helpful?
0 / 5 - 0 ratings

Related issues

NiGhTTraX picture NiGhTTraX  路  3Comments

drwpow picture drwpow  路  4Comments

addamove picture addamove  路  3Comments

suresh777 picture suresh777  路  3Comments

jalvarado91 picture jalvarado91  路  3Comments