使用PageObjects测试嵌套在里面的复杂角度组件的组件

问题描述 投票:1回答:1

我们的应用程序具有消耗具有不同复杂性消耗组件的组件的组件所以我只想在页面上输入,以验证何时设置对象文本是否正确。问题是它是这些子组件之一。

我的同事告诉我,有两种方法可以做到这一点,第一种方法是使用页面对象和链接注释在我的页面上找到它,然后找到下一个id等,直到找到我的输入。它需要我查看另一个团队的组件标记,以将其缩小到我想要利用的输入。我不相信我应该进入另一个组件定义或定义的定义,以获得适当的链来获得这个任意输入。它开始产生问题,如果横向团队创造了我不知道的变化,我的PO将被打破。

我朋友问的另一个选择是使用fixture.query来查找组件。这很简单:

fixture.query((el)=> el.attribute["id"] == "description", 
              (comp){ 
                expect(comp.value, value); 
              });`

使用Query查看标记,但随后将自动将其组件化为适当的SubComponent。在这种情况下,comp.value是存储在HTML中的值。所以,如果我做了类似的事情:

fixture.update((MainComponent comp) { 
  comp.myinput.value = new Foo(); 
});

然后我设置并以编程方式获取,所以我有点不确定它是否正确反映屏幕上的内容。

什么是最好的行动方案?似乎PO会更好,但我不确定是否有办法深入查询我正在测试的组件之外的输入框。

谢谢

unit-testing dart angular-dart pageobjects
1个回答
3
投票

我不认为我有一个确定的答案,但我可以告诉你我们是如何在谷歌这样做的。对于几乎任何组件,我们在组件旁边提供页面对象。这是测试该窗口小部件的两倍,因此我们可以将其作为其他测试的可共享资源。

对于叶子小部件,页面对象不那么充实,实际上只是用于本地测试。对于大量共享的组件,页面对象的可重用性会更加清晰。如果没有这么多的小部件API(html,css等),我们需要考虑公开,对它们的更改将非常困难(负责公开突破变更的人需要修复所有相关代码。)有了它我们可以拥有一个仅支持页面对象API的合同,并且html结构更改不被视为重大更改。有时甚至我们甚至为小部件都有两个页面对象。一个用于本地测试,一个用于分享。有时,您希望为本地测试公开的API远远超出您希望人们自己使用的API。

然后,我们可以将这些页面对象组合成代表窗口小部件的更高级别的页面对象。良好的页面对象支持该小部件的更高级别的抽象。例如,日历小部件可以让您转到下一个/上个月,获取当前选定的日期等,而不是直接公开完成这些操作的按钮/输入。

我们计划最终公开angular_components的这些页面对象,但我们目前正在研究如何公开这些对象。我们的内部包装结构与我们的外部包装结构不同。我们每个小部件都有许多软件包(page_objects,examples,widget本身),我们需要在公开它们之前在外部进行协调。

这是一个例子:

import 'package:pageloader/objects.dart';
import 'material_button_po.dart';

/// Webdriver page object for `material-yes-no-buttons` component.
@EnsureTag('material-yes-no-buttons')
class MaterialYesNoButtonsPO {
  @ByClass('btn-yes')
  @optional
  MaterialButtonPO yesButton;

  @ByClass('btn-no')
  @optional
  MaterialButtonPO noButton;
}
© www.soinside.com 2019 - 2024. All rights reserved.