ts2339怎么解決？ 使用帶有測試庫/反應的打字稿

Question

我收到一條錯誤消息“屬性 'toggled' 在類型 'HTMLElement'.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

測試庫/反應不檢查組件的道具。 可能你應該在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

我解決了我的問題，“切換”有一個 html dom 元素。 但是，我想為特定按鈕觸發在其他地方。

我選擇了按鈕進行測試，它解決了它