'React' must be in scope when using JSX
2import App from './App';
3
4test('renders learn react link', () => {
5 render(<App />);6 const linkElement = screen.getByText(/learn react/i);
7 expect(linkElement).toBeInTheDocument();
8});'React' must be in scope when using JSX
53 };
54
55 return (
56 <context.Provider value={APIContextValues}> 57 {props.children}
58 </context.Provider>
59 ); 'React' must be in scope when using JSX
50 };
51
52 return (
53 <context.Provider value={APIContextValues}> 54 {props.children}
55 </context.Provider>
56 ); 'React' must be in scope when using JSX
50 };
51
52 return (
53 <context.Provider value={APIContextValues}> 54 {props.children}
55 </context.Provider>
56 ); 'React' must be in scope when using JSX
53 };
54
55 return (
56 <context.Provider value={APIContextValues}> 57 {props.children}
58 </context.Provider>
59 );
Description
The React object contains many objects that are referenced indirectly when expanding JSX.
When using JSX, <a /> expands to React.createElement("a").
Therefore React must be imported.
Bad Practice
const Hello = <div>Hello {this.props.name}</div>;
Recommended
import React from 'react';
const Hello = <div>Hello {this.props.name}</div>;