[정준영] Chapter9 테스트코드 수정완료

Google-Developer-Student-Clubs-TUK · Nov 21, 2022 · fdd2d82 · fdd2d82
1 parent 739f68c
commit fdd2d82
Show file tree

Hide file tree

Showing 13 changed files with 1,000 additions and 70 deletions.
diff --git a/junyoung/week5/chapter9/react-router-list/src/App.test.tsx b/junyoung/week5/chapter9/react-router-list/src/App.test.tsx
@@ -11,7 +11,7 @@ describe('<App />', () => {
     history.push('/');
 
     const { container } = render(
-      <Router history={history}>
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
@@ -33,15 +33,21 @@ describe('<App />', () => {
     const history = createMemoryHistory();
     history.push('/');
 
-    const { container } = render(
-      <Router history={history}>
+    const { container, rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
 
     const addButton = screen.getByText('+');
     fireEvent.click(addButton);
 
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );
+
     const header = screen.getByText('할 일 추가');
     expect(header).toBeInTheDocument();
     const goBack = screen.getByText('돌아가기');
@@ -54,6 +60,13 @@ describe('<App />', () => {
     expect(container).toMatchSnapshot();
 
     fireEvent.click(goBack);
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
     expect(header.textContent).toBe('할 일 목록');
     const toDoList = screen.getByTestId('toDoList');
     expect(toDoList).toBeInTheDocument();
@@ -65,8 +78,8 @@ describe('<App />', () => {
     const history = createMemoryHistory();
     history.push('/');
 
-    const { container } = render(
-      <Router history={history}>
+    const { container, rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
@@ -75,6 +88,12 @@ describe('<App />', () => {
     expect(toDoItem).toBeInTheDocument();
     fireEvent.click(toDoItem);
 
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );
+
     const header = screen.getByText('할 일 상세');
     expect(header).toBeInTheDocument();
     const goBack = screen.getByText('돌아가기');
@@ -87,17 +106,24 @@ describe('<App />', () => {
     expect(container).toMatchSnapshot();
 
     fireEvent.click(goBack);
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
     expect(header.textContent).toBe('할 일 목록');
     const toDoList = screen.getByTestId('toDoList');
     expect(toDoList).toBeInTheDocument();
   });
 
   it('shows Not Found page if the user enters the wrong URL, and go back to List page', () => {
     const history = createMemoryHistory();
-    history.push('/foo');//정의하지 않은 URL의미
+    history.push('/foo');
 
-    const { container } = render(
-      <Router history={history}>
+    const { container, rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
@@ -112,6 +138,14 @@ describe('<App />', () => {
     expect(container).toMatchSnapshot();
 
     fireEvent.click(goBack);
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
+
     expect(header.textContent).toBe('할 일 목록');
     const toDoList = screen.getByTestId('toDoList');
     expect(toDoList).toBeInTheDocument();
@@ -121,20 +155,33 @@ describe('<App />', () => {
     const history = createMemoryHistory();
     history.push('/');
 
-    render(
-      <Router history={history}>
+    const { rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
 
     const addButton = screen.getByText('+');
     fireEvent.click(addButton);
 
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );
+
     const input = screen.getByPlaceholderText('할 일을 입력해 주세요');
     const button = screen.getByText('추가');
     fireEvent.change(input, { target: { value: 'New ToDo' } });
     fireEvent.click(button);
 
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
     const header = screen.getByText('할 일 목록');
     expect(header).toBeInTheDocument();
     const newToDo = screen.getByText('New ToDo');
@@ -147,8 +194,8 @@ describe('<App />', () => {
     const history = createMemoryHistory();
     history.push('/');
 
-    render(
-      <Router history={history}>
+    const { rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
@@ -159,6 +206,14 @@ describe('<App />', () => {
     expect(deleteButton).toBeInTheDocument();
 
     fireEvent.click(deleteButton);
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
+
     expect(toDoItem).not.toBeInTheDocument();
     expect(deleteButton).not.toBeInTheDocument();
     expect(localStorage.getItem('ToDoList')).toBe('[]');
@@ -170,21 +225,37 @@ describe('<App />', () => {
     const history = createMemoryHistory();
     history.push('/');
 
-    render(
-      <Router history={history}>
+    const { rerender } = render(
+      <Router location={history.location} navigator={history}>
         <App />
       </Router>,
     );
 
     const toDoItem = screen.getByText('ToDo 1');
     expect(toDoItem).toBeInTheDocument();
+
     fireEvent.click(toDoItem);
+
+
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );  
+
+
     const header = screen.getByText('할 일 상세');
     expect(header).toBeInTheDocument();
 
     const deleteButton = screen.getByText('삭제');
     fireEvent.click(deleteButton);
 
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <App />
+      </Router>,
+    );
+
     expect(header.textContent).toBe('할 일 목록');
     const toDoList = screen.getByTestId('toDoList');
     expect(toDoList).toBeInTheDocument();

diff --git a/...k5/chapter9/react-router-list/src/Components/PageHeader/__snapshots__/index.test.tsx.snap b/...k5/chapter9/react-router-list/src/Components/PageHeader/__snapshots__/index.test.tsx.snap
@@ -0,0 +1,42 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<PageHeader /> renders component correctly 1`] = `
+.c0 {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  background-color: #1E40FF;
+}
+
+.c1 {
+  padding: 20px;
+  color: #FFFFFF;
+  font-size: 20px;
+  font-weight: 600;
+}
+
+<div>
+  <div
+    class="c0"
+  >
+    <div
+      class="c1"
+    >
+      할 일 목록
+    </div>
+  </div>
+</div>
+`;
diff --git a/junyoung/week5/chapter9/react-router-list/src/Components/PageHeader/index.test.tsx b/junyoung/week5/chapter9/react-router-list/src/Components/PageHeader/index.test.tsx
@@ -13,7 +13,7 @@ describe('<PageHeader />', () => {
     history.push('/');
 
     const { container } = render(
-      <Router history={history}>
+      <Router location={history.location} navigator={history}>
         <PageHeader />
       </Router>,
     );
@@ -31,7 +31,7 @@ describe('<PageHeader />', () => {
     history.push('/add');
 
     render(
-      <Router history={history}>
+      <Router location={history.location} navigator={history}>
         <PageHeader />
       </Router>,
     );
@@ -48,7 +48,7 @@ describe('<PageHeader />', () => {
     history.push('/detail/1');
 
     render(
-      <Router history={history}>
+      <Router location={history.location} navigator={history}>
         <PageHeader />
       </Router>,
     );
@@ -65,7 +65,7 @@ describe('<PageHeader />', () => {
     history.push('/not_found');
 
     render(
-      <Router history={history}>
+      <Router location={history.location} navigator={history}>
         <PageHeader />
       </Router>,
     );
@@ -81,15 +81,21 @@ describe('<PageHeader />', () => {
     const history = createMemoryHistory();
     history.push('/not_found');
 
-    render(
-      <Router history={history}>
+    const { rerender } = render(
+      <Router location={history.location} navigator={history}>
         <PageHeader />
       </Router>,
     );
 
     const goBack = screen.getByText('돌아가기');
     fireEvent.click(goBack);
 
+    rerender(
+      <Router location={history.location} navigator={history}>
+        <PageHeader />
+      </Router>,
+    );
+
     const label = screen.getByText('할 일 목록');
     expect(label).toBeInTheDocument();
     expect(goBack).not.toBeInTheDocument();