Can someone give a better xpath of this div element, or help explain why I cannot seem to select the desired div?
This XPath does not work:
//div[starts-with(normalize-space(.),'Welcome to the Shipt Shopper') and #class='text']
Even though it gets highlighted in chrome developer tool, NoSuchElementException is thrown.
This is the case with all elements on the page
A snippet of the HTML from the page with the content that I am trying to target:
<div class="content-wrapper">
<div class="content" style="padding-top: 116px;">
<div class="media">
<div class="attachment" data-attachment="{"image":"https:\/\/images.typeform.com\/images\/29rsVwT3VF\/image\/default#.png","width":360,"height":137,"video_source":"","video_id":""}" style="width: 360px; height: 137px;">
<img src="https://images.typeform.com/images/29rsVwT3VF/image/default#.png" data-original="https://images.typeform.com/images/29rsVwT3VF/image/default#.png" style="width: 360px; height: 137px; display: inline;">
</div>
</div>
<div class="text" style="padding-top: 30px; margin-left: 0px;">
Welcome to the Shipt Shopper application! <br><br>Ready to get started?
</div>
<div class="button-wrapper" style="margin-top: 30px;">
<div class="button general full enabled hover-effect" style="">Begin</div>
<div class="button-text">press <strong>ENTER</strong></div>
</div>
</div>
</div>
The content that you are targeting is inside of an <iframe>.
I'm not familiar with how to configure Selenium, but it looks as if you may need to switch to that frame. Since it does not have an #id you may need to select by position:
driver.switchTo().frame(0)
and then execute the XPath.
When you are done, jump back to the containing HTML page:
driver.switchTo().defaultContent();
As per the HTML you have shared the xpath which you have used is a valid one and is correct. But NoSuchElementException will be thrown when you will try to interact with it through Selenium.
To interact with the element through Selenium you can use the following xpath :
//div[#class='content-wrapper']/div[#class='content']//div[#class='text' and contains(normalize-space(), 'Welcome to the Shipt Shopper application')]
But looking at the HTML it seems your have to induce WebDriverWait for the element to be visible as follows :
WebElement welcomeShiptShopper = new WebDriverWait(driver, 10).until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//div[#class='content-wrapper']/div[#class='content']//div[#class='text' and contains(normalize-space(), 'Welcome to the Shipt Shopper application')]")));
The webpage doesn't opens at my end. As other's have indicated, the WebElement might be within <iframe> tag, in that case you have to switch to the appropiate iframe first using either of the following methods first :
Switch through Frame Name
driver.switchTo().frame("frame_name");
Switch through Frame ID
driver.switchTo().frame("frame_id");
Switch through Frame Index
driver.switchTo().frame(1);
Once you switch to the appropiate frame, now you can lookout for the WebElement with the suggested xpaths mentioned above.
Related
<div id="j_idt249" class="ui-confirm-dialog ui-dialog ui-widget ui-widget-content ui-corner-all ui-shadow ui-hidden-container ui-dialog-rtl" role="dialog" aria-labelledby="j_idt249_title" aria-hidden="false" aria-live="polite" style="width: auto; height: auto; left: 385px; top: 265px; z-index: 1022; display: block;">
<button id="j_idt250" name="j_idt250" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left ui-confirmdialog-yes" type="button"><span class="ui-button-icon-left ui-icon ui-c ui-icon-check"></span><span class="ui-button-text ui-c">Save</span>
Button is inside of div.
How can i click the button
bot.FindElementByName("j_idt250").Click
its not work.
its something like dialog alert.i atached that pic.Pic of site
The name attribute looks dynamic and will not be a reliable web element locator.
Instead it looks like a save button.
//button[text()='Save']
Code :
bot.FindElementByXpath("//button[contains(text(),'Save')]").Click
Did you try switching to Alert like this
driver.SwitchToAlert.Accept
If the 'id' is available in an element, always use that. If not, go for the other locating strategies. In your case, the Id is present. So, use it when locating.
bot.FindElementByName("j_idt250").Click
If this won't work, then check the DOM and check whether your element is within an iFrame or not. If there is an iFrame, you need to switch to that iFrame first and then click on the button.
[below is the image of page element,i want to drag and drop inside svg element tried action class and robot class as well but not able to do.
resizeblockTwo']">
<div class="chartCanvas js-resizeblockOne drpm-resize__block-one">
<div class="titleBar layout-align-space-between-center layout-row">
<graph-canvas class="ng-scope">
<section class="chartContainer">
<div class="chartArea joint-theme-default paper" droppable="">
<svg id="v-2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="100%" height="100%">
</div>
</section>
<div ng-transclude="">
</graph-canvas>
<div class="processflow-empty-message ng-scope" ng-if="emptyGraph" style="">
<div class="drpm-resize__grabber">
</div>
You should stick to cssSelector as selenium has the problem to handle svn tag with other locators. I have experienced the same.
Now pass the same element in selenium drag and drop by action class. You havn't specify the element we can't extract CssSelector for you, you can use chrome-> Inspect-> copy -> copy selector
In java it will be something like below :-
Actions act=new Actions(driver);
// find element which we need to drag
WebElement drag=driver.findElement(By.cssSelector("YOUR CSS Selector"))
// find element which we need to drop
WebElement drop=driver.findElement(By.cssSelector("YOUR CSS Selector"));
// this will drag element to destination
act.dragAndDrop(drag, drop).build().perform();
Hope it will help you :)
I am using selenium FirefoxDriver to automate a test case (I am new at this)
I need a way to locate a Button (which I think is implemented as a div/span)
This xpath locator works when I try that in Selenium IDE //span[contains(text(), 'Login')]
Also I can use this CSS locator using the span tag and the classname css=span.x-btn-button
What I need is a way to use CSS locator with tag + class name + inner html text. (This will help me in handelling some of the other UI element in my application)
HTML is as below
<div id="toolbar-1035" class="x-toolbar x-docked x-toolbar-footer x-docked-bottom x-toolbar-docked-bottom x-toolbar-footer-docked-bottom x-box-layout-ct" style="right: auto; left: 0px; top: 141px; width: 223px;">
<div role="presentation" class="x-box-inner " id="toolbar-1035-innerCt" style="width: 217px; height: 22px;">
<div role="presentation" class="x-box-target" id="toolbar-1035-targetEl" style="width: 217px;">
<a id="button-1036" unselectable="on" hidefocus="on" class="x-btn x-unselectable x-box-item x-toolbar-item x-btn-default-small x-noicon x-btn-noicon x-btn-default-small-noicon" style="right: auto; top: 0px; margin: 0px; left: 0px; width: 75px;" tabindex="0">
<span unselectable="on" class="x-btn-wrap" role="presentation" id="button-1036-btnWrap">
<span role="presentation" class="x-btn-button" id="button-1036-btnEl" style="background-color: transparent;">
<span unselectable="on" class="x-btn-inner x-btn-inner-center" id="button-1036-btnInnerEl" style="background-color: transparent;">Login</span>
<span style="" unselectable="on" class="x-btn-icon-el " id="button-1036-btnIconEl" role="presentation"></span>
</span>
</span>
</a>
</div>
</div>
</div>
This post has some real good methods to use xpath/css for element identification!
Is it possible to get next sibling using cssContainingText in Protractor
Function cssContainingText is however specific to Protractor.
#Css
findElement(By.cssSelector("span.x-btn-button:contains('Login'));
Keep in mind that this pseudo-class in CSS is not supported by every browser, specifically this is not supported in PhantomJS (There may be other browsers this does not work in, but that is the one I remember).
From Here, about 75% of the way down the page.
Edit:
After looking at this a little more, it seems the pseudo-selector of ":contains('')" is no longer within the CSS3 spec. Reference
If your web application uses JQuery, you can retrieve the element that way with a similar selector, otherwise, you will have to load JQuery into the page and then use it, but that really wouldn't be using CSS, but rather javascript selector functions within JQuery that use CSS syntax.
Conclusion:
Currently, what you are asking is (officially) not supported by CSS.
I am having below mentioned code in which i want to click on a <input> type.
<div class="gwt-TabBarItem" tabindex="0" role="tab">
<div class="gwt-TabBarItem" tabindex="0" role="tab">
<input type="text" tabindex="-1" style="opacity: 0; height: 1px; width: 1px; z-index: -1; overflow: hidden; position: absolute;">
<div class="gwt-Label" style="white-space: nowrap;">Explore by Research Topic </div>
</div>
I want to click on <input type="text" ....>
I have tried all possible things like Click, WebElement Click, Java Script Click,sendkeys etc.
But it is not working for me.
Do anyone have any solution for this.
Thanks in Advance
If you're using the Selenium IDE, then use click command, with target as "css=input[type=text]". Should work. Selenium allows use of CSS selectors for locating elements. Examples of possible CSS selectors you can use are given here:
http://www.w3schools.com/cssref/css_selectors.asp
Hope this helps.
Try with the following Xpath:
//div[contains(text(), 'Explore by Research Topic')]//preceding-sibling::input
It worked for me.
Regarding code you provided the input field is hidden so you can't click it.
If this is not a temporary state and you still need to interact with it, try to change element opacity to displayed first - via JavaScript / jQuery.
I am trying to locate UI lement using selenium , but Xpath is dynamically changing evrytime
Here is the source
<div id="tab-1080" class="x-tab x-box-item x-tab-default x-top x-tab-top x-tab-default- top x-noicon x-tab-noicon x-tab-default-noicon x-active x-tab-active x-tab-default-active x-top-active x-tab-top-active x-tab-default-top-active" style="margin: 0px; left: 406px; top: 0px;">
<em id="tab-1080-btnWrap" class="">
<button id="tab-1080-btnEl" class="x-tab-center" autocomplete="off" role="button" hidefocus="true" type="button">
<span id="tab-1080-btnInnerEl" class="x-tab-inner" style="">Report Center</span>
<span id="tab-1080-btnIconEl" class="x-tab-icon x-hide-display"> </span>
</button>
</em>
</div>
I need to locate this uniquely but the id 1080 keeps changing evreytime ? Can anyone help how to locate with span id "Report Center" as that's the only attribute to differentiate this button in my webpage.
You can use
//span[text()='Report Center']
Personally I would use css: they're faster than xpath and generally accepted as superior by the community, I also think they're easier to use as well provided you do some research.
http://sauceio.com/index.php/2010/01/selenium-totw-css-selectors-in-selenium-demystified/
span.x-tab-inner ==> finds the element by its class
span[id*=btnInnerEl]` ==> finds element by a partial piece (substring) of the id
There are multiple ways; I can suggest these ones (come into my mind at the time):
"//span[contains(text(), 'Report Center')]"
"//span[contains(#id, 'btnInnerEl')]"
"//span[contains(text(), 'Report Center') and contains(#id, 'btnInnerEl')]"