In order page when I make a payment, I get the created payment listed in payments list page. The created payment will always list on the first row of the table. I want to know how to get a text “This is Project:
“ and also be able to click on it. Every payment has its own id in a row i.e. Here is the snipped of the table:
<div id="PAYMENT-CONTAINER" style="clear:both">
<div class="list-widget" id="PAYMENT-LIST">
<ul style="visibility: visible;" class="table">
<li id="393118">
<div class="no-expand col0" style="text-align: center; width: 31px;"><input type="checkbox" class="rowSelect" value="393118"></div>
<div class="no-expand col1" style="text-align: center; width: 57px;">
<span class="tag untagged">•••</span>
</div>
<div class="col2" style="text-align: center; width: 155px;">
07/28/2015
</div>
<div class="col3" style="width: 401px;">
5280 FAST PITCH
</div>
<div class="col4" style="width: 344px;">
This is Project:
</div>
<div class="col5" style="text-align: right; width: 213px;">
$25.00
</div>
<div class="col6" style="width: 188px;">
Stacey Smith
</div>
<div class="col7" style="width: 178px;">
In Process
</div>
</li>
<li id="393119">
<div class="no-expand col0" style="text-align: center; width: 31px;"><input type="checkbox" class="rowSelect" value="393119"></div>
<div class="no-expand col1" style="text-align: center; width: 57px;">
<span class="tag untagged">•••</span>
</div>
<div class="col2" style="text-align: center; width: 155px;">
07/28/2015
</div>
<div class="col3" style="width: 401px;">
5280 FAST PITCH
</div>
<div class="col4" style="width: 344px;">
Donations are for good cause
</div>
<div class="col5" style="text-align: right; width: 213px;">
$26.00
</div>
<div class="col6" style="width: 188px;">
Stacey Smith
</div>
<div class="col7" style="width: 178px;">
In Process
</div>
</li>
You can get the text WebElement by using below xpath:
//div[#class='col4']
or
//div[contains(text(),'This is project');
you can use any one of the xpath to find web element.
Something like this:
WebElement element = driver.findElement(By.xpath("//div[#class='col4']"));
//Print text
print(element.getText());
//Click on that element if it is clickable.
element.click();
Xpath selector for your case is: //div[contains(text(), 'This is Project:')]
. For example, if instance of webdriver is called like "driver", then code should be:
driver.findElement(By.xpath("//div[contains(text(), 'This is Project:')]")).click();
If your required text "This is Project:" always appears in first row, then you can try below xpath:-
//li[1]/div[#class='col4']
//to get text:-
driver.findElement(By.xpath("//li[1]/div[#class='col4']")).getText();
//to click on it:-
driver.findElement(By.xpath("//li[1]/div[#class='col4']")).click();
Related
I am using java, thymeleaf and flying saucer to generate pdf. I need to add another pdf (by fetching from Aws S3).
I tried iFrame and Embed but it is not working, I am not getting the second pdf in my generated pdf file!
Please help me in finding some way to add the pdf inside of pdf using thymeleaf;
My code-
<body>
<div class="header">
<div style="float: right; color: #000971">
Logo</div>
</div>
<div style="">
<div style="text-align: center; padding-top: 15px; "><h1 style="color:#000971;"><span th:text="${Name}"></span></h1></div>
<div style="padding-top: 30px; margin-left: 50px">
<h1 style="color:darkcyan;"><u>Report:</u></h1>
<h1 style="color: darkcyan; margin-top: 250px">Report By: <br />
<span style="color:#000971;" th:text="${firstName}"></span> <span style="color:#000971;" th:text="${lastName}"></span></h1>
<!-- <h1 style="color: #006382;">Last Name: <span style="color:#6FB8D9;" th:text="${lastName}"></span></h1>-->
<br/>
<div id="lastContent" style="margin-top: 80px">
<h2 style="color: darkcyan">REPORT DATE:</h2>
<h2 style="color: #000971">Created Date: <span th:text="${createdTime}"></span></h2>
<h2 style="color: #000971">Last Updated Date: <span th:text="${lastUpdated}"></span></h2>
</div>
</div>
</div>
<div>
<iframe src="http://www.wright.edu/~david.wilson/eng3000/samplereport.pdf" style="width:100%;height:700px;"></iframe>
<embed src="./samplereport.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html" />
</div>
</body>
Html:
<input size="24" autocomplete="off" id="P.Gender" name="P.Gender" class=" x-form-text x-form-field x-form-focus" style="width: 125px;" title="" type="text">
<div class="x-layer x-combo-list " id="ext-gen1943" style="position: absolute; z-index: 11000; visibility: visible; left: 377px; top: 232px; width: 148px; height: 60px; font-size: 12px;">
<div class="x-combo-list-inner" id="ext-gen1944" style="width: 148px; height: 60px;">
<div class="x-combo-list-item ">Unknown</div>
<div class="x-combo-list-item ">Male</div>
<div class="x-combo-list-item x-combo-selected">Female</div>
</div>
</div>
Question: How to select Male/Female/Unknown from above HTML using Selenium webdriver? There is no select class in HTML, so I am not able to use Select.
You can normally use xpath with contains for selecting male/female/unknowm. Otherwise you can ask your developers to add select tag for these dropdowns if they can make the changes.
Example: //div[contains(text(),'Male')]
In my SeleniumWebdriver test, I need to retrieve the text of a fieldlabel-content based on the fieldlabel-label to ensure info provided for every fieldlable-label is correct.
Here is the HTML code:
<div class="gridlayout-row" style="padding-top: 0px;">
<div class="gridlayout-column" style="padding-left: 0px; width: calc((100% - 110px) * 0.166667 + 10px);">
<div class="gridlayout-content">
<label class="fieldlabel">
<div class="fieldlabel-label">Type</div>
<div class="fieldlabel-content">Paid</div>
</label>
</div>
</div>
<div class="gridlayout-column" style="padding-left: 10px; width: calc((100% - 110px) * 0.166667 + 10px);">
<div class="gridlayout-content">
<label class="fieldlabel">
<div class="fieldlabel-label">Expires</div>
<div class="fieldlabel-content">Jul 27, 2017</div>
</label>
</div>
</div>
<div class="gridlayout-column" style="padding-left: 10px; width: calc((100% - 110px) * 0.166667 + 10px);">
<div class="gridlayout-content">
<label class="fieldlabel">
<div class="fieldlabel-label">Last update</div>
<div class="fieldlabel-content">Jul 12, 2017</div>
</label>
</div>
</div>
You can find div element with class fieldlabel-label using its text and use following-sibling to get element with fieldlabel-content class.
driver.findElement(By.xpath("//div[#class='fieldlabel-content and contains(text(), 'Expires')']/following-sibling::div[#class='fieldlabel-content']"));
You can try this Xpath :- //div[text()="Type"]/following-sibling::div[#class="fieldlabel-content"]
In above xpath you can provide dynamic 'fieldlable-label' text in first div. On the biases of that you can get respective fieldlabel-content value.
driver.findElement(By.xpath("//div[text()="Type"]/following-sibling::div[#class="fieldlabel-content"]")).getText();
There are two buttons on HTML pop up have almost similar. Both buttons are same except for the span text nothing is different.
Can anyone please suggest, how to write the xpath of OK button?
I have wrote below xpath but system showing error as '.
My Xpath
driver.findElement(By.xpath("//div[#class='ui-dialog-buttonset']/descendant::button[#class='ui-button']/span[contains(#class, 'ui-button-text') and text() = 'OK']")).click();
Error
org.openqa.selenium.NoSuchElementException: no such element: Unable to locate element:
Here is My HTML code of pop up:
HTML
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-dialog-buttons ui-draggable" style="height: auto; width: 350px; top: 295.5px; left: 621px; display: block; z-index: 102;" tabindex="-1" role="dialog" aria-describedby="DivExtension" aria-labelledby="ui-id-2">
<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix ui-draggable-handle">
<span id="ui-id-2" class="ui-dialog-title">内線番号</span>
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" type="button" role="button" title="Close">
<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
<span class="ui-button-text">Close</span>
</button>
</div>
<div id="DivExtension" class="display-none ui-dialog-content ui-widget-content" style="display: block; width: auto; min-height: 0px; max-height: none; height: 68px;">
<div id="extRow" class="display-none" style="display: block;">
<p class="form-label">
<label for="extension">内線番号</label>
</p>
<p class="form-input">
<input id="Extension" class="text" type="text" placeholder="Extension" value="">
</p>
</div>
</div>
<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
<div class="ui-dialog-buttonset">
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="button" style="height: 34px; width: 104px;" role="button">
<span class="ui-button-text">OK</span>
</button>
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="button" style="height: 34px; width: 124px;" role="button">
<span class="ui-button-text">キヤンセル</span>
</button>
</div>
</div>
Depending if you have multiple buttons on the page with the text OK.
If you want use multiple condition you can also use something like
//*[condition_1][condition_2]
In this case:
//span[#class='ui-button-text'][text()='OK']
or for the button:
//button[#class='ui-button'][.//span[contains(text(), 'OK')]]
For multiple classes example:
//button[#class='ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only']
or as you use it with contains.
Note: Make sure you are waiting for the element if needed.
For an element with multiple classes you have 2 options:
use #class='my_class'
this mean to use the entire value of attribute class => my_class will be all classes, the entire string
use contains(#class, 'my_class')
this option allows you to use just a part of the class attribute value => my_class could be any part of the string: ui, button, ui-button etc.
In your case, you used button[#class='ui-button'] which is not correct since the button has class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only".
Check these two xpath's for ok button
//button/span[contains(text(),'OK')]
OR
//div[#class='ui-dialog-buttonset']/button/span[contains(text(),'OK')]
I need to write script for drop-down boxes. There are two dropdown elements on same screen and both the dropdown boxes have got similar class names (Dropdown boxes are of search and select kind),and there is no unique-id for any element.
So the script works fine to select element from first dropdown, But it fails when it supposed to perform same for second dropdown.
Do reply
Regards
<div class="title-edit-form" id="49156080-2097-ea0f">
<div class="control-group required">
<label class="control-label">Title
</label>
<div class="controls row-fluid">
<div class="select2-container span12 select2-container-active select2-dropdown-open" id="s2id_title">
<a href="#" onclick="return false;" class="select2-choice" tabindex="-1">
<span>de</span>
<abbr class="select2-search-choice-close" style="display:none;">
</abbr>
<div>
<b></b>
</div>
</a>
</div>
<input class="span12" id="title" type="hidden" style="display: none;" value="-1">
</div>
</div>
<div class="select2-drop select2-drop-active" style="display: block; top: 177px; left: 536px; width: 530px;">
<div class="select2-search">
<input type="text" autocomplete="off" class="select2-input select2-focused" tabindex="-1" style="">
</div>
<ul class="select2-results">
<li class="select2-results-dept-0 select2-result select2-result-selectable select2-new">
<div class="select2-result-label">
<span class="select2-match">de</span>
</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable">
<div class="select2-result-label">
<span class="select2-match">De</span>
"an"
</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted">
<div class="select2-result-label">
"Stu"
<span class="select2-match">de</span>
"nt"
</div>`enter code here`
</li>
</ul>
</div>
the best way is to use cssSelector() for that kind of things, and especially the nth-child() function from cssSelector().
Exemple :
// gets the first div that contains school as a class value.
driver.findElement(By.cssSelector("div.school:nth-child(1)"));
More about cssSelector()
exemple wokring here -> JSfiddle