当组件根据条件渲染时如何更新反应测试库屏幕值？答案

【问题标题】：How to update react testing library screen value when component is rendered based on condition?当组件根据条件渲染时如何更新反应测试库屏幕值？
【发布时间】：2022-01-07 14:45:18
【问题描述】：

由于建议在 react 测试库中使用 screen 而不是 getById，因此我将其所有实例更改为 screen 查询选择器。但是，有一个条件是我无法改变的。

const newComponent = render(
<AppContext.Provider value={newState}>
<App />
<AppContext.Provider>,
)

const id = queryByAttribute.bind(null,'id')
const result= getById(newComponent.container,'student-details')
expect(result.textContent).toBe('Suga')

我使用了测试游乐场，它建议使用 getByText，但如果我使用 screen.getByText(/Suga/i)，它会失败，因为它考虑的是最初呈现的屏幕，而不是我提供不同状态的新组件。我怎样才能实现这种转换？

注意：在 App.js 文件中，student-detail 是一个带有 id 和 className 的 div。

【问题讨论】：

标签： reactjs jestjs react-testing-library

【解决方案1】：

const newComponent = render(
   <AppContext.Provider value={newState}>
      <App />
   <AppContext.Provider>,
)

expect(newComponent.getByText(/suga/i)).toBeInTheDocument

【讨论】：