You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/reference/react/act.md
+7-8Lines changed: 7 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,7 +15,7 @@ await act(async actFn)
15
15
컴포넌트를 단언할 수 있도록 준비하려면 `await act()` 호출 안에 컴포넌트를 렌더링하고 업데이트하는 코드를 감싸세요. 이렇게 하면 테스트가 브라우저에서 작동하는 실제 React 방식과 더 유사하게 실행됩니다.
16
16
17
17
<Note>
18
-
`act()`를 직접 사용하는 것이 다소 장황하다고 느껴질 수 있습니다. 반복되는 코드를 줄이고 싶다면 [React Testing Library](https://testing-library.com/docs/react-testing-library/intro)처럼 내부적으로 `act()`로 감싼 헬퍼를 제공하는 라이브러리를 사용하는 것도 좋습니다.
18
+
`act()`를 직접 사용하는 것이 다소 장황하다고 느껴질 수 있습니다. 반복되는 코드를 줄이고 싶다면 [React Testing Library](https://testing-library.com/docs/react-testing-library/intro)처럼 내부적으로 `act()`로 감싼 헬퍼를 제공하는 라이브러리를 사용하는 것도 좋습니다.
19
19
</Note>
20
20
21
21
@@ -60,7 +60,7 @@ it ('renders with button disabled', async () => {
60
60
61
61
컴포넌트를 테스트할 때 `act`를 사용하면 출력 결과에 대한 단언을 더 안전하게 할 수 있습니다.
62
62
63
-
예시로 `Counter`라는 컴포넌트가 있다고 가정하고 아래 사용 예시는 이를 테스트하는 방법을 보여줍니다:
63
+
예시로 `Counter`라는 컴포넌트가 있다고 가정하고 아래 사용 예시는 이를 테스트하는 방법을 보여줍니다.
64
64
65
65
```js
66
66
functionCounter() {
@@ -86,7 +86,7 @@ function Counter() {
86
86
87
87
### 테스트에서 컴포넌트를 렌더링하는 방법 {/*rendering-components-in-tests*/}
88
88
89
-
컴포넌트의 렌더 결과를 테스트하려면 렌더링 코드를 `act()`로 감싸야 합니다:
89
+
컴포넌트의 렌더 결과를 테스트하려면 렌더링 코드를 `act()`로 감싸야 합니다.
90
90
91
91
```js {10,12}
92
92
import {act} from'react';
@@ -115,7 +115,7 @@ it('can render and update a counter', async () => {
115
115
116
116
### 테스트에서 이벤트 디스패칭하는 방법 {/*dispatching-events-in-tests*/}
117
117
118
-
이벤트를 테스트하려면 이벤트 를 `act()`로 감싸세요:
118
+
이벤트를 테스트하려면 이벤트 를 `act()`로 감싸세요.
119
119
120
120
```js {14,16}
121
121
import {act} from'react';
@@ -146,8 +146,7 @@ it.only('can render and update a counter', async () => {
146
146
147
147
<Pitfall>
148
148
149
-
DOM 이벤트를 디스패치할 때는 DOM 컨테이너가 문서에 추가되어 있어야 합니다. 반복되는 설정 코드를 줄이고 싶다면
150
-
[React Testing Library](https://testing-library.com/docs/react-testing-library/intro)를 사용하는 것도 고려해보세요.
149
+
DOM 이벤트를 디스패치할 때는 DOM 컨테이너가 문서에 추가되어 있어야 합니다. 반복되는 설정 코드를 줄이고 싶다면 [React Testing Library](https://testing-library.com/docs/react-testing-library/intro)를 사용하는 것도 고려해보세요.
151
150
152
151
</Pitfall>
153
152
@@ -157,15 +156,15 @@ DOM 이벤트를 디스패치할 때는 DOM 컨테이너가 문서에 추가되
157
156
158
157
`act`를 사용하려면 테스트 환경에서 `global.IS_REACT_ACT_ENVIRONMENT=true`를 설정해야 합니다. 이 설정은 act가 올바른 환경에서만 사용되도록 보장합니다.
159
158
160
-
이 전역 설정이 없으면 다음과 같은 오류가 표시됩니다:
159
+
이 전역 설정이 없으면 다음과 같은 오류가 표시됩니다.
161
160
162
161
<ConsoleBlocklevel="error">
163
162
164
163
Warning: The current testing environment is not configured to support act(...)
0 commit comments