We Keep Coding

Unable to input Credit card number using selenium java

Unable to input Credit card number using selenium java. Need help on xpath identification for the element located in iFrame
<div class="stripe-payments-elements no-wrap">
<div id="stripe-payments-card-number" class="stripe-elements-field StripeElement StripeElement--empty">
<div class="__PrivateStripeElement"
style="margin: 0px !important; padding: 0px !important; border: none !important; display: block !important; background: transparent !important; position: relative !important; opacity: 1 !important;">
<iframe name="__privateStripeFrame2445" frameborder="0" allowtransparency="true" scrolling="no"
allow="payment *"
src="https://js.stripe.com/v3/elements-inner-card-89f740fc0e6722810574102caaa6bdc1.html#locale=en&wait=false&style[base][fontSize]=16px&rtl=false&componentName=cardNumber&keyMode=test&apiKey=pk_test_B9tz7MWYrP8hZdqKqXbP3HiI00ClIvASDq&referrer=https%3A%2F%2Fstaging1.beyourlabel.com%2Fcheckout%2F%23payment&controllerId=__privateStripeController2441"
title="Secure card number input frame"
style="border: none !important; margin: 0px !important; padding: 0px !important; width: 1px !important; min-width: 100% !important; overflow: hidden !important; display: block !important; user-select: none !important; will-change: transform !important; height: 19.2px;"></iframe>
<input class="__PrivateStripeElement-input" aria-hidden="true" aria-label=" " autocomplete="false"
maxlength="1"
style="border: none !important; display: block !important; position: absolute !important; height: 1px !important; top: -1px !important; left: 0px !important; padding: 0px !important; margin: 0px !important; width: 100% !important; opacity: 0 !important; background: transparent !important; pointer-events: none !important; font-size: 16px !important;">
</div>
</div>
WebDriverWait wait4 = new WebDriverWait(driver,50);
WebElement cardNum = wait4.until(
ExpectedConditions.elementToBeClickable(
By.xpath("//div[#id='stripe-payments-card-number']")));
((JavascriptExecutor) driver).executeScript(
"arguments[0].scrollIntoView(true);",
cardNum);
cardNum.sendKeys("4242424242424242");
I could identify the element is in iframe. Since I am new to selenium java, could you please help me with writing selenium java code to send card number including xpath identification?

You need to send the credit card to the input field after you switch to the iframe. There are several ways to build the xpath, like:
//v1 by containing name, probably the safest option
WebElement iframe_by_name_contains = driver.findElement(By.xpath("//iframe[contains(#name,'__privateStripeFrame')]"));
driver.switchTo().frame(iframe_by_name_contains);
//v2 by name - might not be goood if the 2445 is dynamic
WebElement iframe_by_name = driver.findElement(By.xpath("//iframe[#name='__privateStripeFrame2445']"));
driver.switchTo().frame(iframe_by_name);
//by title - might not be good in case that there are locales and the title is translated
WebElement iframe_by_title = driver.findElement(By.xpath("//iframe[#title='Secure card number input frame']"));
driver.switchTo().frame(iframe_by_title);
//get input field
driver.findElement(By.name("cardnumber")).sendKeys("4242424242424242");
For month/year and CVC
driver.switchTo().defaultContent();
WebElement iframe_by_title_mm_yy = driver.findElement(By.xpath("//iframe[#title='Secure expiration date input frame']"));
driver.switchTo().frame(iframe_by_title_mm_yy);
driver.findElement(By.name("exp-date")).sendKeys("03/24");
driver.switchTo().defaultContent();
WebElement iframe_by_title_cvc = driver.findElement(By.xpath("//iframe[#title='Secure CVC input frame']"));
driver.switchTo().frame(iframe_by_title_cvc);
driver.findElement(By.name("cvc")).sendKeys("123");

Simple way to display currency symbol in html2pdf for iText 7

