diff --git a/web/gui-v2/src/components/ListView.test.js b/web/gui-v2/src/components/ListView.test.js index 86363d16..03e79b83 100644 --- a/web/gui-v2/src/components/ListView.test.js +++ b/web/gui-v2/src/components/ListView.test.js @@ -1,4 +1,5 @@ import React from 'react'; +import { CacheProvider } from '@emotion/react'; import { getByRole, getByText, @@ -6,7 +7,7 @@ import { waitForElementToBeRemoved, } from '@testing-library/react'; -import { userEventSetup } from '../util/testing'; +import { emotionCache, userEventSetup } from '../util/testing'; import ListView from './ListView'; import { exportsForTestingOnly } from './ListViewTable'; @@ -18,7 +19,9 @@ const REMOVED_COLUMN = 'AI publications'; describe("ListView", () => { it("adjust filters and reset dropdown filters", async () => { const { user } = userEventSetup( - + + + ); // Filter by Europe and verify that the count updates @@ -37,7 +40,9 @@ describe("ListView", () => { it("selects a group of companies", async () => { const { user } = userEventSetup( - + + + ); const companyHeader = screen.getByRole('columnheader', { name: /company/i }); @@ -51,7 +56,9 @@ describe("ListView", () => { describe("add/remove columns dialog", () => { it("opens the dialog and changes columns", async () => { const { user } = userEventSetup( - + + + ); for ( const column of INITIAL_COLUMNS ) { diff --git a/web/gui-v2/src/util/testing.js b/web/gui-v2/src/util/testing.js index 52f910a2..ea6349fe 100644 --- a/web/gui-v2/src/util/testing.js +++ b/web/gui-v2/src/util/testing.js @@ -1,5 +1,16 @@ -import { render } from "@testing-library/react"; -import userEvent from "@testing-library/user-event"; +import createCache from '@emotion/cache'; +import { render } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; + +// Turn off Emotion's persistant and incredibly annoying warning that `:first-child` +// and `:nth-child` are "potentially unsafe when doing server-side rendering", +// even though we aren't using SSR and it has no effect on this. +// Derived from https://github.com/emotion-js/emotion/issues/1105#issuecomment-557726922 +const emotionCache = createCache({ + key: 'eto-emotion-cache', +}); +emotionCache.compat = true; +export { emotionCache }; export function userEventSetup(jsx) { return {