Xpath of checkbox inside iframe inside div - xpath

for the life of me, I cannot get the xpath of this....
i think the problem is that there are two divs one, called 'div_settings_A' and 'div_settings_C', in the example below you cant see the 'div_settings_C' because its hidden, just cant put my finger on why it wont work!
I have tried
//div[contains(#id, 'div_settings_A')]/input
//tr[#id='inputSavePaymentAccounts'] and td[#name='payAck']
<iframe id="ccPayWiz" class="ui-dialog-content ui-widget-content" src="ccxPaymentDetails.php?c=1805&a=733344&d=null&m=Automation#billtrust.com&b=768866910" style="width: 99%; min-height: 105.833px; height: 717px; position: relative;" scrolltop="0" scrollleft="0">
<!DOCTYPE html>
<html>
<head>
<body style="border: 0px; margin: 0px; padding: 0px;" onload="setuppanes('IG');">
<input id="wpsURL" type="hidden" value="WPS_URL">
<form id="frmPay" onsubmit="return paywizAccountHelper.validateForm(this, '17', 'US');" action="ccProcessPayment.php" method="post" name="frmPay">
<input type="hidden" name="csrf" value="e5297f08b85318aa2ec176a5d8fac2a2">
<div id="divPayWizard2">
<div style="float:left; margin-top:5px">
<ul class="steps ui-widget ui-helper-clearfix">
<li>
<li>
<li>
</ul>
</div>
<br clear="all">
<hr>
<p>
<span class="cc-font"> Enter the customer's billing information to process the payment.</span>
</p>
<div id="divpane1">
<table id="tablepane1" class="cc-pane1-table cc-font">
<br>
</div>
<div id="divpane2">
<table class="cc-pane2-table-top cc-font">
</div>
<div id="div_settings_A" style="display: block;">
<input type="hidden" value="733344" name="SrchAcctNum">
<table class="cc-font" width="700" cellspacing="3" border="0">
<input id="BankCountry" type="hidden" value="US" name="BankCountry">
<tbody>
<tr>
<tr>
<tr>
<tr>
<tr>
<tr>
<tr>
<tr>
<tr>
<tr id="inputSavePaymentAccounts" class="savePaymentAccounts" style="display: table-row;">
<td class="addCCLabel" style="padding-top: 15px">Save this Payment Method</td>
<td style="padding-top: 15px">
<input class="payAck" type="checkbox" name="payAck" style="margin: 0; padding 0" tabindex="9">
</td>
</tr>

You can directly get that ccheck box element by using name attribute as :
.//input[#type = 'checkbox' and #name = 'payAck']
Or if there are multiple check boxes with the same name then try using descendant of tr as :
.//tr[#id = 'inputSavePaymentAccounts']/descendant::input[#type = 'checkbox' and #name = 'payAck']
Or
.//tr[#id = 'inputSavePaymentAccounts']/descendant::input
Hope it helps...:)

Related

Locating using id fails but using link it succeeds to click

