How to change current page in Phantomjs using buttons? [duplicate] - javascript

This question already has an answer here:
Open link in PhantomJS synchronously
(1 answer)
Closed 6 years ago.
I have start to using Phantomjs and I don't understand something. How to change current page using buttons? For example I've got a code:
var page = require('webpage').create();
page.open('https://ru-ru.facebook.com', function() {
page.injectJs('jQuery.js');
page.evaluate(function() {
$('#email').val('MyLogin');
$('#pass').val('MyPass');
$('#u_0_l').click();
});
page.render('example.png');
phantom.exit();
});
So after clicking a button I need to go to the next page. How can I do this?

Assuming the $.click() actually worked, you need to wait until the page has loaded.
setTimeout:
You may feel lucky and try it with
page.evaluate(function() {
// form vals and click
});
setTimeout(function(){
page.render('example.png');
phantom.exit();
}, 3000); // 3 sec timeout
waitFor selector:
You may use the waitFor example from the phantomjs package to wait for an element that you know is only on the loaded page, but not on the current page.
waitFor loadFinished:
You may combine waitFor with the onLoadFinished callback handler to do wait for the next page to load. This is preferable since this would work every time and would not impose overshooting with a conservative timeout.
Just use CasperJS:
Nothing more to add.

Related

Testing a non angular website using Protractor

I am trying to test my website which is a non angular website through Protractor. My code is:
describe("Supplier Portal: Login ", function () {
//ui.setSmallScreenSize();
// ui.testLogger(100);
it("test", co.wrap(function* () {
browser.ignoreSynchronization = true;
yield browser.driver.get("https://cit.supplier.ext.here.com/");
yield element(by.xpath("//*[#id=\"rnav\"]/li[2]/a")).click();
var elmOK = element(by.xpath( "//*[#id=\"sign-in-email\"]"));
browser.driver.wait(protractor.until.elementIsVisible(elmOK.getWebElement()))
}));
});
But when I try to execute the code I got the following error:
Failed: No element found using locator: By(xpath, //*[#id="sign-in-email"])
But the element is there on the website.
Please advice what I'm doing wrong
Since you are working on a non-angular site and using browser.ignoreSynchronization = true, Protractor will not wait for the angular variable to become available, so it starts firing tests off because it thinks the app is ready, more info here.
You need to manipulate the Control Flow by using Expected Conditions so Protractor knows that it is waiting for something. This will make your tests more consistent and reliable.
A few examples to guide you:
Wait for an element to be loaded/present in the DOM:
var EC = protractor.ExpectedConditions;
var ele = element(by.css('div.class'));
browser.wait(EC.presenceOf(ele), 5000);
The 5000 parameter value I passed in says wait a maximum of 5 seconds, if not present in 5 seconds then fail.
Wait for an element visible:
browser.wait(EC.visibilityOf(ele), 5000);
Wait for an element to be clickable:
browser.wait(EC.elementToBeClickable(ele), 5000);
Again, it's important to note that these are implicit waits and they will wait a maximum of the time parameter provided. It is not a guaranteed amount of time to wait, they fire off ASAP when they find the element you told it to wait for.

how to execute a function after the page is loading is done in angularjs [duplicate]

This question already has answers here:
How to run function in AngularJS controller on document ready?
(10 answers)
Closed 6 years ago.
I have an angularjs app. In the html page I call some REST services when the page is loading. I want to calculate the time taken in loading the page.
I found below code at Calculating Page Load Time In JavaScript:
window.onload = function () {
var loadTime = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart;
console.log('Page load time is '+ loadTime);
}
But it uses window.onload.
Which angularjs directive should I use to execute this logic after the page load is done.
Thanks.
angular.element(document).ready(function(){
//do it here
});

Open link in PhantomJS synchronously

I want to know is there any way to click link (open link) on PhantomJS synchronously. First page must be opened first, then click link on the first page to go to second page. Here is my approach using setTimeout:
var page = require('webpage').create();
var url = "http://domain.tld/index.html";
page.open(url, function (status) {
page.render("1-home.png");
page.evaluate(function() {
// search for element and click it to redirect
document.getElementById("RetailUser").click();
});
// I use setTimeout to wait for firstpage to get loaded
setTimeout(function () {
// do another process on second page
}, 5000);
}
PS: I aware I can accomplish it using CasperJS. But if possible, I don't want to use CasperJS.
Clicking a link is always synchronously. What happens afterwards is always asynchronously, because of the asynchronous nature of JavaScript.
There are multiple ways to wait for the next page:
Static amount of time with setTimeout,
Dynamic waiting for a condition with waitFor,
Next page load by registering to page.onLoadFinished before the click,
Wait until all outstanding requests are finished (one and two) or
A combination of those four methods.

how to load a .each function on body load [duplicate]

This question already has answers here:
Trigger event on body load complete js/jquery
(10 answers)
Closed 8 years ago.
based on my previous question (HERE) ive updated my time ago code block, it works fine,the interval gets called every 10 sec but im faced with yet another silly problem . My problem is that i dont know how to load the function as soon as the body is loaded
my code (the important part)
$(".elapsed_time").each(function() {
time_r = $(this).data('time_raw');
var self = $(this);
var inter = function() {self.html(time_ago(time_r));}
setInterval(inter, 10000);
});
This can be done in jQuery by wrapping your code in the following:
$(document).ready(function () {
//-- This code will run when the body is loaded
});
You can also use the shorthand notation to accomplish the same thing:
$(function () {
//-- This code will run when the body is loaded
});
Edit: Kevin raises a good point, this is technically different from a true 'body load' event. The way I interpreted your issue, you wanted to wait until all of the elements are available before running your code.
More info on this: window.onload vs $(document).ready()

Clear Set TimeOut Javascript

I am creating Tabs in javascript in my ASP.Net web site. Say Tab 1 Tab 2--- Tab 10.
When I click on Tab 1 it shows some data and I call setTimeout function that keeps refreshing the Tab 1 data. My problem is when i switch to other tabs the settimeout function still keep running in the background, that i don't want. How can i stop this on moving to other tabs.
Thanks
Regards
Vivek
You could use the clearTimeout function. Example:
var timeoutHandle = window.setTimeout(function() {
// ...
}, 5000);
and later you could:
window.clearTimeout(timeoutHandle);
There are also the setInterval/clearInterval methods which could be used. Contrary to setTimeout, the setInterval function executes the callback multiple times until cleared. A similar behavior could be achieved with setTimeout by recursively calling the callback.

Categories