How to select elements with class names

WebPageTest General Discussion
1

Hi,

After login into my application i need to click on one linke “Select All”. The code for this select all is as below

Select All

I have tried in different ways to select the linke “Select All” using webpage but unable to click on the link.

Tried like
clickAndWait innerText’Select All
clickAndWait innerText=“Select All”
clickAndWait innerText=Select All
clickAndWait document.querySelector(‘a[href*=“Select All”]’).click()
clickAndWait document.querySelector(‘.ds-app-pointer-plain option-vertically-center option-text ng-binding’).click()
etc.

Can you help us the webpage script line for the same…

Thanks,
Vijay

2

The input to clickAndWait is attribute=value. In your HTML code, there are only two attributes: class and data-ng-click. If there are no other elements with that combination of class names, you could target the Select All element with this pair:

clickAndWait class=“ds-app-pointer-plain option-vertically-center option-text ng-binding”

Although I’m not sure if this will work because of the quotes. Omitting them might not work either because of the spaces.

So you can try the second attribute, data-ng-click:

clickAndWait data-ng-click=selectAll()

But again, this might not work because of the parentheses. You’ll have to try it to be sure.

If all else fails, you could use querySelector like you attempted. However, clickAndWait only takes an attribute=value pair. So you’ll need a different command. execAndWait will take an arbitrary JS statement and execute it. Here’s something that might be more robust:

execAndWait document.querySelector(‘a[data-ng-click=“selectAll()”]’).click()

All of this would be made so much easier if the element you want to click on had a concise ID. For example if it looked like <a id=“select-all” …>Select All you could simply write:

clickAndWait id=select-all

3

Hi Viscomi,

Thank you very much for the quick reply. I have tried the things that you have mentioned below but no luck. Below are the tried i did…

In my scenario i need to select “Select All” link and click on the done button.
The script for the same is

execAndWait document.querySelector(‘a[data-ng-click=“selectAll()”]’).click()
execAndWait class=“ds-app-pointer-plain option-vertically-center option-text ng-binding”
execAndWait document.querySelector(‘a[class=“ds-app-pointer-plain option-vertically-center option-text ng-binding”]’).click()
execAndWait document.querySelector(‘a[data-ng-click=selectAll()]’).click()

for button id i have the script
clickAndWait id=team-memeber-selection-done

The error i am seeing after the script execute is “Repeat View: Test Data Missing”

How to get out of this error and what is the correct WPT script to click on the Select All
Select All

And also i observed some popup in the video but the same is not observed when we executed it manually in the chrome browser. How to handle this type of pop-up issues? Is there any way to clear the browser cache of the the location we are running? Enclosed the scree shot showing the pop up after page loading. The script is as below

  1. navigate https://www-qa.adpedge.com/#/prospect - Success
  2. setValue name’proxyUsername PMChevUser - Success
  3. setValue name’proxyPassword Cdk-0109 - Success
  4. clickAndWait name’loginSubmit - Success
  5. execAndWait document.querySelector(‘a[href*=“prospect”]’).click() - Success
  6. execAndWait document.querySelector(‘a[data-ng-click=“selectAll()”]’).click() - Failed
  7. clickAndWait id=team-memeber-selection-done - Not executed.

For 6th script line our code is “Select All”

Could you please look into this and update me where i am going in the wrong way…

Thanks,
Vijay

4

The browser profile is completely cleared for each run (cache, cookies, everything).

As far as repeat view goes, if you need an action to run only during first view you can put it inside an if block (scripting page should have an example).