Test suite failed to run Your test suite must contain at least one test. - webpack-dev-server

Im getting this error
Test suite failed to run
Your test suite must contain at least one test.
at node_modules/jest-cli/build/test_scheduler.js:108:22
with jest configuration
"jest": {
"transform": {
".*": "./tests/preprocessor.js"
},
"modulePaths": [
"src"
],
"testPathIgnorePatterns": [
"/node_modules/",
"/vendor"
],
"testRegex": "\\.spec\\.js"
}
any help how can i solve this
im i missing something
thanks in advance
carlos vieira

This issue is happening because you have created the test file, but not included any of the tests.
example:- The below unit test consists of only describe part not covering any tests (commented as of now)
import { mount } from "enzyme";
import React from "react";
import Privileges from "./privileges";
describe("Privileges Component ", () => {
//const wrapper = mount(<Privileges />).find(".privileges-container");
// it("should render in DOM", () => {
// expect(wrapper.length).toEqual(1);
// });
});

Related

Why do i get this error, Cannot use import statement outside a module

so im trying to make a test for my component a simple test that shows if the component was rendered
test('Should render the movie info', () => {
renderWithContext(<MovieInfo movie={mockMovies[0]} />);
expect(screen.getByText('Terrifier 2')).toBeInTheDocument();
});
but i get this error:
SyntaxError: Cannot use import statement outside a module
the problem seems to have be about axios some how because it happens when trying to import axios.
> 2 | import axios from 'axios';
| ^
i have a jest.config.js file like this.
const { compilerOptions } = require('./tsconfig.json');
const { pathsToModuleNameMapper } = require('ts-jest');
const { default: tsjPreset } = require('ts-jest');
module.exports = {
transform: {
...tsjPreset.transform,
'+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2|pdf)$':
'jest-transform-stub',
'^.+\\.ts?$': 'ts-jest',
},
moduleDirectories: ['src', 'node_modules'],
moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths),
setupFilesAfterEnv: ['<rootDir>/src/setupTests.ts'],
transformIgnorePatterns: ['node_modules/(?!(axios)/)'],
};
and i have installed ts-jest, #types/jest and jest-transform-stub as dependencies
i have looked on the internet and this seems to be about some jest config that im doing wrong but nothing i do works
I solved this by adding this to my package.json i think its a hacky way of doing it but is the only way it worked for me.
"test": "react-scripts test --transformIgnorePatterns \"node_modules/(?!axios)/\"",

make sure to include the file in Jest's transformIgnorePatterns as wel

I'm trying to make jest/enzyme tests in react
I have this test:
import React from 'react';
import { shallow } from 'enzyme';
import { mount } from 'enzyme'
import WorkOutForm from './workOutForm';
describe('WorkOutForm', () => {
it('should start a new workoutForm with empty state', () => {
const component = mount(<WorkOutForm/>)
expect(component).toMatchSnapshot();
});
})
but when i do a npm run test i receive:
src/workout/workOut.test.js ● Test suite failed to run
babel-jest: Babel ignores src/workout/workOutForm.jsx - make sure to include the file in Jest's transformIgnorePatterns as well.
I try to add this file in the package.json:
"jest": {
"transformIgnorePatterns": [
"src/workout/workOutForm.jsx"
]
}
but i'm receiving the same error.
where i have to put this?
where i have to put this?
You should not ignore jsx source files. What you need to do is convert your jsx to js using babel.
You need to use babel-preset-react. This will automatically add #babel/plugin-transform-react-jsx for the transformation.
Then put this in your .babelrc
{
"presets": ["#babel/preset-react"]
}
I have already this error and i fixed changing the code from:
"ignore": [
"./test",
"./src/assets",
"./src/stories",
"./src/.storybook"
]
To this:
"ignore": [
"./src/assets",
"./src/stories",
"./src/.storybook"
]
I remove my test folder from the .babelrc ignore prop and its works for me!

Using React stroybook as Jest test

