← All React exercises

React quiz · 15

Memo 2

StatusNot taken

Question

What does the code snippet to the right output by console.log?

Code

exercise.tsx
1import * as React from 'react'
2import { memo, useState } from 'react'
3import { createRoot } from 'react-dom/client'
4import { screen, fireEvent } from "@testing-library/dom";
5
6function _B() {
7  console.log('B')
8  return null
9}
10
11const B = memo(_B)
12
13function _A({ children }) {
14  console.log('A')
15  return children
16}
17
18const A = memo(_A)
19
20function App() {
21  const [count, setCount] = useState(0)
22  return <div>
23    <button onClick={
24      () => setCount(count => count + 1)
25    }>
26      click me
27    </button>
28    <A><B/></A>
29  </div>
30}
31
32const root = createRoot(document.getElementById("root"));
33root.render(<App />);
34
35(async function () {
36  const action = await screen.findByText('click me')
37  fireEvent.click(action);
38})()