问题标签 [testing-library]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
110 浏览

typescript - 如何使用 jest 和测试库来测试 typescript 应用程序?

我正在尝试测试打字稿应用程序(没有任何 js 框架)。但是对此一无所知。是否可以使用测试库进行测试?

有人给我分享指南或帮助我测试这个简单的 ts 文件吗?

这是我的 ts 文件和测试文件:

我尝试使用 testing-library:但对没有 js 框架的测试一无所知

从“@testing-library/dom”导入{屏幕,getByLabelText,getByText,getByTestId,queryByTestId,等待};

这是我的 package.json:

是否需要安装任何额外的资源?

0 投票
2 回答
70089 浏览

reactjs - 如何解决 testing-library-react 中的“更新未包含在 act() 中”警告?

我正在使用一个会产生副作用的简单组件。我的测试通过了,但我收到了警告Warning: An update to Hello inside a test was not wrapped in act(...).

我也不知道是否waitForElement是编写此测试的最佳方法。

我的组件

我的组件测试

0 投票
1 回答
3755 浏览

javascript - 使用 getByDisplayValueText 在反应测试库中找不到按钮

我有一个简单的组件,它有 3 个按钮。我想通过使用反应测试库找到按钮并模拟点击。问题是我无法通过下面的代码在我的测试中找到第一个按钮。考虑到我有一个按钮 value="All" 和另一个按钮"completed"作为文本。我可以找到第二个按钮(我无法更改第一个按钮的代码)

0 投票
1 回答
39 浏览

angular - 如何使用“测试库”测试私有方法/声明

有没有办法使用角度的“测试库”框架测试私有方法或声明?

这是我的代码:

私有name声明和setLang方法都不可用,规范文件。什么是正确的处理方式。看来,除非我为我的两个私有声明编写测试用例,否则我无法达到 100% 的覆盖率。

0 投票
1 回答
393 浏览

unit-testing - 测试使用插槽的苗条组件

我正在使用测试库作为苗条应用程序的一部分,总的来说它运行良好。但是,我有一个将数组作为道具的组件,使用输入对其进行过滤,然后将过滤后的数组传递给插槽。我想测试插槽是否接收到正确过滤的数组。我认为设置一个虚拟插槽将是可行的方法,然后只需使用 getByText 来确保页面中只有正确的元素。

组件代码:

0 投票
0 回答
387 浏览

javascript - 测试输入元素上的“焦点”在 vue-testing-library 中不起作用

我有一个 Vue 组件(模态),如果挂载了一个活动元素,它会从活动元素中移除焦点,如果有input元素,则聚焦它找到的第一个输入。代码正在运行,我对第一种情况进行了工作测试。

我评估输入元素是否聚焦的测试不起作用,但我找不到我的错误。

vue-component 的相关代码部分:

相关测试部分:

我知道/尝试过的事情:

  • 如果我没有输入元素并removeActiveFocusedElements()从我的 vue 组件中删除,则initialFocusedElement它是焦点,所以这是有效的,我对此进行了测试。

  • <input type="text" data-testid="first-input"/>在“DOM”中

  • focusFirstInput()被调用并找到输入元素

  • document.activeElement.outerHTML如果我在之后登录firstInput.focus(),它是带有 test-id 的输入元素,所以它是正确的。

  • 如果我登录document.activeElement.outerHTML测试,它是身体,所以我的期望当然失败了。

  • 我试过了queryByTestId,没有任何区别

老实说,我的想法已经不多了。

0 投票
1 回答
1165 浏览

javascript - 使用 svelte/store 测试 svelte 组件

在使用 jest 和 @testing-library/svelte 测试 svelte 组件时,状态在测试之间共享,每次测试后是否可以拆除,所以我有更多独立的单元测试。

商店/主题

因为没有 DI 存储在测试之间共享,所以我可以在 beforeEach 中将值重置为默认值,但尝试查看是否有更好的解决方案。

ThemeSwitcher.spec.js

0 投票
1 回答
194 浏览

reactjs - React - 测试单独的父组件(没有 redux)

我想测试父组件,但我想在没有 redux 的情况下做到这一点。我有问题,因为我有错误:

不变违规:在“Connect(MarkerList)”的上下文或道具中找不到“store”。要么将根组件包装在 a 中,要么将“store”作为道具显式传递给“Connect(MarkerList)”。

我的父组件:

我的子组件:

面板测试文件:

我尝试将商店设置为面板组件的道具或通过提供程序将其包装在我的测试文件中,但这对我没有帮助。

0 投票
1 回答
2411 浏览

testing-library - 选择带有测试库的下拉元素

显然我根本不了解测试库。它们具有“单击”功能,但似乎没有从选择元素中选择简单下拉选项的功能。这是失败的,说选择了 0,而不是预期的 1。如何使选择起作用?

0 投票
0 回答
34 浏览

reactjs - 我无法从 GoogleMap 组件中获取任何节点

我想测试我的地图组件。我在 Jest 中使用 react-testing-library。我不知道如何从中获取任何节点<GoogleMap></GoogleMap>(此组件太深)。我试过获取标记和删除按钮,但它不起作用。我在删除按钮附近添加了评论(更容易搜索)。有人可以给我任何提示吗?