iT邦幫忙

2021 iThome 鐵人賽

DAY 28
0
Modern Web

我不會測試,所以寫Jest與React Testing Library系列 第 28

Day 28: 初始化要測試的component

來,今天我們來聊一下怎麼幫redux在測試時添加初始化的狀態資料,借用昨天的程式,並增加store的code.

// strore.js

import { createStore } from 'redux';
import reducer from './reducer';

const store = createStore(reducer);

export default store;

接下來借用一下昨天的部分.這部分我們就不要按照昨天的點選按鈕,這下我們就可以取得,初始化狀態下的元件

import { render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { Provider } from 'react-redux';
import store from './store';
import Avatar from '....';
import store from './store';
import reducer from './reducer';

test('should render initialState data in component', () => {
	const store = createStore(reducer, {name: 'example'});

  const { getByTestId, getByText } = render(
    <Provider store={store}>
      <Avatar />
    </Provider>
  );
  expect(getByTestId('name')).toHaveTextContent('example')
})

晚點想到再補一點東西


上一篇
Day 27:我們又回來了redux
下一篇
Day 29: 來講一下commit前的小撇步
系列文
我不會測試,所以寫Jest與React Testing Library30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
juck30808
iT邦研究生 1 級 ‧ 2021-10-14 12:08:13

恭喜即將邁入完賽啦~

我要留言

立即登入留言