I updated my code from iText 5.0 to iText 7 and html2pdf 2.0 according to this post. In earlier version rupee symbol was rendering properly, but because of css issue i changed the code. Now complete page is converting properly to pdf except rupee symbol.
Tried adding font in html style tag itself like * { font-family: Arial; }.
Changed value of rupee symbol from &#x20b9, ₹ and also added directly ₹ , but no use.
My Html:
<html>
<head>
<style>
* { font-family: Arial; }
</style>
<title>HTML div</title>
</head>
<body>
<p style="margin-bottom: 0in; padding-left: 60px;">
<div style="font-size: 450%; text-indent: 150px;">
<strong>BUY <span style="color: #ff420e;">2</span> GET
</strong>
</div>
</p>
<div
style="float: left; display: inline-block; margin: 10px; text-align: right; font-size: 70%; line-height: 27; transform: rotate(270deg);">Offer
Expiry Date : 30/11/2017</Div>
<div
style="float: left; display: inline-block; margin: 10px; text-align: right; font-size: 350%;">
₹
<!-- ₹ -->
</div>
<div
style="float: left; display: inline-block; margin: auto; font-size: 1500%; color: red; font-weight: bold;">99</div>
<div
style="float: left; display: inline-block; margin: 10px; text-align: left; font-size: 250%; line-height: 10;">OFF</div>
<div
style="position: absolute; height: 40px; font-size: 250%; line-height: 600px; color: red; text-indent: 50px">Pepsi
2.25 Pet Bottle ltr</div>
<div
style="position: absolute; height: 40px; font-size: 245%; line-height: 694px; text-indent: 50px">
MRP: ₹ <span style="color: #ff420e;">654</span>
</div>
</body>
</html>
Java Code :
public class Test {
final static String DEST = "D://Workspace_1574973//POP//sample_12.pdf";
final static String SRC = "D://Workspace_1574973//POP//src//com//resources//test.html";
public static void main(String[] args) throws Exception {
createPdf(SRC, DEST);
}
public static void createPdf(String src, String dest) throws IOException {
HtmlConverter.convertToPdf(new File(src), new File(dest));
}
}
Earlier code, which was working with symbols.
log.info("Creating file start");
OutputStream file = new FileOutputStream(new File("font_check.pdf"));
Document document = new Document(PageSize.A4);
PdfWriter writer = PdfWriter.getInstance(document, file);
document.open();
InputStream is = new ByteArrayInputStream(fileTemplate.getBytes());
XMLWorkerHelper.getInstance().parseXHtml(writer, document, is);
document.close();
file.close();
log.info("Creating file end");
Is there any simple approach to achieve this, with minimal and optimized code ?
Because I've to generate thousands of pdf in one go, So the performance should not affect.
Please let me know, if anyone achieved this through latest version.
Edit : Also how to set particular paper type in this like A6, A3, A4 etc.

Hope you are not mad, because I don't have reputation to write simple comments... so I'll post a full answer instead. I parse HTML for my work, and I read SO sometimes. There is a lot on the subject regarding UTF-8 here. Most software systems support the "greater than char #256" (UTF-8) codes - for instance the Indian Rupee Symbol. However, most of the time the programmer has to include a specific request for such a desired behavior, explicitly.
In HTML, for instance - adding this line usually helps:
String UTF8MetaTag = "<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />";
Anyway, not having used HTMLToPDF - I might not be the right guy to post answers to your questions - but, because I have dealt with UTF-8 foreign language characters for three years, I know that setting a software setting to handle the 65,000 or so chars is usually VERY EASY, BUT ALSO ALWAYS VERY MANDATORY.
Here is an SO post about using HTMLToPDF and UTF-8 to handle Japanese Kanji characters. Most likely, it should handle all UTF-8, but that is not a guarantee.
HTML2PDF support for japanese language(utf8) is not working
Here are a few posts about it using HTML2PDF in PHP:
Converting html 2 pdf (php) using hebrew returns "???"
Having æøå chars in HTML2PDF charset

INPUT box-sizing border-box with 100% height and width inside TD issue in Chrome

