Issues with puppeteer typing in credit card input field - puppeteer

I'm currently having issues with a credit card field and typing in the card information. On the website where I'm having puppeteer type the card info, because of the way that the website formats the card numbers, puppeteer is NOT typing the full card number. The way the credit card field works is that after typing four numbers is tries to automatically put a space before the next four numbers.
I am typing the card info within an iframe as well. Not sure if that has anything to do with it. here is some of my code:
await frame.waitForSelector('#creditCardNumber')
await frame.focus('#creditCardNumber')
await frame.type('#creditCardNumber', "4111111111111111")
Something else that I have tried:
await frame.$eval('#creditCardNumber', card => {card.value = "4111111111111111"})
Something that I have found out is that you can copy and paste the credit card information in and it works just fine. I then tried using the clipboardy module but I can't get it working properly. Any ideas?

I experienced variable issues with Puppeteer typing the credit card number, and after I introduced a 200ms delay, it worked like a charm:
await page.type('input[id=cardNumber]', "4242424242424242", { delay: 200 })

Related

webscraping the current page in its current state

ive webscraped before using beautiful soup by making a html request.
but now i dont want data from say wikipedia,i want data from something after it has been modified by the user. eg teslas website has this feature https://www.tesla.com/en_gb/models/design#battery where you personalize your car. suppose i wanted to open this page, change the settings from long range to high performance and THEN grab the inner html from
<span class="specs--value">
(how long it takes to go from 0 to 60)
how could i do this. write a script in python/c# which can grab data from the browser i currently have open, using what tools can i gather data from my current browser
ideally this will be for google chrome
edit:
alternate idea. perhaps i could make a post request which somehow recieves html data as if i did click on the high performance button. but how could i do that?
You could use selenium, It allows to simulate user navegation and extract data during the process.

Robot Framework + Selenium can't enter text in a field, throws InvalidElementStateException

Using Robot Framework (with Selenium) to automatically fill a form - it's a checkout page on a ecommerce website,
It bugs at the very last step, when trying to enter the CVC code of a test credit card,
Robot throws a "InvalidElementStateException: Message: invalid element state: Element is not currently interactable and may not be manipulated"
when the field is clearly visible and actionable.
Using Chrome, not Firefox (can't get it to work at all with FF)
I made sure the test scrolls the page down to see the field, but it still considers that field to be hidden or not actionable.
Has anyone run into the same issue here?
Section of the code that fails is here:
Card Payment is Visible
Execute JavaScript window.scrollTo(0,700)
Wait Until Page Contains Expires
Focus xpath=//*[#id="securityNumber"]
I Enter the CC Security Code
Input Text securityNumber ${CHECKOUT_CARD_CODE}
I Click Submit Order
Submit Form forms.payByCardForm
(the bits about "Focus" and "Input Text" are the ones that fail. I validate the text "Expires" is visible, it's right above the CVC field...)
I also tried:
Wait Until Element is Visible id=securityNumber
But it still fails.
It takes a screenshot and it's clearly there...
Oh well...payment forms you don't build yourself will always be trouble. This one is built using AngularJS so it's even more trouble.
I found how to locate the proper field by using a css property, since there is a hidden form that contains the same field with the same ID and Name.
I did have to use "Sleep" for it to work as well (thx Goralight).
And thanks to everyone else.
Use unique identifiers. Had same issue with the "description" field. Upon using View Source [Code] I see "description" in my HEAD META tag. Changed id fields to use "product_description" - error is gone. Code works.

Get selected text when receive shared data in windows phone

have question about windows phone (UWP) app. Now we have opportunity to receive data if you subscribing for share data. So, user can click share page in IE on windows phone and send this page to facebook app or our app.
My question - is it possible to get selected text on page that user want to share?
if (this.shareOperation.Data.Contains(StandardDataFormats.Html))
{
string htmlFormat = await shareOperation.Data.GetHtmlFormatAsync();
}
I saw this example, but htmlFormat variable in most cases does not contains selected text.
Is it possible to catch somehow selected text when you receive data into your app?
Thanks.
Selected text is something that managed by the browser and it isn't reflected in the HTML.

Refresh the displayed data from a Dojo Grid

I have a Dojo Grid. Every row has a link to the formular, where the data can be changed. Now, when I click save and close (in the form) I want the grid to reload the displayed data. So far, I've managed to reload the data, but I always jump back to the start of the grid. But, e.g. if I'm at the end of the table, I want to reload just the last few entries.
My grid is connected to a JSONRest Store, so basically I just should know the range which is displayed right now... . How do I get the range?
If you have backed your grid by a store, you simply "put" the changed object to your store. The JsonRest store you are using will send the changes back to your server with a PUT request and the grid will pick up the changes and update the corresponding item.
When pressing save in your form, you would need to create a json representation of your form data (that matches the one used in the grid) and put this to the store:
require(["dojo/dom-form", ... ], function(domForm, ...) {
...
var updatedItem = domForm.toObject("yourFormId");
yourGridStore.put(updatedItem).then(function() {
console.log("put was successful");
});
...
}
I've managed to solve the problem without any put to the store. Here is the code:
grid._lastScrollTop=grid.scrollTop;
grid._refresh();
And here is the link where I've found the answer. It is the answer number 6.

Weird site problem with back button

We have a site with a credit card entry form.
The user will enter their information and click submit. This then goes to a thank you page.
On a ThinkPad laptop running IE 8: If the user clicks the back button (from the thank you page) then it takes them back to the credit card entry. However, the fields for Name on card, card number and the first line of the address are not there. (ignore for a moment that the page shouldn't be cached..) I have other machines running IE 8 and 9 that do not exhibit this behavior.
I don't mean that they are empty. I mean the input fields are flat not there. The expiration date, city, state and zip input boxes are there. Just not those listed above.
Any ideas on what could possibly do this? The fields themselves are always visible and there is absolutely zero code to hide them.
My client says that it happens on other forms in their site as well. The main site is a joomla application that uses an iFrame to show the forms from my app.
I have no idea on where to even start with this one.
Yes, we need a link to troubleshoot. All I can say is likely to be some conflicting css hiding it. Use the element inspector and take a look at all the properties on the fields.