0

我从 react-toastify 库构建了一个 Toast 和 toastemitter。我需要验证当我单击按钮时是否生成了 toast。我将 bodyClassname 默认为“my-toast”,所以当我模拟单击按钮时,我应该期望在 DOM 中看到它,不是吗?

const props = {
  containerId: 'toast-id',
  limit: 3,
}

describe('Toast Component', () => {
  it('renders component with props', () => {
    const component = mount(
      <>
        <Toast {...props} />
        <button
          id="emit-toast"
          type="button"
          onClick={() => emitToast('Test', 'success')}
        >
          Open
        </button>
      </>,
    )
    
    expect(component.find('.my-toast')).toHaveLength(0)

    const toastEmitter = component.find('#emit-toast')
    toastEmitter.simulate('click')
    expect(component.find('.my-toast')).toHaveLength(1)
  })
})
4

0 回答 0