Identification of objects generated through the framework, but not built through raw HTML

Question

I have a scenario where I cannot identify some of my objects on the page. They do not have a unique identifier (e.g. name, class, id). Our development team uses the JS framework, which generates models, views, controllers, etc. And dynamically assigns an identifier. There are also many representations of children that are dynamically generated with dynamic identifiers.

Therefore, I can not use id when changing it. I do not want to use xpath as this is not an industry standard. I tried the css selector, but it gives me a long way, not sure if this is correct.

I wanted to learn from all of you, is it correct to add additional attributes to an object in the development code for testing purposes? Or is there a better way to handle these scenarios?

Answer 1

If you use SproutCore, you can easily add a classNames( doc ) or layerId( doc link ) link to any view to make the CSS selectors shorter.

For instance:

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'
  })
})

Note. . You want to use the property layerIdif you are sure that there will be only one instance of the view on the screen, otherwise the property is the classNamesbest way to go.

, , CSS.