Angular 如何在 Protractor 中测试 toast 消息？

Question

在我正在测试的应用程序中，组件 class 中有几行显示 toastr 消息。我正在尝试编写一个量角器测试来测试这些消息是否显示但我遇到了困难。原因是我在 Html 中没有提到 toastr，所以我真的不知道如何让量角器找到它。这是我使用 toastr 的代码。如果用户注册或更新，我想测试是否显示成功消息。

     dialogRef.afterClosed().subscribe(result => {
        console.log(result);
        if (result.success === "success") {
            this.toastr.success(result.isToEdit == true ? "User is updated successfully " : "User is created successfully.");
            this.getUsers();
        }
    });

我正在摸不着头脑。任何帮助都会很棒。谢谢！

编辑：我相信我已经解决了这个问题。我执行了以下代码来访问消息：

return element(by.css('.toast-message'))

Answer 1

看来你需要等待烤面包机出现。添加browser.sleep(1000)等待它。这是最简单但并非真正正确的解决方案，但作为第一步，您可以尝试一下。更好的解决方案是使用 await browser.wait(ExpectedConditions.visibilityOf(element), 1000, element.locator()); 让量角器等待元素出现 最多 1000 毫秒 ，而不是阻塞整个睡眠测试

Answer 2

它确实存在于 HTML 中，但只有当它可见时才存在。

在配置中，可以在消息上指定一个class，通过设置messageClass

然后您可以使用 CSS class:

搜索它

https://www.npmjs.com/package/ng2-toastr#toastoptions-configurations

Angular 如何在 Protractor 中测试 toast 消息？

How to test toast messages in Protractor in Angular?

jasmine

toastr

protractor

angular