如何解决ts2339?将typescript与测试库/rect结合使用

Question

我收到一条错误消息"类型"HTMLElement"上不存在属性"toggled"。ts(2339("；

奇怪的是，我的测试用例都成功了。但是，在测试文件中，出现了关于ts.2339的错误消息。

我该怎么办才能解决这个问题？

component...
<Container data-testid={"list-element-toggle"} toggled={state[data.id - 1]}>.  * style.div``
<Content data-testid={"list-element-content"} toggled={state[data.id - 1]}>. * style.div``
...
testing file...
expect(getAllByTestId("list-element-toggle")[0].toggled).toEqual(true);
expect(getAllByTestId("list-element-content")[0].toggled).toEqual(true);

• 我认为切换有其他HTML DOM元素的原因已经发生了。所以，我遇到了这个麻烦

Answer 1

测试库/rect没有检查组件的道具。可能您应该在Container和Content内部有一个基于toggled道具的逻辑。

例如Content:内部

export function Content({ toggled }) {
return (
<div>
{toggled ? : <p>I am toggled</p> : null}
</div>
);
} 

然后在测试中：

import { render, screen } from '@testing-library/react';
render(<App />);
expect(screen.getByText("I am toggled")).toBeInTheDocument();

Answer 2

我自己解决了我的问题toggle有一个html-dom元素。但是，我想解雇的具体按钮是在其他地方。

我选择了测试按钮，它解决了