How to combine configuration of enzyme and react-testing-library in setup.test.js

Question

Our project has both enzyme and testing-library. My goal is to overwrite getByTestId to my custom. But when I'm adding the second configuration to my setup.test.js - some tests become failing with Found multiple elements with the text.

setup.test.js:

const { configure } = require("enzyme");
const Adapter = require("enzyme-adapter-react-16");
import { configure as conf } from "@testing-library/react";

window.__config = {};
conf({ testIdAttribute: "data-my-test-id" });
configure({ adapter: new Adapter() });

My versions:

"enzyme": "^3.11.0",

"@testing-library/react": "^11.0.4",

Answer 1

This is happening because expected cleanup doesn't work. Move below configuration to a new file, let's say "env-setup.js"

import { configure as conf } from "@testing-library/react";
conf({ testIdAttribute: "data-my-test-id" });

Now, in jest.config.js:

{
  setupFilesAfterEnv: ['<existing_setup_file_path>', '<path>/env-setup.js']
}