React native testing library support about restyle HOT 3 CLOSED

Hey there, I'm currently using @shopify/restyle with @testing-library/react-native, all I had to do is to create a file (component-test-utils.tsx in my case) and export everything from @testing-library/react-native overwritting the render export with a function that takes the same arguments as render but uses a predefined wrapper (hence the wrapper is passed as an option)
You can add any other provider your tests need to the Providers function component. In your tests, instead of importing from @testing-library/react-native, you would have to import from your own file instead

component-test-utils.tsx:

import * as React from "react";
import { render } from "@testing-library/react-native";
import { ThemeProvider } from "@shopify/restyle";
import theme from "../Theme";

type ProvidersProps = {
  children?: React.ReactNode;
};

const Providers = ({ children }: ProvidersProps) => {
  return <ThemeProvider theme={theme}>{children}</ThemeProvider>;
};

const customRender: typeof render = (component, options) => {
  return render(component, { wrapper: Providers, ...options });
};

export * from "@testing-library/react-native";
export { customRender as render };

Box.spec.tsx:

import * as React from "react";
import Box from "../Box";
import { render } from "./component-test-utils";

describe("Box component", () => {
  it("renders", () => {
    const testID = "testID";
    const { getByTestId } = render(<Box testID={testID} />);
    expect(getByTestId(testID)).toBeTruthy();
  });
});

It works for me, hope it helps. I don't know if this would solve your problem tho, since I didn't face it

from restyle.

you might want to look into @testing-library/react-native as they have announced they're merging:

https://callstack.com/blog/merge-of-react-native-testing-libraries/

from restyle.

@thozh I'll close this issue for now, let me know if @Charly6596 didn't work for you and then we can re-open it back

from restyle.