Issues with CSS Modules when upgrading from [email protected]

[bensampaio]

💥 Regression Report

I use a custom mock for CSS Modules which has been working well so far but when I upgrade from [email protected] to [email protected] or higher I get the following error on some component snapshots:

PrettyFormatPluginError: _val$hasAttribute.call is not a functionTypeError: _val$hasAttribute.call is not a function

I also tried to use identity-obj-proxy but I get the same issue.

It seems that pretty-format is giving some kind of special treatment to Proxy values when they need to be printed to the snapshot.

Last working version

Worked up to version: 26.1.0

Stopped working in version: 26.2.2 (or probably even 26.2.0)

To Reproduce

Steps to reproduce the behavior:

• Configure jest to use identity-obj-proxy for CSS Modules as described in the docs: https://jestjs.io/docs/en/webpack#mocking-css-modules.
• Then create a component like this:

import React from 'react';

import OtherComponent from './OtherComponent.jsx';
import styles from './SomeComponent.css';

const SomeComponent = () => <OtherComponent styles={styles} />;

export default SomeComponent;

• then try to shallow render the component above using react-test-renderer/shallow:

import React from 'react';
import { createRenderer } from 'react-test-renderer/shallow';

import SomeComponent from './SomeComponent.jsx';

test('renders other component', () => {
    const renderer = createRenderer();

    const result = renderer.render(<SomeComponent />);

    expect(result.getRenderOutput()).toMatchSnapshot();
});

• finally run the tests.

Expected behavior

For the example given above I expected a snapshot like: <OtherComponent styles={[Proxy]} /> or even better <OtherComponent styles={[CSSModule]} />

Link to repl or repo (highly encouraged)

https://repl.it/repls/PurpleGregariousNasm

Run npx envinfo --preset jest

Paste the results here:

System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
  Binaries:
    Node: 12.18.3 - /usr/local/bin/node
    Yarn: 1.22.5 - /usr/local/bin/yarn
    npm: 6.14.6 - /usr/local/bin/npm

[graup]

I think this is fixed in #11000 (merged in v27.0.0-next)

[graup]

However, it is indeed a regression introduced in 26.2.0 (10375b3#diff-613ecfa1f4870d9a44f998eccfd5a298bb867ac8a6c55a9da06cb9338e3d4a54)

[SimenB]

I think this is fixed in #11000 (merged in v27.0.0-next)

Indeed 👍

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.