我想在一个React Jest测试中，基于代码控制来切换Shadcn/ui的 Tabs组件的选项卡，但选项卡的内容并未按预期更新。

在我的测试中，我模拟点击一个标签触发器：

fireEvent.click(screen.getByText("Next Tab"));

但当我断言相应的 <TabsContent /> 已渲染时，测试失败，提示无法找到内容。

在测试中，如何切换Shadcn的标签页，才能正确渲染相应的标签内容？

解决方案

Shadcn Tabs在底层使用Radix UI Tabs，它使用 onMouseDown 事件。因此，要正确触发标签切换，只需像下面这样使用 fireEvent.onMouseDown()：

fireEvent.mouseDown(screen.getByRole("tab", { name: "Next Tab" }));