BackstopJS icon indicating copy to clipboard operation
BackstopJS copied to clipboard

Select Element in DOM with Xpath expression or bt class name

Open nsp27 opened this issue 7 years ago • 4 comments

Hi

I want to select different themes such as Gray Theme, Navy Theme etc.

I tried below scenario:- "scenarios": [ {

  "label": "accord blue",
  "url": "",
  "delay": 3000,
  "selectorExpansion": true,
  
  "clickselector":['button.btn.btn-primary'],
  
  "postInteractionWait": 200,
  
  "misMatchThreshold": 5,
  "onBeforeScript": "onBefore.js",
  "onReadyScript": "onReady.js"
}

]

I can see that it just load the page with the URL and take screenshot. It does not click on the button. Does it support Xpath expressions such as:- //button[@onclick='themeClickSkyBlue()']? Do you have any recommendation to work on this.

nsp27 avatar Dec 10 '18 19:12 nsp27

Here is the structure:-

nsp27 avatar Dec 10 '18 19:12 nsp27

Hi Garris,

just to update on this,

I am able to target the element with below expression correctly

"Selectors":[ '.row mt-4 mb-4 div:nth-of-type(2)', '.col-sm-12 button:nth-of-type(3)']

But when I am writing below expression in order to click:- "clickSelectors":[ '.row mt-4 mb-4 div:nth-of-type(2)', '.col-sm-12 button:nth-of-type(3)'],

then it does not work.

"label": "accordion sky blue", "url": "",

  "selectorExpansion": true,
  
  "clickSelectors":[
    '.row mt-4 mb-4 div:nth-of-type(2)',
    '.col-sm-12 button:nth-of-type(3)'],
  "delay": 3000,
  "postInteractionWait": 200,
  
  "misMatchThreshold": 5,
  "onBeforeScript": "onBefore.js",
  "onReadyScript": "onReady.js"

nsp27 avatar Dec 10 '18 21:12 nsp27

You could use the following as the clickSelector: "button[label='what ever the label name us']" or "button[type='submit']" if this is the only button is available in the DOM But your button has a class name, so why don't you use the class name by itself as follow within clickselector "#whatever the button class name is".

Also be aware that I have realized the the clickSelector function is not included in the puppet/clickAndHoverHelper.js. so you will have to create a if statement for the clickselectors in it like this https://github.com/garris/BackstopJS/pull/923/files/ea5682febf962c249b648be01fab76076882eadf

BijayaBasnet avatar Dec 18 '18 04:12 BijayaBasnet

Can we with clickselector use css selector or the xpath by inpecting the element?

fredrelv avatar Mar 19 '21 12:03 fredrelv