Find element where doesn't contains a specific class-CodePudding

I have two objects on the page with same html. Only one of the element's parent tag doesn't have same class name. When I try using not(contains()) it still shows both elements

below is the xpath I tried and still it is detecting both buttons and always clicking on the second button.

//div[contains(@class,"jss") and not(contains(@class,"canvas-image-export"))]//button[contains(.,'Connected')]

below is the code for first button named Connected where I am interested to get

<div >
   <div >
      <div  style="overflow: hidden;">
         <div  role="tablist">
            <button  tabindex="0" type="button" role="tab" aria-selected="true"><span >Overview</span><span ></span></button>
            <button  tabindex="-1" type="button" role="tab" aria-selected="false"><span >Data Sources</span><span ></span></button>
            <button  tabindex="-1" type="button" role="tab" aria-selected="false"><span >Connected</span><span ></span></button>
         </div>
      </div>
   </div>
</div>

below is the code for second button named Connected which I should not click on

<div >
   <span  data-testid="componentContainer">
      <div >
         <div  style="overflow: hidden;">
            <div  role="tablist">
               <button  tabindex="0" type="button" role="tab" aria-selected="true"><span >Overview</span><span ></span></button>
               <button  tabindex="-1" type="button" role="tab" aria-selected="false"><span >Data Sources</span><span ></span></button>
               <button  tabindex="-1" type="button" role="tab" aria-selected="false"><span >Connected</span><span ></span></button>
            </div>
         </div>
      </div>
   </span>
</div>

TIA

CodePudding user response：

Your problem here is that you are looking on the upper parent node <div > vs <div > while there is another element there <div > or <div > and it is also matching your XPath //div[contains(@class,"jss") and not(contains(@class,"canvas-image-export"))]//button[contains(.,'Connected')].
So, to make your XPath work you need to add one more detail: not contains MuiTabs-root class, as following:

//div[contains(@class,"jss") and not(contains(@class,"canvas-image-export")) and not(contains(@class,"MuiTabs-root"))]//button[contains(.,'Connected')]

CodePudding user response：

To get only first div buttons, you can exclude the span tag for the second element. Using following xpath you can get that.

//div[starts-with(@class,'jss')][not(span[@data-testid='componentContainer'])]//button[contains(.,'Connected')]

//div[starts-with(@class,'jss')][not(span)]//button[contains(.,'Connected')]