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
+6-6Lines changed: 6 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,15 +4,15 @@ title: act
4
4
5
5
<Intro>
6
6
7
-
`act`는 테스트에서 대기 중인 React 업데이트를 모두 적용한 뒤 단언할 수 있게 도움을 줍니다.
7
+
`act`는 테스트 헬퍼<sup>Helper</sup>로, 대기 중인 React 업데이트를 모두 적용한 뒤 단언<sup>Assert</sup>할 수 있게 도움을 줍니다.
8
8
9
9
```js
10
10
awaitact(async actFn)
11
11
```
12
12
13
13
</Intro>
14
14
15
-
컴포넌트를 단언할 수 있도록 준비하려면 `await act()` 호출 안에 컴포넌트를 렌더링하고 업데이트하는 코드를 감싸세요. 이렇게 하면 테스트가 브라우저에서 작동하는 실제 React 방식과 더 유사하게 실행됩니다.
15
+
컴포넌트를 단언<sup>Assertion</sup>할 수 있도록 준비하려면 `await act()` 호출 안에 컴포넌트를 렌더링하고 업데이트하는 코드를 감싸세요. 이렇게 하면 테스트가 브라우저에서 작동하는 실제 React 방식과 더 유사하게 실행됩니다.
16
16
17
17
<Note>
18
18
`act()`를 직접 사용하는 것이 다소 장황하다고 느껴질 수 있습니다. 반복되는 코드를 줄이고 싶다면 [React Testing Library](https://testing-library.com/docs/react-testing-library/intro)처럼 내부적으로 `act()`로 감싼 헬퍼를 제공하는 라이브러리를 사용하는 것도 좋습니다.
UI 테스트를 작성할 때 렌더링, 사용자 이벤트, 데이터 가져오기 등은 사용자 인터페이스와의 상호작용 "단위"로 볼 수 있습니다. React는 `act()`라는 도우미를 제공하는데 이는 이 "단위"와 관련된 모든 업데이트가 DOM에 적용되기 전까지 단언이 실행되지 않도록 보장해 줍니다.
30
+
UI 테스트를 작성할 때 렌더링, 사용자 이벤트, 데이터 가져오기 등은 사용자 인터페이스와의 상호작용 "단위"로 볼 수 있습니다. React는 `act()`라는 헬퍼를 제공하는데 이는 이 "단위"와 관련된 모든 업데이트가 DOM에 적용되기 전까지 단언이 실행되지 않도록 보장해 줍니다.
31
31
32
32
`act` 라는 이름은 [Arrange-Act-Assert](https://wiki.c2.com/?ArrangeActAssert) 패턴에서 따온 것입니다.
33
33
@@ -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';
@@ -152,7 +152,7 @@ DOM 이벤트를 디스패치할 때는 DOM 컨테이너가 문서에 추가되
152
152
153
153
## 문제 해결 {/*troubleshooting*/}
154
154
155
-
### "The current testing environment is not configured to support act(…)" 오류가 발생하는 경우 {/*error-the-current-testing-environment-is-not-configured-to-support-act*/}
155
+
### "The current testing environment is not configured to support act(...)" 오류가 발생하는 경우 {/*error-the-current-testing-environment-is-not-configured-to-support-act*/}
156
156
157
157
`act`를 사용하려면 테스트 환경에서 `global.IS_REACT_ACT_ENVIRONMENT=true`를 설정해야 합니다. 이 설정은 act가 올바른 환경에서만 사용되도록 보장합니다.
0 commit comments