react-slick: Testing with Jest causes error

Add matchMedia to setup.js

window.matchMedia = window.matchMedia || (() => { return { matches: false, addListener: () => {}, removeListener: () => {}, }; });

@romkacrv , I added matchMedia.js to __mocks__ folder, which contained inside it:

// __mocks__/matchMedia.js
'use strict';

Object.defineProperty(window, 'matchMedia', {
	value: () => ({
		matches: false,
		addListener: () => {},
		removeListener: () => {}
	})
});

Object.defineProperty(window, 'getComputedStyle', {
	value: () => ({
		getPropertyValue: () => {}
	})
});

module.exports = window;

then imported this in setup.js import matchMedia from '../__mocks__/matchMedia';

Boom! 😃

I created test-setup files https://github.com/akiran/react-slick/blob/master/test-setup.js

and added jest config in package.json https://github.com/akiran/react-slick/blob/master/package.json#L74-#L76

hello, not working for me, any suggestions ? it’s appear using react-snapshot plugin

Thanks funciono correctamente: window.matchMedia = window.matchMedia || (() => { return { matches: false, addListener: () => {}, removeListener: () => {}, } }) y en jest.conf

const config = { rootDir: ‘…/’, preset: ‘@redwoodjs/testing/config/jest/web’, resolver: path.resolve(__dirname, ‘./web-custom-resolver.js’), transformIgnorePatterns: [ // Update from this 👈 // “[/\\]node_modules[/\\].+\.(js|jsx|mjs|cjs|ts|tsx)$”, [/\\\\]node_modules[/\\\\](?!${esModules}).+\\.(js|jsx|mjs|cjs|ts|tsx)$, // To this 👈 ‘^.+\.module\.(css|sass|scss)$’, ], setupFilesAfterEnv: [‘web/src/setupTest.js’], }

module.exports = config

@arakno worked for me. But I imported the file in my .test.js file. Thanks for the help.

@arakno That worked for me. Thanks a lot for this