我正在使用react测试库来创建我的测试。
import React, {useState} from 'react';
const Input = () => {
const [state, setState] = useState(0);
const onChange = (e) => {
setState(e.target.value)
};
return (
<div>
<h1>{state}</h1>
<input placeholder='type' type="number" value={state} onChange={onChange}/>
</div>
);
};
export default Input;
我的测试:
import Input from "./Input";
import { render, fireEvent } from '@testing-library/react'
describe('test if render', ()=> {
test('check render text', ()=> {
const { getByPlaceholderText, getByRole } = render(<Input />);
const input = getByPlaceholderText('type');
const h1 = getByRole('heading', {level: 1});
fireEvent.change(input, { target: { value: "123" } });
expect(h1).toHaveTextContent('123')
});
test('check not render text', ()=> {
const { getByPlaceholderText, getByRole } = render(<Input />);
const input = getByPlaceholderText('type');
const h1 = getByRole('heading', {level: 1});
fireEvent.change(input, { target: { value: "" } });
expect(h1).toHaveTextContent('')
})
});
现在测试通过了,但是为什么呢?我刚刚创建了一个输入类型:数字,而不是文本,所以我希望测试不会通过?如何检查带有类型号的输入?