I have a React storybook and what to use it as my test cases
I have a "loader.js" that import all the stories
import sourceBasic from 'raw-loader!./Basics/foo.js?sourceMap';
import Basic from './Basics/foo';
const tree = {
Basics:[
{
title:'Creating and applying a style',
source:sourceBasic, element:Basic
},
{ .... }
],
[ .... ],
....
}
export default tree
I use the raw-loader and sourceMap to show the source with the element in storybook
This works great.
My problem is when I try to import with Jest
FAIL ./index.test.js
● Test suite failed to run
Cannot find module 'raw-loader!./Basics/foo.js?sourceMap' from 'load.js'
at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:179:17)
at Object.<anonymous> (example/stories/load.js:2:34)
The test file
import React from 'react';
import renderer from 'react-test-renderer';
import load from './example/stories/load'
for(const groupName in load ){
const groupArray = load[groupName];
describe(groupName, () => {
for(const item of groupArray ){
test(item.title, () => {
const elem = renderer.create(item.element);
expect(elem.toJSON()).toMatchSnapshot();
}) // END test
} // END for
}) // END describe
} // END for
Thanks for your help
UPDATE
The update and working stroybook as test is implemented on the project react-outline
You can clone it(react-outline), npm install and then npm test to see it in action.
Here is the output on travis :)
If you don't care about the raw-source and want to mock it. You can use the moduleNameMapper under your Jest setting within your package.json.
This will let you intercept all require/import based on a regex match.
Add to your package.json:
...
"dependencies": {
...
},
...
"jest": {
"globals": {
"__TEST__": true
},
"moduleNameMapper": {
"\\.(css|jpg|png)$": "<rootDir>/empty-module.js",
"^raw-loader": "<rootDir>/empty-module.js"
},
"testPathIgnorePatterns": [
"/node_modules/"
],
"verbose": true
}
}

Typescript test with Jest with Enzyme does not recognise components

I have a test for Typescript using Jest with Enzyme. Tests work perfect but when i add a component, it gives me a Unterminated regular expression error
import {} from 'jasmine';
import {shallow} from 'enzyme';
import {Show, Hide} from '../components/show_hide';
describe('<Show /> Tests', () => {
it('Show should render once', () => {
const component = shallow(<Show />);
expect(component).toHaveLength(1);
})
})
When I run yarn test the result on the console is
FAIL __tests__/show_hide.ts
● Test suite failed to run
/path/to/repo/__tests__/show_hide.ts: Unterminated regular expression (4:35)
2 | describe('<Show /> Tests', () => {
3 | it('Show should render once', () => {
> 4 | const component = shallow(/>);, expect(component).toHaveLength(1));
| ^
5 | });
6 | });
7 | //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2hvd19oaWRlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vX190ZXN0c19fL3Nob3dfaGlkZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLEVBQUMsT0FBTyxFQUFDLE1BQU0sUUFBUSxDQUFDO0FBRy9CLFFBQVEsQ0FBQyxnQkFBZ0IsRUFBRTtJQUMxQixFQUFFLENBQUMsbUJBQW1CLEVBQUU7UUFDdkIsTUFBTSxTQUFTLEdBQUcsT0FBTyxDQUFPLElBQUksRUFDcEMsTUFBTSxDQUFDLFNBQVMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsQ0FBQSxDQUFDO0lBQ25DLENBQUMsQ0FBQyxDQUFBO0FBQ0gsQ0FBQyxDQUFDLENBQUEifQ==
The jest configuration inside package.json is
"jest": {
"transform": {
"^.+\\.tsx?$": "<rootDir>/node_modules/ts-jest/preprocessor.js"
},
"testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"json"
],
},
Any thoughts on that?
ts files are for pure typescript code, and tsx for react (like jsx).
Rename the file to tsx
It seems that forgetting to import React caused the issue.

Jest testing error: Unexpected token <

Im trying to test my components with Jest.
I believe that I've installed all the required modules to run the tests.
Last thing that I did was to run
yarn add -D babel-plugin-transform-es2015-modules-commonjs.
This is my code while trying to do a simple Jest test:
import React, { Component } from 'react';
import { shallow } from 'enzyme';
import Market from '../src/components/Market.js';
test('Market should render as expected', () => {
const component = shallow(<Market />);
console.log(component);
});
The error message on the console points to the first < at the start of invoking the Market component on line 6.
I had the same issue. Adding transform or anything didn't fix it. So i finally added .babelrc file and added following configuration and it worked.
{
"presets": ["es2015", "react"]
}
Hope this will help you.

Resources