[e2e] Add test for useState
Sathya Gunasekaran committed
Aug 4, 2023 at 15:50 UTC
3e9e3a1c925eac761539785334412541c1cb27a0
1 file changed
+58
compiler/forget/packages/babel-plugin-react-forget/src/__tests__/e2e/use-state.e2e.js
new
+58
@@ -0,0 +1,58 @@
1
+/**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+import { render, screen, fireEvent } from "@testing-library/react";
9
+import * as React from "react";
10
+import { useState } from "react";
11
+import { expectLogsAndClear, log } from "./expectLogs";
12
+
13
+function Counter() {
14
+ let [state, setState] = useState(0);
15
+ return (
16
+ <div>
17
+ <Title text="Counter" />
18
+ <span>{state}</span>
19
+ <button data-testid="button" onClick={() => setState(state + 1)}>
20
+ increment
21
+ </button>
22
+ </div>
23
+ );
24
+}
25
+
26
+function Title({ text }) {
27
+ log(`rendering: ${text}`);
28
+ return <h1>{text}</h1>;
29
+}
30
+
31
+test("use-state", async () => {
32
+ const { asFragment } = render(<Counter />);
33
+
34
+ expect(asFragment()).toMatchInlineSnapshot(`
35
+ <DocumentFragment>
36
+ <div>
37
+ <h1>
38
+ Counter
39
+ </h1>
40
+ <span>
41
+ 0
42
+ </span>
43
+ <button
44
+ data-testid="button"
45
+ >
46
+ increment
47
+ </button>
48
+ </div>
49
+ </DocumentFragment>
50
+ `);
51
+
52
+ expectLogsAndClear(["rendering: Counter"]);
53
+
54
+ fireEvent.click(screen.getByTestId("button"));
55
+ await screen.findByText("1");
56
+
57
+ expectLogsAndClear(__FORGET__ ? [] : ["rendering: Counter"]);
58
+});