识别通过框架生成而不是通过原始 HTML 构建的对象

Question

我有一种情况，我无法识别页面上的一些对象。它们没有唯一标识符（如名称、类、id）。我们的开发团队使用 JS 框架来生成模型、视图、控制器等并动态分配 id。还有很多子视图是通过动态 id 动态生成的。

所以我不能使用 id 的变化。我不想使用 xpath，因为它不是行业标准。我尝试了 css-selector 但它给了我很长的路不知道这是否是正确的方法。

我想从你们所有人那里知道，在开发代码中为对象添加额外的属性以用于测试目的是否正确？或者有没有更好的方法来处理这些场景？

Answer 1

如果您实际使用的是 SproutCore，您可以轻松地将 classNames (doc link) 或 layerId (doc link) 属性添加到任何视图，以缩短 CSS 选择器。

例如：

MyApp.MainListView = SC.ListView.extend({
  layerId: 'my_special_view',
  classNames: 'my-special-class',

  content: ["Hi", "Foo", "Bar"],

  exampleView: SC.ListItemView.extend({
    classNames: 'my-special-list-class'
  })
})

注意：如果您确定屏幕上只有 1 个视图实例，您将只想使用 layerId 属性，否则，classNames 属性是更好的方法。

我建议添加一些不是测试特定的类名，但允许您使用更短的 CSS 选择器。