I found a nearly identical case to mine here. But the accepted answer does not work for me so I hope it's OK that I make a new question.
The pic below is what I want to achieve in all major browsers (at least IE8+, Firefox and Chrome). INPUTs placed inside TDs fills their parents both width and height.
My issue is that I can't get it done in Chrome with below code snippet. Thanks in advance
UPDATE: My issue on Chrome explained:
If you take a closer look, there's 1 or 2px padding at top and bottom border. This is me on Chrome Version 47.0.2526.111 m on Windows 7 (Please open in new windows to see clearer)
UPDATE2: Big mistake on the sample. DIVs adapt their parent just fine without using the box-sizing. What I actually want is the INPUT to adapt their parent as well. Just updated my code snippet again.
table {
border-collapse: collapse;
width: 100%
}
td {
height: 100px;
border: 1px #ccc solid;
}
input {
border: 1px #ccc solid;
height: 100%;
width: 100%;
box-sizing: border-box; /* works fine with IE8+ */
-moz-box-sizing: border-box; /* works fine Firefox */
-webkit-box-sizing: border-box; /* height is not correct in Chrome */
/*-webkit-box-sizing: content-box; width is not correct in Chrome */
}
<table>
<tr>
<td>
<input type="text" value="this INPUT need to adapt to its parent TD">
</td>
</tr>
</table>

This is an odd one, but I think what you are seeing is a td with a fixed height of 100px, and border widths on top and bottom of 1px throwing off the child divs height 100% calculation.
Would it be possible to assign the height to the div instead of the td like below? This works for me in chrome.
table {
border-collapse: collapse;
width: 100%
}
td {
border: 1px #ccc solid;
}
div {
border: 1px #ccc solid;
height: 100px;
width: 100%;
box-sizing: border-box; /* works fine with IE8+ */
-moz-box-sizing: border-box; /* works fine Firefox */
-webkit-box-sizing: border-box; /* height is not correct in Chrome */
/*-webkit-box-sizing: content-box; width is not correct in Chrome */
}
<table>
<tr>
<td>
<div>BOX1</div>
</td>
<td>
<div>BOX2</div>
</td>
<td>
<div>BOX3</div>
</td>
</tr>
</table>

