Closed
Description
@testing-library/reactversion: ^11.1.0- Testing Framework and version(JEST): ^26.6.0
- Dom ENV: JS dom(default, no specific config)
Relevant code or config:
import { render as rtlRender, RenderOptions, screen } from '@testing-library/react';
import { createMemoryHistory } from 'history';
import React, { Component, ReactElement } from 'react';
import { Router } from 'react-router-dom';
import App from './App';
type DefaultOptions = Omit<RenderOptions, 'queries'> & { route: string };
const render = (ui: ReactElement, options?: DefaultOptions) => {
const history = createMemoryHistory({ initialEntries: [options?.route || '/'] });
const Wrapper = ({ children }: { children: ReactElement }) => {
return <Router history={history}>{children}</Router>;
};
return rtlRender(ui, { wrapper: Wrapper, ...options });
};
test('renders to screen', () => {
render(<App />);
expect(screen.getByTestId('router')).toBeInTheDocument();
});What happened:
This is a typescript error. check the screenshot below for the error:
Problem description:
I believe the problem is coming from here:
Suggested solution:
I believe that this can be solved easily by a simple change. I've changed the wrapper type from React.ComponentType to JSX.Element. Is this a bug or is this being done intentionally?
