Forum Discussion

PingS's avatar
PingS
Occasional Contributor
7 years ago

How to open a dropdown control

I am writing Automation Test for a web appliocation. On a page, there are two controls: Date of Birth and Gender. The Date of Birth is like a Datetimepicker. When it is clicked, a calender shows up. ...
  • PingS's avatar
    PingS
    7 years ago

    I tried the recording the tests using keyword test but the Gender Dropdown does not open when the recording is on.

    After a few tries, I eventually found the solution. The DateTimePicker and the Generder Dropdown are wrapped inside a lot of control containers. The DateTimePicker control has two <Input> and they are inside multiple <div>, I must get the <input> with "class = 'dateTimePicker'" using XPath and then perform  click() operation on this control to open the DateTimePicker; the Gender DropDown has multiple <span> controls, I must get the <span> with "Role = 'combobox'". When perform a "Click ()" on this control, it opens the dropdown.

     

    The attached image has the two controls hightlighted in Red. I hope this may help someone who is puzzling on this type of issues.

     

PingS's avatar
PingS
Occasional Contributor

I tried the recording the tests using keyword test but the Gender Dropdown does not open when the recording is on.

After a few tries, I eventually found the solution. The DateTimePicker and the Generder Dropdown are wrapped inside a lot of control containers. The DateTimePicker control has two <Input> and they are inside multiple <div>, I must get the <input> with "class = 'dateTimePicker'" using XPath and then perform  click() operation on this control to open the DateTimePicker; the Gender DropDown has multiple <span> controls, I must get the <span> with "Role = 'combobox'". When perform a "Click ()" on this control, it opens the dropdown.

 

The attached image has the two controls hightlighted in Red. I hope this may help someone who is puzzling on this type of issues.

 

AlexKaras's avatar
AlexKaras
Champion Level 3
7 years ago

Hi,

 

Great to know that the problem is solved and thank you for the follow-up. It definitely may help others.

 

Just two minor notes:

a) As Robert already mentioned, search by XPath should be considered as the last resort approach in TestComplete world and be used only when it is not possible to reliably identify the control via native TestComplete means. Latest TestComplete 12.60 added support to search web elements by custom attributes (https://support.smartbear.com/testcomplete/docs/general-info/whats-new.html#web-testing-improvements) which might help in the cases like yours.

b) While there is nothing incorrect in calling native methods of web controls, there is a risk here that developers may not implement all required functionality in the custom controls and thus they may not always react as expected. For example, direct assignment of control's value may be not reflected in UI and cause validation errors. Internal methods, for sure, are faster, but UI actions more closely and correctly emulate the end-user behaviour.