Identifying Elements Effectively - AngularJS Automation

Ask general questions here.
Posts: 1
Joined: Fri Feb 09, 2018 12:04 pm
Location: USA

Identifying Elements Effectively - AngularJS Automation

Post by amarbl » Fri Feb 09, 2018 12:22 pm

HI folks,

I have a relatively big web app is written in AngularJS. Our automation is using Ranorex to run BDD tests.

We are in a constant dilemma on how to enable the Ranorex tests to find UI elements effectively. Currently we're mainly using a custom attribute for it, testid (e.g. <div testid="done_btn">), but in some cases it performs very poorly, not sure whether it's because the querying XPaths aren't optimized or some other Ranorex configuration.

Using the id attribute is way faster but it just doesn't feel right to use it for automation. Besides, keeping it unique might require some coding in some cases (e.g. when using ng-repeat).

Is using id just for automation purposes OK or is it a bad practice? Why?

Any way to make Ranorex relate to custom attributes such as testid differently so that it'll be found faster? I've read about Ranorex Weight Rule but couldn't find a way to define custom attributes.

Thank you

User avatar
Ranorex Guru
Ranorex Guru
Posts: 6781
Joined: Mon Aug 13, 2012 9:54 am
Location: Zilina, Slovakia

Re: Identifying Elements Effectively - AngularJS Automation

Post by odklizec » Sat Feb 10, 2018 1:20 pm


I’m currently “fighting” with angular jqwidets and unfortunately, I found it (angular) pretty hard to automate. Id’s are often dynamic and meaningless, components are a big mess of nested divs and other elements (even something that simple like button or checkbox) and almost everything from simple checkbox state or selected item is handled via class attribute. So I reduced the weight of ID attribute and increased weight of Class attribute. Unforunately, even this step does not solve the problem with identification, because the class attribute is often lengthy and contains too many properties. Which means you can forget about simple recording. Almost every recorded xpath must be altered manually and you will find that logical “and” and “or” operators in the xpaths are a must. Plus you will have to insert many attributes into the xpath manually, to make the xpath faster to find. Not to mention many elements are loaded dynamically, so for example columns or rows in table, which are outside the visible area, are impossible to summon via EnsureVisible. So you will have to scroll them into view via scrollbars. All in all, angular is a mess and automation nightmare ;)

As for the xpath weight, you can learn how to use it here: ... namic-ids/
Pavel Kudrys
Ranorex explorer at Descartes Systems

Please add these details to your questions:
  • Ranorex Snapshot. Learn how to create one >here<
  • Ranorex xPath of problematic element(s)
  • Ranorex version
  • OS version
  • HW configuration

Posts: 1
Joined: Sat Mar 20, 2021 10:05 am

Re: Identifying Elements Effectively - AngularJS Automation

Post by snahta » Sat Mar 20, 2021 10:10 am


I'm not actually familiar with the dilemma you are facing. Can you please further explain the reasoning behind not wanting to use the id-s.

And if you face issues related to id's not being unique in some cases you can combine different elements to the path (eg."@id='save_btn' and @innerText='Save'").

Usually, if you can improve the speed and stability of your automation with no visual or functional expense - do it.

Regards - AngularJS training in pune