I'm working on a project in React using CSS modules for stylings.

I would like to test a component using Jest and React Testing Library, but when I try to render it I get this error:

Test suite failed to run

cssModule has no keys

  3 | export default (style: {[key: string]: string}):any => {
  4 |     block.setSettings({throwOnError: true, modifierDelimiter: '--'});
> 5 |     return block(style);
    |                 ^
  6 | };
  7 |

block is an override from a function exported by the library bem-css-modules which I use for keeping BEM nomenclature while implementing css-modules.

I have managed to log the exact style (imported by the .module.scss file) which is passed to this function, and I have found that it is actually empty when rendering the component with react-testing-library:

import React from 'react';
import MyIcon from 'shared/components/myIcon/myIcon.component';
import styles from './myButton.module.scss';
import block from 'utils/bemCssModulesConfig';

console.log('styles', styles) // this logs "styles, {}" so it's empty object
const bem = block(styles);

This is the moduleNameMapper I am currently using:

"moduleNameMapper": {
      "^.+\\.(scss|sass|css|less)$": "identity-obj-proxy"
}

I have already tryed using custom proxies copied from the internet or using external libraries as moduleNameMappers.