178664ed83
- Switched to pnpm - Updated to typescript 4.9.5 - JSX transforms switched to react-jsx - Use swc for typescript transforms - Remove deprecated dependencies - Cleanup unused types - Some ESM fixes - PostCSS config now lives in package.json - Bump support target TODO: - switch to vite or plain esbuild - jest to vitest / uvu - jquery to cash-dom - pure ESM (lodash-es, etc.) - drop prettier & husky (lint-staged is okay) - drop wasm cli & xterm.js - update bootstrap
75 lines
2.6 KiB
TypeScript
75 lines
2.6 KiB
TypeScript
import { useState } from 'react'
|
|
import { render, fireEvent } from '@testing-library/react'
|
|
import { on } from '@/scripts/event'
|
|
import EmailSuggestion from '@/components/EmailSuggestion'
|
|
|
|
const Wrapper: React.FC = () => {
|
|
const [email, setEmail] = useState('')
|
|
|
|
return <EmailSuggestion value={email} onChange={setEmail} />
|
|
}
|
|
|
|
test('basic typing', () => {
|
|
const { getByDisplayValue, queryByText } = render(<Wrapper />)
|
|
const input = getByDisplayValue('')
|
|
|
|
fireEvent.input(input, { target: { value: 'abc' } })
|
|
fireEvent.focus(input)
|
|
expect(queryByText('abc@qq.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@163.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@gmail.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@hotmail.com')).toBeInTheDocument()
|
|
|
|
fireEvent.input(input, { target: { value: '' } })
|
|
expect(queryByText('abc@qq.com')).not.toBeInTheDocument()
|
|
})
|
|
|
|
test('apply suggestion', () => {
|
|
const { getByDisplayValue, getByText } = render(<Wrapper />)
|
|
const input = getByDisplayValue('')
|
|
|
|
fireEvent.input(input, { target: { value: 'abc' } })
|
|
fireEvent.focus(input)
|
|
fireEvent.click(getByText('abc@hotmail.com'))
|
|
expect(input).toHaveValue('abc@hotmail.com')
|
|
})
|
|
|
|
test('do not suggest when `at` is existed', () => {
|
|
const { getByDisplayValue, queryByText } = render(<Wrapper />)
|
|
const input = getByDisplayValue('')
|
|
|
|
fireEvent.input(input, { target: { value: 'abc@outlook.com' } })
|
|
fireEvent.focus(input)
|
|
expect(queryByText('abc@outlook.com@qq.com')).not.toBeInTheDocument()
|
|
expect(queryByText('abc@outlook.com@163.com')).not.toBeInTheDocument()
|
|
expect(queryByText('abc@outlook.com@gmail.com')).not.toBeInTheDocument()
|
|
expect(queryByText('abc@outlook.com@hotmail.com')).not.toBeInTheDocument()
|
|
})
|
|
|
|
test('display suggestions when typing with configured domain names', () => {
|
|
const { getByDisplayValue, queryByText } = render(<Wrapper />)
|
|
const input = getByDisplayValue('')
|
|
|
|
fireEvent.input(input, { target: { value: 'abc@hotmail.com' } })
|
|
fireEvent.focus(input)
|
|
expect(queryByText('abc@qq.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@163.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@gmail.com')).toBeInTheDocument()
|
|
expect(queryByText('abc@hotmail.com')).toBeInTheDocument()
|
|
})
|
|
|
|
test('events', () => {
|
|
const off = on('emailDomainsSuggestion', (names: Set<string>) => {
|
|
names.add('outlook.com')
|
|
})
|
|
|
|
const { getByDisplayValue, queryByText } = render(<Wrapper />)
|
|
const input = getByDisplayValue('')
|
|
|
|
fireEvent.input(input, { target: { value: 'abc' } })
|
|
fireEvent.focus(input)
|
|
expect(queryByText('abc@outlook.com')).toBeInTheDocument()
|
|
|
|
off()
|
|
})
|