how to get the activeElement in puppeteer sharp - puppeteer-sharp

In order to find the activeElement in javascript puppeteer you use:
await page.evaluateHandle(() => document.activeElement);
But i cant find this in Puppeteer Sharp.
is there a way to do this?
I'm trying to find the activeElement, check if it has a certain innerText, and if so, click it.

You are after a handle, in this case an IElementHandle then you use EvaluateExpressionHandleAsync
var activeElement = await (IElementHandle)Page.EvaluateExpressionHandleAsync("document.activeElement");
There are more examples on GitHub

Related

I don't have iframe ID or XPath, and I want to type data into textbox under the iframe

I have one website and I am testing payment workflow. How to interact with elements under the iframe.
Please check the HTML code of my website.
Iframe src link changed every 30 minutes so I can not use it as a selector.
Please let me know any better idea.
Install the cypress-iframe node package.
In your cypress/support/commands.js file, add the following:
import 'cypress-iframe';
Then in your test write:
cy.iframe('iframe[src*="uat.freedompay.com"]')
.find('#CardNumber')
.type('4444333322221111')
I can't be sure about this since you don't share the page URL or entire HTML.
As I see here you can try locating the iframe by XPath, something like this:
//iframe[contains(#src,'hpc.uat.freedompay.com/apy/v1.5/controls')]
I've had the same problem, here is how I solved it:
cy.get('.__PrivateStripeElement > iframe') // selector of the iframe
.then(function ($foo) {
const $iFramebody = $foo.contents().find('body')
cy.wrap($iFramebody)
.find(".CardNumberField-input-wrapper input") // selector of the field
.type('4242424242424242122912355101'); // typing the value
});
You can use cypress inspector tool to locate the best unique selector of the iframe.
More info can be found in the article by one of the founder of cypress: https://www.cypress.io/blog/2020/02/12/working-with-iframes-in-cypress/

is there any way to send image to client by socket.io?

I want to make a web app where you can send images in real-time. is there any way of doing it??
any video link or documentation link will be very helpful.
Thank You
As the official website says, socket.io can handle blob objects.
Starting in 1.0, it's possible to send any blob back and forth: image, audio, video.
For example, you can push documents from socket.io server-side like the following. Pushing from client-side to server-side is almost the same with this.
Server-side
const filePath = "./img.jpg"
const imgBinary = fs.readFileSync(filePath)
socket.emit("img",imgBinary)
Client-side
socket.on("img", imgBinary => {
const blob = new Blob([imgBinary])
const imgBlobUrl = window.URL.createObjectURL(blob)
// Insert imgBlobUrl into img.src or something
});

Is there a way to see if a Screen/Route exists in a navigation stack for React Navigation v5?

Depending on if a screen exists in a certain stack I need to be able to do different things in my code. I have tried my best but I haven't found anything on the matter. Is there an easy way to achieve this?
If you mean, you want to get all the routes inside the current navigator, then I think this will fix your problem.
const navigation = useNavigation();
const routes = navigation.dangerouslyGetState().routeNames;
In v.6 :
const navigation = useNavigation();
const routes = navigation.getState().routeNames;
In my v5.7 it was:
const routes = navigation.getRootState().routeNames;
Which returns an array of all available routes, so then I was just able to check if it exist by doing this:
if (routes.includes('YourRouteNameHere')) {
console.log('Route exist!');
}

Find XPath for like button on youtube comment with CasperJS

I am beginner programmer with CasperJS and I love to try new things with scraping. My problem:
I am able to login to youtube and like a video, but I cannot find correct XPath for youtube comment like button.
http://tinypic.com/r/2vayr83/8
Here is the part I am stuck on, I always get error:
wait timeout of 5000ms expired exiting-
so I guess that's because of the incorrect XPath and I want to do that on a specific comment. How could I do that?
casper.waitForSelector(x('//*[#id="update-z132gvlzosmchn30f225wng5gluzgbs5o04"]/div/div/div[1]/div[4]/div[3]/img'), function() {
this.click('//*[#id="update-z132gvlzosmchn30f225wng5gluzgbs5o04"]/div/div/div[1]/div[4]/div[3]/img');
this.capture('like.png')
this.echo("liked");
});
The Youtube comment thread is loaded in an iframe, so you need to change into the iframe first, before doing something in it. You can use casper.withFrame() step function to do this. Keep in mind to select the correct iframe, because there are multiple iframes.
The other thing is that nearly all CasperJS functions only accept CSS selectors by default, but you use an XPath expression for the click. You have to use the XPath utility that CasperJS provides to tell CasperJS that the passed string contains an XPath expression and not a CSS selector.
Another problem might be that the iframe is only loaded once it is scrolled into view. You might need to scroll to the bottom. CasperJS provides the scrollToBottom() function to do this. You will also need to wait until the iframe is put into the page after you scroll down.
Complete (untested) script:
var casper = require('casper').create();
casper.start(url, function(){
this.scrollToBottom();
this.scrollToBottom();
});
casper.waitForSelector('.comments-iframe-container iframe', function(){});
casper.withFrame(1, function(){
var link = '//*[#id="update-z132gvlzosmchn30f225wng5gluzgbs5o04"]/div/div/div[1]/div[4]/div[3]/img';
this.waitForSelector(x(link), function() {
this.click(x(link));
this.wait(1000, function(){
this.capture('like.png')
this.echo("liked");
});
});
}).run();

canvas.drawImage(canvas, 0,0) getting Type Error

I am trying to copy the image from one canvas to another canvas. I have seen an answer saying that an easy way to do it is:
var Scanvas = $("#sourceCanvas");
var Scontext = Scanvas.get(0).getContext("2d");
var Dcanvas = $("#destinationCanvas");
var Dcontext = Scanvas.get(0).getContext("2d");
//draw something in Scanvas
Dcontext.drawImage(Scanvas, 0 ,0);
However, whenever I try this I keep getting a Type Error.
The browser I am using is an up-to-date version of Google Chrome, so I don't think that is the problem.
You are using a jQuery object as the first parameter of drawImage().
It needs to be a pure DOM object.
You can access the underlying DOM objects in jQuery by calling get() and specifically get(0) if there is only one object in jQuery selection, as mentioned in the comments.
DContext.drawImage(Scanvas.get(0),....)

Resources