why not use simple css layouts rather than doing an over kill with tables?
Fiddle
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
.container {
width: 100%;
}
.padding {
height: 100px;
}
.outer_border {
padding: 1px;
border: 1px solid black;
}
input {
border: 1px black solid;
height: 100%;
width: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
HTML
<div class="container">
<div class="outer_border">
<div class="padding">
<input type="text" value="this INPUT need to adapt to its parent TD">
</div>
</div>
</div>

I'm actually looking for the answer to this question for quite a time now (since 2014). Lying around the internet are some post say that this is a bug of Chromium. I managed to recall a link here. Nonetheless, I doubt there will be answer soon.
Meanwhile, I would like to propose a quick and dirty fix for anyone who got in the same problem as me: For chrome, wrap all the INPUTs inside a DIV.
$(function() {
// if agent is of Chrome
var isChrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
if (isChrome) {
$("table td>:input").wrap($("<div>", {"class": "input-container"}));
}
});
table {
border-collapse: collapse;
width: 100%
}
td {
height: 100px;
border: 1px #ccc solid;
}
input {
border: 1px #ccc solid;
height: 100%;
width: 100%;
box-sizing: border-box; /* works fine with IE8+ */
-moz-box-sizing: border-box; /* works fine Firefox */
/*-webkit-box-sizing: border-box; height is not correct in Chrome
*-webkit-box-sizing: content-box; width is not correct in Chrome */
}
div.input-container {
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td>
<input type="text" value="this INPUT need to adapt to its parent TD">
</td>
</tr>
</table>

getting html inline style attribute value with jsoup

I hope you could help me with this...
First off, some HTML Code...
<div style="font-size:12px; FONT-FAMILY: VERDANA, ARIAL; font-weight:bold; position: absolute; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-right-width:0px; border-bottom-width:0px; top: 0px; left:2px; width:55px;height:30px; padding-left : 0 px;padding-top : 5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Zeit</div>
<div style="font-size:12px; FONT-FAMILY: Tahoma, VERDANA, ARIAL; font-weight:bold; position: absolute; top: 0px; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-bottom-width:0px;border-right-width:1px;left:57px;width:140px;height:30px; padding-left:0px; padding-top:5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Montag</div>
<div style="font-size:12px; FONT-FAMILY: Tahoma, VERDANA, ARIAL; font-weight:bold; position: absolute; top: 0px; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-bottom-width:0px;border-right-width:1px;left:197px;width:140px;height:30px; padding-left:0px; padding-top:5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Dienstag</div>
<div style="font-size:12px; FONT-FAMILY: Tahoma, VERDANA, ARIAL; font-weight:bold; position: absolute; top: 0px; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-bottom-width:0px;border-right-width:1px;left:337px;width:140px;height:30px; padding-left:0px; padding-top:5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Mittwoch</div>
<div style="font-size:12px; FONT-FAMILY: Tahoma, VERDANA, ARIAL; font-weight:bold; position: absolute; top: 0px; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-bottom-width:0px;border-right-width:1px;left:477px;width:140px;height:30px; padding-left:0px; padding-top:5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Donnerstag</div>
<div style="font-size:12px; FONT-FAMILY: Tahoma, VERDANA, ARIAL; font-weight:bold; position: absolute; top: 0px; background-color:#FFFFFF; border-color:#868686; border-style:solid; border-left-width:1px; border-top-width:1px; border-bottom-width:0px;border-right-width:1px;left:617px;width:140px;height:30px; padding-left:0px; padding-top:5px;"><img src="../../server/img/spacer.gif" alt="" width="10" height="1">Freitag</div>
My first problem was to look where the day "Montag" (=Monday) is...till now I got this:
Element content = doc.getElementById("content");
Elements names = doc.select("div[style]");
for(Element elem : names){
if(elem.text().contains("Montag")){
}
}
Do you think it's okay this way?
Right after this,(in the if statement) I have to look after the style inline attribute: "left: [xx]px".
So how I can achieve the following output?:
Montag -> Left:57px
I hope for your help! thank you a lot for may taking the time to answer me.

You can definitely use Jsoup the way you do it to find the correct element.
To get the attribute information, there is no simple way to do this using only Jsoup. You can get the attributes by calling the Element.attributes() method in Jsoup, but as far as I know you will have to use a regex matcher to select the information you want.
You can set up a regex lookahead and lookbehind pattern that will check for occurences that matches your pattern.
Pattern p = Pattern.compile("(?<=border-right-width:1px;)(.*)(?=;width:140px;)");
This pattern will look for all characters that are between border-right-width:1px; and ;width:140px;
Going from this, the code below should produce your desired result:
Pattern p = Pattern.compile("(?<=border-right-width:1px;)(.*)(?=;width:140px;)");
String elementInformation = "";
for (Element elem : names) {
if (elem.text().contains("Montag")) {
Matcher m = p.matcher(elem.attributes().toString());
elementInformation = elem.text() + " -> ";
while(m.find()){
elementInformation += m.group();
}
}
}
System.out.println(elementInformation);
Result:
Montag -> left:57px
You can modify the for each loop and parse the same information for all elements, though it
for (Element elem : names) {
if (!elem.text().contains("Zeit")) {
Matcher m = p.matcher(elem.attributes().toString());
elementInformation += "\n";
elementInformation += elem.text() + " -> ";
while (m.find()) {
elementInformation += m.group();
}
}
}
and you'll get:
Montag -> left:57px
Dienstag -> left:197px
Mittwoch -> left:337px
Donnerstag -> left:477px
Freitag -> left:617px
Take a look at this Regex tutorial if you want to learn how it works.
Regex Tutorial

Regarding the Link / text / image that stays static even when the webpage is scrolled

are there any Java script or any sample available for the Link / text / image that stays static even when the webpage is scrolled.
I am looking for something similar to the one on the bottom left side of the webpage borders(Helpful?, "Yes", "No").
http://www.ehow.com/facebook-for-business/
Regards,
Gourav

Try this code this may help you. but this code required lot more css and javascript code to make this same as ehow.
<style>
.mainDiv {
height: 1000px;
border: solid 1px #000000;
}
.fixDiv {
height: 250px;
width: 20px;
border: solid 1px #000000;
position: fixed;
margin-top: 200px;
}
</style>
<html>
<body>
<div class="fixDiv">h e l p f u l l? Yes No</div>
<div class="mainDiv">Gaurav</div>
</body>
</html>

This can be done using simple css
create a style for div with id="poll" and give this style
div#poll {
position: fixed;
left: 0;
top: 100px;
}
<div id="poll">
<img src="image.jpg" alt="image" class="contimage" border="0"/></div>
This div will be shown in the left side of the window