React测试lib userEvent.click没有将目标文本传递给handleClick函数

Question

我有一个使用userEvent.click的单元测试。它找到要点击的文本，并调用handleClick函数，但没有传入Event.currentTarget.innerText。是userEvent.click(screen.queryByText(/adatest/));行触发了处理程序。有什么想法吗？

以下是测试：

test("renders modal when clicking search item", () => {
renderHeader(newState);
const input = screen.getByPlaceholderText(/Search coin…/);
userEvent.click(input);
userEvent.type(input, "a");
userEvent.click(screen.queryByText(/adatest/));
expect(screen.queryByText(/coin: adatest/i)).toBeInTheDocument();
});

点击处理程序如下：

function handleClick(Event) {
const coinCurrencyPair = Event.currentTarget.innerText + "usd";
const markets = Object.values(usdPairsSelector);
markets.forEach((item) => {
if (item.pair === coinCurrencyPair && item.active === true) {
dispatch(increment());
const coinObj = { exchange: item.exchange, coinPair: coinCurrencyPair };
dispatch(fetchCoin(coinObj));
}
});
setCoinText(Event.currentTarget.innerText);
const chartInputObj = unixStartAndEndTimes23And24(
Event.currentTarget.innerText,
new Date()
);
const startDate = convertDateToUnix(new Date());
console.log("date: ", new Date());
console.log("unix: ", startDate);
// dispatch(fetchModifiableChartData(chartInputObj));
setOpen(false);
setAnchorEl(null);
setCoinSymbol("");
setOpenModal(true);
}

我的coinCurrencyPair常量应该包含adatestusd，但它是undefinedusd

Answer 1

可能不是您想要的答案，但另一种方法可能是模拟事件并使用fireEvent.click而不是userEvent.click

例如：

const event = { currentTarget: { innerText: "adatest" } }
fireEvent.click(screen.queryByText(/adatest/), event)