Open
Description
I'm trying to use this library with @testing-library/react and can't make it work properly. I changed package versions, looked on other github repositories and impossible to find a working example. (Does anyone has a working repo to show ?)
package.json
"@swc/core": "^1.3.21",
"@swc/jest": "^0.2.23",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^12.1.2",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.0.0",
"@types/react": "^17.0.38",
"@types/react-dom": "^17.0.11",
"@types/styled-components": "^5.1.19",
"jest": "^27.0.0",
"jest-styled-components": "^7.1.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"styled-components": "^5.0.0",
"typescript": "^4.5.4"
test file
import React from 'react';
import { render, screen } from '@testing-library/react';
import styled from 'styled-components';
import '@testing-library/jest-dom/extend-expect';
import 'jest-styled-components';
const Button = styled.button`
color: yellow;
`;
describe.only('Test', () => {
it('works', () => {
const { container } = render(<Button />);
expect(container.firstChild).toMatchSnapshot();
});
});
snapshot:
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Test works 1`] = `
<button
class="hJBeEn"
/>
`;
jest.config.js
module.exports = {
roots: ['<rootDir>/src'],
collectCoverageFrom: [
'src/**/*.{js,jsx,ts,tsx}',
'!src/**/*.d.ts',
'!src/mocks/**',
],
coveragePathIgnorePatterns: [],
testEnvironment: 'jsdom',
modulePaths: ['<rootDir>/src'],
transform: {
'^.+\\.(ts|js|tsx|jsx)$': '@swc/jest',
'^.+\\.css$': '<rootDir>/config/jest/cssTransform.js',
},
modulePaths: ['<rootDir>/src'],
// testRunner: "jest-jasmine2" // I tried with default and jest-jasmine2
};
cssTransform.js
module.exports = {
process() {
return 'module.exports = {};';
},
getCacheKey() {
return 'cssTransform';
},
};
Metadata
Metadata
Assignees
Labels
No labels