我正在構(gòu)建一個(gè) React 自動(dòng)完成組件并使用 Jest 和 React-testing-library 對(duì)其進(jìn)行測(cè)試。我有兩個(gè)輸入。當(dāng) input1（具有自動(dòng)完成功能）處于焦點(diǎn)時(shí)，Tab如果 input1 不為空，則單擊該按鈕應(yīng)該使用文本自動(dòng)填充 input1，或者如果 input1 為空，則將焦點(diǎn)移至 input2（這是表單的默認(rèn)行為）。表單.jsx const onKeyDown = (e) => { if(e.key === 'Tab' && e.target.value !== '') { setInput1Text('some-autocomplete-text'); e.preventDefault(); //prevent focus from moving to the next input(input2) } };表單.test.jsx test('pressing Tab button should move focus to input2 as input1 is empty', () => { const input1 = container.getElementsByTagName('input')[0]; const input2 = container.getElementsByTagName('input')[1]; fireEvent.change(input1, { target: { value: '' } }); fireEvent.keyDown(input1, { key: 'Tab' }); expect(input2).toBe(document.activeElement) //failing, activeElement returns <Body> // OR expect(input2).toHaveFocus(); //failing as well. });目前，在我的測(cè)試中，document.activeElement不斷返回Body元素，但我希望它返回兩個(gè)輸入中的任何一個(gè)。也expect(input2).toHaveFocus()失敗了。如何測(cè)試焦點(diǎn)是否已從 input1 移至 input2？
按下選項(xiàng)卡按鈕時(shí)如何測(cè)試哪個(gè)輸入具有焦點(diǎn)
Qyouu
2023-06-09 10:42:17
