diff --git a/client/src/test/component.test.js b/client/src/test/component.test.js
index 27d84a4..3180e4d 100644
--- a/client/src/test/component.test.js
+++ b/client/src/test/component.test.js
@@ -10,9 +10,14 @@ import {createBrowserHistory} from 'history';
 const history = createBrowserHistory();
 
 import MyNav from '../components/component.mynav';
+import Header from '../components/component.header';
+import BookItem from '../components/component.book.item';
+import Confirm from '../components/component.confirm';
+import Message from '../components/component.message';
+import PageNavigation from '../components/component.page.navigation';
 
-it('shows success message after confirm button is clicked', () => {
-  const {getByText} = render(
+it('component.mynav', () => {
+  render(
     <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
       <Router history={history}>
         <MyNav history={history} />
@@ -23,8 +28,83 @@ it('shows success message after confirm button is clicked', () => {
   expect(screen.getByText(/Release/i)).toBeInTheDocument();
   expect(screen.getByText(/Request List/i)).toBeInTheDocument();
   expect(screen.getByText(/Borrow List/i)).toBeInTheDocument();
+});
+it('component.header', () => {
+  render(
+    <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+      <Router history={history}>
+        <Header history={history} />
+      </Router>
+    </Provider>,
+  );
+  expect(screen.getByText(/all/i)).toBeInTheDocument();
+});
+
+it('component.book.item', () => {
+  const book = {price: 111, book_name: 'book_name', image: '', is_borrow: false};
+  render(
+    <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+      <Router history={history}>
+        <BookItem history={history} book={book} />
+      </Router>
+    </Provider>,
+  );
+  expect(screen.getByText(/book_name/i)).toBeInTheDocument();
+});
+
+it('component.confirm', () => {
+  render(
+    <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+      <Router history={history}>
+        <Confirm history={history} />
+      </Router>
+    </Provider>,
+  );
+  expect(screen.getByText(/message/i)).toBeInTheDocument();
+});
 
-  // fireEvent.click(getByText('Confirm'));
+it('component.message', () => {
+  const item = {
+    id: '5fe20a7ed2453c5f68eb2c84',
+    book_id: '5fe205f944a0a822d8c869f2',
+    book_user_id: '5fe205c344a0a822d8c869f1',
+    book_username: '123',
+    book_address: '123',
+    book_name: '1',
+    book_price: 1,
+    request_user_id: '5fda37fa496ade443c6c50f3',
+    request_username: 'ee',
+    request_address: 'aaaa',
+    message: [
+      {request_msg: 'aaaa', create_time: '2020-12-22T15:02:22.797Z', reply_msg: ''},
+      {request_msg: '', reply_msg: '123', create_time: '2020-12-22T15:02:45.73Z'},
+      {request_msg: '', reply_msg: '6548979651', create_time: '2020-12-22T15:02:54.88Z'},
+      {request_msg: '', reply_msg: '//////////', create_time: '2020-12-22T15:02:58.981Z'},
+      {request_msg: 'aaee', create_time: '2020-12-22T15:03:08.849Z', reply_msg: ''},
+      {request_msg: '', reply_msg: '', create_time: '2020-12-22T15:03:11.868Z'},
+    ],
+    state: 2,
+    create_time: '2020-12-22T15:02:22.803Z',
+    update_time: '2020-12-22T15:03:11.868Z',
+  };
+  
+  render(
+    <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+      <Router history={history}>
+        <Message history={history} item={item} />
+      </Router>
+    </Provider>,
+  );
+  
+});
 
-  // expect(getByText('Confirmed!')).toBeInTheDocument();
+it('component.page.navigation', () => {
+  render(
+    <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+      <Router history={history}>
+        <PageNavigation history={history} />
+      </Router>
+    </Provider>,
+  );
+  expect(screen.getByText(/<</i)).toBeInTheDocument();
 });
diff --git a/client/src/test/page.test.js b/client/src/test/page.test.js
new file mode 100644
index 0000000..a6322ab
--- /dev/null
+++ b/client/src/test/page.test.js
@@ -0,0 +1,113 @@
+import React from 'react';
+import {render, fireEvent, screen} from '@testing-library/react';
+import {createStore, applyMiddleware, compose} from 'redux';
+import reducers from '../reducers';
+const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
+import {Provider} from 'react-redux';
+import reduxThunk from 'redux-thunk';
+import {Router, Route, Switch} from 'react-router-dom';
+import {createBrowserHistory} from 'history';
+const history = createBrowserHistory();
+
+import BookDetail from '../pages/page.book.detail';
+import BorrowList from '../pages/page.borrow.list';
+import Category from '../pages/page.category';
+import Default from '../pages/page.default';
+import Login from '../pages/page.login';
+import My from '../pages/page.my';
+import Release from '../pages/page.release';
+import RequestList from '../pages/page.request.list';
+import Signup from '../pages/page.signup';
+
+describe('/api/borrow', () => {
+  it('page.signup', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <Signup history={history} location={{search: 'aaa=234'}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.release', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <RequestList history={history} location={{search: 'aaa=234'}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.release', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <Release history={history} location={{search: 'aaa=234'}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.my', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <My history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.default', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <Login history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.default', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <Default history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.category', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <Category history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.borrow.list', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <BorrowList history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+  });
+
+  it('page.book.detail', () => {
+    render(
+      <Provider store={createStore(reducers, composeEnhancers(applyMiddleware(reduxThunk)))}>
+        <Router history={history}>
+          <BookDetail history={history} match={{params: {id: 111}}} />
+        </Router>
+      </Provider>,
+    );
+    expect(screen.getByText(/name/i)).toBeInTheDocument();
+  });
+});