Emotion: jest-emotion 9.2.0 replacing non-emotion class names

[wKovacs64]

• emotion version: 9.2.1 (jest-emotion: 9.2.0)
• react version: 16.4.0

Relevant code.

import React from "react";
import { css, cx } from "emotion";
import renderer from "react-test-renderer";

const classes = cx(
  "net-42",
  "net",
  css`
    color: darkorchid;
  `
);

it("renders with correct styles", () => {
  expect(renderer.create(<div className={classes} />)).toMatchSnapshot();
});

What you did:

Upgraded jest-emotion from 9.1.3 to 9.2.0.

What happened:

Serialized snapshot tests failed due to incorrect classes being applied.

- Snapshot
+ Received

<div
-  className="net-42 net emotion-0"
+  className="emotion-0 net emotion-1"
/>

Reproduction:

~https://github.com/wKovacs64/jest-emotion-testing~ (baleeted)

Problem description:

CSS classes that match the /e[a-zA-Z0-9-]+[0-9]+/ regex (e.g. net-42) are being treated as emotion classes.

Suggested solution:

I think this came from https://github.com/emotion-js/emotion/pull/641 and the regex just needs updating?

[wKovacs64]

Updated the original issue to be more accurate. I would submit a PR to remedy the false positives, but I don't know exactly what it's supposed to match. @mitchellhamilton can probably fix it in 2 seconds. :)

[mitchellhamilton]

Just published [email protected] with this fixed.