For the following link,
<td style="padding-top:3px" align="center">
GNWL200/WL102
<br/>
<a id="17235-SL-GN-0" href="javascript:jpBook($('#17235-SL-GN-0'),'17235','HSRA','SRT','22-9-2017','SL','GN',3,false,0,0,'S');" tabindex="1">Book Now</a>
</td>
If I uses the link as shown below, it succeeds to click
browser.element(link: "Book Now").click
But if I uses the id as shown below it says element is not visible(not present). May I know why?
browser.link(:id, "17235-SL-GN-0").click
Error
Uncaught exception: element located, but timed out after 30 seconds, waiting for #<Watir::Anchor: located: true; {:id=>"17235-SL-GN-0", :tag_name=>"a"}> to be present
C:/Ruby23/lib/ruby/gems/2.3.0/gems/watir-6.8.4/lib/watir/elements/element.rb:633:in `raise_present'
C:/Ruby23/lib/ruby/gems/2.3.0/gems/watir-6.8.4/lib/watir/elements/element.rb:672:in `rescue in element_call'
C:/Ruby23/lib/ruby/gems/2.3.0/gems/watir-6.8.4/lib/watir/elements/element.rb:684:in `element_call'
C:/Ruby23/lib/ruby/gems/2.3.0/gems/watir-6.8.4/lib/watir/elements/element.rb:136:in `click'
C:/Users/rajagopalan.m/RubymineProjects/SeleniumLearning/Rest/TrainTicketBooking.rb:18:in `<top (required)>'
If link is not visible for regular Click() use jsClick:
"arguments[0].click();"
I'm not sure how it looks like in Ruby, but C#, Java looks simillar to:
JavascriptExecutor executor = (JavaScriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);
I found the solution to my question from #yong comment
Actually there are two element present in the page with same id and the first one is invisible and the second one is actual element which I wanted to click, that's what it's throwing the error.
Here is the html file
<td style="padding-top:3px" align="center">
GNWL203/WL105
<br/>
**<a id="17235-SL-GN-0" href="javascript:jpBook($('#17235-SL-GN-0'),'17235','HSRA','SRT','22-9-2017','SL','GN',3,false,0,0,'S');" tabindex="1">Book Now</a>**
</td>
<td style="padding-top:3px" align="center">
<td style="padding-top:3px" align="center">
<td style="padding-top:3px" align="center">
<td style="padding-top:3px" align="center">
<td style="padding-top:3px" align="center">
</tr>
</tbody>
</table>
<span style="font:11px arial;color:red;float:right">* CURR_AVBL : Current Booking Available | RAC : Reservation Against Cancellation | WL # : Wait List | REGRET/WL : No more booking allowed | AVAILABLE : Available | NOT AVAILABLE : Not Available</span>
<br/>
</div>
</div>
<div id="j_idt413" class="rf-p ">
<div id="enqpanelid1" class="rf-p ">
</div>
</span>
<form id="avlAndFareForm" name="avlAndFareForm" method="post" action="/eticketing/trainbetweenstns.jsf" enctype="application/x-www-form-urlencoded">
<input name="avlAndFareForm" value="avlAndFareForm" type="hidden"/>
<div id="avlAndFareForm:trainSchedPanel" style="visibility: hidden;">
<div id="avlAndFareForm:j_idt480" class="rf-p " style="min-height:383px;width:99%;">
<div id="avlAndFareForm:j_idt480_body" class="rf-p-b ">
<ul id="tabul">
<div id="tabcontent">
<div id="c1" class="container-div">
<div id="j_idt382" class="rf-p ">
<div id="j_idt382_header" class="rf-p-hdr ">
<div id="j_idt382_body" class="rf-p-b ">
<table class="t1" cellspacing="0" cellpadding="4px">
<tbody>
<tr>
<tr>
<td style="text-align: left;padding-left: 1em;">
<td style="padding-top:3px" align="center">
GNWL203/WL105
<br/>
**<a id="17235-SL-GN-0" href="javascript:jpBook($('#17235-SL-GN-0'),'17235','HSRA','SRT','22-9-2017','SL','GN',3,false,0,0,'S');" tabindex="1">Book Now</a>**
</td>

Printing pdf formated receipts using RP327 80mm Thermal Receipt Printer

I'm using dompdf to generate pdf formatted receipts which than be printed using RP327 80mm Thermal Receipt Printer. But printed receipts are not fitting the paper properly. Here is an attached image of printed receipts pos receipt.
Here is my html table which is converted to a pdf file
<?php
ob_clean();
$dompdf = new DOMPDF();
$dompdf->set_option('default_font', 'Courier');
$customPaper = array(0,0,340,650);
//$dompdf->set_paper($customPaper);
$dompdf->set_option('enable_css_float',true);
//$dompdf->set_paper("A3", "portrait");
$html =' <html>
<head><style>
.table { display: table; width: 100%; border-collapse: collapse; }
.table-row { display: table-row; }
.table-cell { display: table-cell; border: 1px solid black; padding: 1em; }
}
span { display: block; }
#page table {
size: 340px 650px;
margin: 0px;;
}
.table {
page: table;
page-break-after: always;
font-size: 20px;
}
</style>
</head>
<body>
<div class="table">
<div class="table-row"><div class="table-cell" colspan="3" style="text-align: center"><img src="../../img/top-logo.png"></div></div>
<div class="table-row">
<div class="table-cell" ><span><b> Merchant: </b> '.$parceldetails['company'].' </span><span><b> Pick Addr: </b> '.$parceldetails['addr'].' </span><span><b> Mobile: </b> '.$parceldetails['mobile'].' </span></div>
<div class="table-cell" style="padding: 0px">
<div class="" >Delivery Date:</div><br>
<div class="" style="border-bottom: 1px solid #000000"> '.$parceldetails['r_delivery_time'].' at '.$parceldetails['bytime'].'</div>
<div class="">Agent:</div><br>
<div class=""> '.$parceldetails['name'].' </div>
</div>
</div>
<div class="table-row">
<div class="table-cell" colspan="3" style="text-align: center"> <b style="font-size: larger">'.$ecr.'</b></div>
</div>
<div class="table-row">
<div class="table-cell" colspan="1"><span><b>Customer Name:</b> '.$parceldetails['r_name'].'</span><span><b> Addr:</b> '.$parceldetails['r_address'].' </span><span><b> Mobile: </b> '.$parceldetails['r_mobile'].' </span></div>
<div class="table-cell" style="padding: 0px">
<div class="" style="border-bottom: 2px solid #000000; text-align: center"><b> '.$parceldetails['paymentmethod'].' </b></div>
<div class="" style="text-align: center"><b> '.$parceldetails['product_price'].' BDT </b></div>
</div>
</div>
<div class="table-row">
<div class="table-cell" style="text-align: center"> '.genarateQRCode($data).' </div>
<div class="table-cell" style="padding: 0px">
<div class="" style="border-bottom: 2px solid #000000; text-align: center; height:63px"> Delivered </div>
<div class="" style="text-align: center; min-height:63px"> Cancel </div>
</div>
<div class="table-cell" style="padding: 0px">
<div class="" style="border-bottom: 2px solid #000000; text-align: center; height:63px"> </div>
<div class="" style="text-align: center; min-height:63px""></div>
</div>
</div>
<div class="table-row">
<div class="table-cell" colspan="3">
<b style="margin-top:50px; margin-bottom:-10px; border-bottom: 1px solid #000000; font-size:10px; margin-left:10px">Agent signature</b>
<b style="margin-top:50px; margin-bottom:-10px; border-bottom: 1px solid #000000; font-size:10px; margin-left:50px">Receiver signature</b></div>
</div>
</div>';
$html .='<table class="table">
<tr>
<td colspan="3"><img src="../../img/top-logo.png"></td>
</tr>
<tr>
<td rowspan="2" colspan="2"><span><b> Merchant: </b> '.$parceldetails['company'].' </span><span><b> Pick Addr: </b> '.$parceldetails['addr'].' </span><span><b> Mobile: </b> '.$parceldetails['mobile'].' </span></td>
<td>D. Date<span>'.$parceldetails['r_delivery_time'].'</span></td>
</tr>
<tr>
<td>Agent<span>'.$parceldetails['name'].'</span></td>
</tr>
<tr>
<td colspan="3">'.$ecr.'</td>
</tr>
<tr>
<td rowspan="2" colspan="2"><span><b>Customer Name:</b> '.$parceldetails['r_name'].'</span><span><b> Addr:</b> '.$parceldetails['r_address'].' </span><span><b> Mobile: </b> '.$parceldetails['r_mobile'].' </span></td>
<td><b>'.$parceldetails['paymentmethod'].'</b></td>
</tr>
<tr>
<td><b>'.$parceldetails['product_price'].' BDT</b></td>
</tr>
<tr>
<td rowspan="2" colspan="1">'.genarateQRCode($data).'</td>
<td>Delivered</td>
<td></td>
</tr>
<tr>
<td>Cancel</td>
<td></td>
</tr>
<tr>
<td colspan="3">&nbsp</td>
</tr>
<tr>
<td colspan="3">Agent Signature Receiver Signature</td>
</tr>
</table>
</body>
</html>';
$dompdf->load_html($html);
$dompdf->render();
$dompdf->stream("dompdf_out.pdf", array('Attachment' => 0));
<?>
According to the linked printer specs the printer is capable of printing to a width of either 72mm or 64mm. That translates to roughly 204pt and 181pt (respectively). Rather than relying on a larger paper size and limiting your content width I'd try to work within the constraints you have.
You should also keep in mind that dompdf translates pixel-based measurements into the appropriate point size based on the DPI specified for your document. If you want a one-to-one correspondence between your HTML document and the rendered PDF you should set the Dompdf DPI to 72 since the PDF PPI is fixed at 72.
With that in mind here's my advice. I'm assuming you're using Dompdf 0.6.x based on the method calls.
Set your paper size appropriately. Let's assume you have the 72mm width paper.
$dompdf->set_paper(array(0,0,204,650));
Set your DPI
$dompdf->set_option('dpi', 72);
If you're going to use a table for layout then you should just go ahead and use table elements. Styling DIVs with table display types will just cause them to be treated like table elements. What you have will work fine, but it will be clearer to you what's going on if you just use table elements.
Know that Dompdf be a bit quirky in relation to tables. One thing to keep in mind is that Dompdf won't allow table cells to be smaller than the contained content (for normally flowed content).
It's hard to give any input on why the printer is cutting off the content. I'd suggest cleaning up your code. I just noticed that you have the same content twice, once as DIVs styled to be table elements and a second time as an actual table.
It seems that this is a problem about drivers, you can solve this problem on official webiste: https://posguy.pro/en/support

ruby selenium click on button with class name

I'm using ruby and selenium to test a web page, with the two buttons below
<div class="AVdis">
<span class="gwt-InlineHTML"/>
<a class="AVcur" name="attendEdit"; font-size: 12px;">[edit]</a>
</div>
<div class="lineHeight">
<button type="button" class="pcbtn" style="display: inline-block;">yes</button>
</div>
I've tried to use
driver.find_elements(:class, 'AVcur').click
driver.find_elements(:class, 'pcbtn').click
but it doesn't work, please advise.
Thanks
updated the full HTML code(the part code of class 'pcbtn' ONLY, it doesn't include the part with class 'AVcur'.):
<body>
<iframe src="javascript:'';" id="__gwt_historyFrame" style="width: 0px; height: 0px; border: 0px; display: block;"/>
<iframe src="javascript:''" id="Attend" tabindex="-1" style="position: absolute; width: 0px; height: 0px; border: none;"/>
<div style="display: none;"/>
<div class="GFKFO5SBPF hBody nClientFalse">
<div class="left" style="width: 198px;">
<div class="contents nClientFalse2">
<div class="AVright">
<div class="GFKFO5SBIQ">
<div class="AVfirstTd">
<table cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="left" style="vertical-align: top;">
<div>
<table cellpadding="0" cellspacing="0" class="pcattd_record" width="630px">
<tbody>
<tr class="GFKFO5SBCS">
<tr class="GFKFO5SBCS">
<th>
<td>
<table class="noborder">
<tbody>
<tr>
<td>
<td>
<div class="lineHeight">
<button type="button" class="pcbtn" style="display: inline-block;">press button</button>
Try to click it, using xpath:
driver.find_element(:xpath, "//div[#class='AVdis']//a[#name='attendEdit']").click
Second element xpath:
driver.find_element(:xpath, "//div[#class='lineHeight']//button[#class='pcbtn'][text()='yes']").click
Click an element:
driver.find_element(css: 'a').click

unable to identify iframes using page-object

I tried different ways to identify the nested frame using page-object i tried like
in_iframe(index: 1) do |frame|..end and i tried with id & class as well but no luck
<div id="tabsWrapper">
<table id="defaultTabs" width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr>
<td class="tabContentCell">
<div id="tabContentContainer" style="height: 443px;">
<a id="top" name="top"></a>
<div id="tabDefaultContent"> </div>
<div id="tab14036918566282Content" class="tabContent" style="display: none;">
<iframe id="tab14036918566282Frame" class="portal xicSeamlessUI" width="100%" height="716px" frameborder="0" "="" name="tab14036918566282Frame" marginheight="0" marginwidth="0" src="/mywork/ptl/secure/defaultportal" style="height: 443px;">
<!DOCTYPE html>
<html class="ltr yui3-js-enabled gecko ltr js firefox firefox24 firefox24-0 win secure" lang="en-US" dir="ltr">
</iframe>
</div>
<div id="tab14036918654673Content" class="tabContent">
<iframe id="tab14036918654673Frame" class="portal xicSeamlessUI" width="100%" height="716px" frameborder="0" "="" name="tab14036918654673Frame" marginheight="0" marginwidth="0" src="/ncs/secure/jas/create" style="height: 443px;">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<body class="browserFF browserFF3 Init">
<div class="xicSeamlessUI" xic:app="Create" xic:title="Create">
<span id="bFeedback" class="feedback"> </span>
<div id="confirmationWindow69" xic:width="50%">
<div id="contentModalWindow6c" xic:width="50%">
<input id="hiddenText" class="xicInputText" type="text" size="1" style="visibility:hidden" name="hiddenText">
<input id="hiddenCheckBox" type="checkbox" onclick="var wcall=wicketAjaxPost('?wicket:interface=:0:hiddenCheckBox::IBehaviorListener:0:', wicketSerialize(Wicket.$('hiddenCheckBox')),null,null, function() {return Wicket.$('hiddenCheckBox') != null;}.bind(this));" name="hiddenCheckBox" style="visibility: hidden">
<table cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="83%"> </td>
<td width="17%" align="right" nowrap="nowrap">
<label id="categoryDescription65">Select Category: </label>
<span id="categoryDescriptionDropDown66">
<div class="xicInputWrapper xicInputWrapperSelect">
<select id="cellDropDown67" class="xicSmartSelectLoaded" name="categoryDescriptionDropDown:cellDropDown" onchange=".page.showPleaseWait('Processing...');var wcall=wicketAjaxPost('?wicket:interface=:0:categoryDescriptionDropDown:cellDropDown::IBehaviorListener:0:', wicketSerialize(Wicket.$('cellDropDown67')),null,null, function() {return Wicket.$('cellDropDown67') != null;}.bind(this));">
<option value="0" selected="selected">New</option>
<option value="1">Basic</option>
<option value="2">Advanced</option>
<option value="3">Premium</option>
<option value="4">Other</option>
</select>
</div>
</span>
</td>
</tr>
<tr>
<tr>
<tr>
</tbody>
</table>
<div id="myPleaseWait22" class="xicPleaseWait xicFullPageZIndex" style="z-index: 2000; display: none;">
</div>
<div id="PleaseWait" class="xicPleaseWait xicFullPageZIndex" style="z-index: 6000; display: none;">
</body>
</html>
</iframe>
</div>
</div>
</td>
</tr>
<tr>
</tbody>
</table>
Here, there are two frames 1 is active and other hidden.
Exception:
timed out after 30 seconds, waiting for {:css=>"select[name*='Description']", :tag_name=>"select"} to become present (Watir::Wait::TimeoutError)
This seems to me an IEDriver issue when i tried with firefox and chrome it is working fine
Explicitly switching to the frame in question worked for me.
First you switch to the frame and once you are done working inside the frame don't forget to return to your default content:
driver.switch_to.frame "frameName"
Do your stuff within IFrame
driver.switch_to.default_content
To find the solution the selenium docs were helpful as well as a this post about handling Iframes with selenium webdriver.

Unable to find an Xpath of an element using webdriver and xpath

I need to click on the textbox next to username . Am unable to find the Xpath for this using webdriver...can I get some help?
here is the html snippet:
<div id="form-1013-body" class="x-panel-body x-panel-body-default x-panel-body-default x-docked-noborder-top x-docked-noborder-right x-docked-noborder-bottom x-docked-noborder-left" style="padding: 0px; height: 108px; left: 0px; top: 0px; width: 376px;">
<span id="form-1013-outerCt" style="display: table; height: 100%;">
<div id="form-1013-innerCt" class="" style="display:table-cell;height:100%;vertical-align:top;padding:5px 5px 5px 5px">
<table id="textfield-1014" class="x-field x-table-plain x-form-item x-field-default x-anchor-form-item x-form-invalid" cellpadding="0" style="table-layout: auto;">
<tbody>
<tr id="textfield-1014-inputRow">
<td id="textfield-1014-labelCell" class="x-field-label-cell" width="205" valign="top" halign="right" style="">
<label id="textfield-1014-labelEl" class="x-form-item-label x-unselectable x-form-item-label-right" unselectable="on" style="width:200px;margin-right:5px;" for="textfield-1014-inputEl">Username:</label>
</td>
<td id="textfield-1014-bodyEl" class="x-form-item-body " role="presentation" colspan="1">
<input id="textfield-1014-inputEl" class="x-form-field x-form-required-field x-form-text x-form-invalid-field" type="text" autocomplete="off" name="username" aria-invalid="true">
</td>
<td id="textfield-1014-sideErrorCell" width="17" valign="middle" style="">
<div id="textfield-1014-errorEl" class="x-form-error-msg x-form-invalid-icon" style="" data-errorqtip="<ul class="x-list-plain"><li>This field is required</li></ul>">
<ul class="x-list-plain">
<li>This field is required</li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
<table id="textfield-1015" class="x-field x-table-plain x-form-item x-field-default x-anchor-form-item" cellpadding="0" style="table-layout: auto;">
</div>
</span>
Try replacing your code
List<WebElement> elements = driver.findElements(By.tagName("input"));
with this one:
List<WebElement> elements = driver.findElements(By.xpath("//input"));
Check this cool cheat sheet for further selections
http://www.simple-talk.com/content/file.ashx?file=4937

Resources