zoukankan      html  css  js  c++  java
  • [React Testing] Test Drive Assertions with Dates in React

    Just make sure the date is in a range then it is fine

    import React from 'react'
    import {render, fireEvent, waitFor} from '@testing-library/react'
    import {Redirect as MockRedirect} from 'react-router'
    import {savePost as mockSavePost} from '../api'
    import {Editor} from '../post-editor-05-dates'
    
    jest.mock('react-router', () => {
      return {
        Redirect: jest.fn(() => null),
      }
    })
    
    jest.mock('../api')
    
    afterEach(() => {
      jest.clearAllMocks()
    })
    
    test('renders a form with title, content, tags, and a submit button', async () => {
      mockSavePost.mockResolvedValueOnce()
      const fakeUser = {id: 'user-1'}
      const {getByLabelText, getByText} = render(<Editor user={fakeUser} />)
      const fakePost = {
        title: 'Test Title',
        content: 'Test content',
        tags: ['tag1', 'tag2'],
      }
      const preDate = new Date().getTime()
    
      getByLabelText(/title/i).value = fakePost.title
      getByLabelText(/content/i).value = fakePost.content
      getByLabelText(/tags/i).value = fakePost.tags.join(', ')
      const submitButton = getByText(/submit/i)
    
      fireEvent.click(submitButton)
    
      expect(submitButton).toBeDisabled()
    
      expect(mockSavePost).toHaveBeenCalledWith({
        ...fakePost,
        date: expect.any(String),
        authorId: fakeUser.id,
      })
      expect(mockSavePost).toHaveBeenCalledTimes(1)
    
      const postDate = new Date().getTime()
      const date = new Date(mockSavePost.mock.calls[0][0].date).getTime()
      expect(date).toBeGreaterThanOrEqual(preDate)
      expect(date).toBeLessThanOrEqual(postDate)
    
      await waitFor(() => expect(MockRedirect).toHaveBeenCalledWith({to: '/'}, {}))
    })
  • 相关阅读:
    Idea中资源文件的设置和Java中类的权限
    Springboot中slf4j+log4j2的使用
    linux下修改文件查看样式(日期/文件大小)
    maven项目中引入外部jar
    01背包问题
    python爬取千千音乐
    【DataBase】SQL优化案例:其一
    【Uni-App】底部栏踩坑
    【Uni-App】UniApp转微信小程序发布应用
    【Uni-App】API笔记 P2
  • 原文地址:https://www.cnblogs.com/Answer1215/p/12819224.html
Copyright © 2011-2022 走看看