open the url, when .click() is performed using casperjs - phantomjs

i use the url "x" and find the next page button and perform .click() even on it. The .click() event is working fine and i found no errors with it. How can i make casperjs to redirect to the next page when .click() is performed. I thought of using casper.open() but couldn't find a way to use it combined with .click()
var casper = require('casper').create();
casper.start('url');
casper.then(function() {
if (this.exists('a.j-pagination-next')) { //selector for the next page button
this.click('a.j-pagination-next'); // Click on next page button
//should return the next page url
// this.open()
}
else{
console.log("No such selector") //end of pages or wrong selector
}
});
casper.run();

After you click the link, CasperJS will open the next page, no need to an extra open() call. You need to use then() or a waitFor*() function to perform the next step on the next page.
var casper = require('casper').create();
casper.start('url');
casper.then(function() {
if (this.exists('a.j-pagination-next')) { //selector for the next page button
this.click('a.j-pagination-next'); // Click on next page button
}
else{
console.log("No such selector") //end of pages or wrong selector
}
});
casper.then(fucntion(){
console.log("I'm on the next page now");
});
casper.run();
EDIT
In order to get the current URL you should call this.getCurrentUrl():
var casper = require('casper').create();
casper.start('url');
casper.then(function() {
if (this.exists('a.j-pagination-next')) { //selector for the next page button
this.click('a.j-pagination-next'); // Click on next page button
}
else{
console.log("No such selector") //end of pages or wrong selector
}
});
casper.then(fucntion(){
console.log(this.getCurrentUrl());
});
casper.run();
Take a look at How to get get URL of new page using casperJS

Related

Navigate to page and trigger some method

My use case:
After saving the changes on the form, I want to navigate the user to the home page and display for a few seconds message about successful saving. How to do this correct?
My method is simplified like this:
async updateOrder() {
try {
await this.updateOrder({order: this.order});
this.$root.$emit("openCompletedMsg", true); <- I try this, but it doesn't work
this.$router.push("/");
} catch (error) {
...
}
},
So I need show q-dialog on the home page, but after saving my order.

Nightwatch.js - How to do assertion on new browser tab

I have to test one scenario. User types desired URL to text which is linked with button. When user clicks this button, user will be directed to typed URL.
When I do assertion for new tab (Google), output is always like "localhost:8080" which is my previous tab (currentPage).
I think I should set new tab to "this" but, I could not figure it out. If you can help me, I will be appreciated.
linkTest.spec.js
module.exports = {
tags: ['component', 'linkTest'],
before: function(client, done) {
this.currentPage = client.maximizeWindow().page.linkTestPage();
this.currentPage
.navigate(client.globals.devUrl)
.waitForElementVisible('body', 60000)
.customPerform(function() {
done();
});
},
'CASE ID - Case Name'() {
let googleUrl = 'https://www.google.com/';
this.currentPage
.checkInitialElements()
.setExternalUrlText(googleUrl)
.clickLinkLabel();
// Handle with new tab
this.client.windowHandles(function(result) {
let googleTab = result.value[1]; // New Google tab index
this.switchWindow(googleTab) // Switch to Google tab
.assert.urlContains('Google'); // Verify new tab is Google
});
},
after: function(client, done) {
client.end().customPerform(done);
},
};
customPerform.js
exports.command = function(fn, callback) {
this.perform(fn);
if (typeof callback === 'function') {
callback.call(self);
}
return this; // allows the command to be chained.
};
Not sure if you've already figured out how to do this or not, but the way that I was able to is to throw the assertions for the new page into a callback function for the switchWindow function. So in your example,
// Handle with new tab
this.client.windowHandles(function(result) {
let googleTab = result.value[1]; // New Google tab index
// Switch to Google tab
this.switchWindow(googleTab, function() {
this.assert.urlContains('Google'); // Verify new tab is Google
});
});

Browser switch handle Phantomjs Issue

I use protractor with cucumber and whenever there is a need to switch between browser tabs with phantomjs it just hangs without any error message. However the same step works fine with Chrome browser. Why is that? My step is as follows
this.Then(/^the page url hash should be "([^"]*)"$/, function (arg1, callback) {
browser.getAllWindowHandles().then(function (handles) {
newWindowHandle = handles[2];
browser.switchTo().window(newWindowHandle).then(function () {
expect(browser.driver.getCurrentUrl()).to.eventually.contain(arg1).and.notify(callback);
});
});
Ok so apparently the issue was with callback. When i modified the above code slightly it works like a charm even in phantomjs!
this.Then(/^the page url hash should be "([^"]*)"$/, function (arg1, callback) {
browser.getAllWindowHandles().then(function (handles) {
newWindowHandle = handles[2];
browser.switchTo().window(newWindowHandle).then(function () {
expect(browser.getCurrentUrl()).to.eventually.contain(arg1);
});
});
callback();
});

Protractor not waiting for login redirect before continuing tests in AngularJS, any suggestion?

I have a standard username/password/submit button form, when the user clicks on the button the form submits with ng-submit="login.submit()" which does the login and on success redirects to the main page using ui.router ($state.go("main")).
The following test fails:
describe("login", function() {
beforeEach(function() {
var email = element(by.model("login.email"));
email.clear().sendKeys("mail");
var password = element(by.model("login.password"));
password.clear().sendKeys("pass");
var submit = element(by.id("submit"));
submit.click();
});
it("should be able to login", function() {
expect(element(by.css(".loginPage")).isPresent()).toBe(false);
expect(element(by.css(".mainPage")).isPresent()).toBe(true);
});
});
and if I try to add wait times around, I can see that the browser stays on the login page the whole time (after clicking on the button) - then I get a timeout.
After a successful login the browser receives a cookie with a token for authenticating each following request.
EDIT: with some tinkering I found out where it fails..
function login(email, pass) {
alert("it gets here");
return _auth.post({ username: email, password: pass }).then(function(data) {
alert("does not get here");
console.log("loginok, token:" +$browser.cookies().apiToken); //this should be the received token
return data;
});
}
EDIT2: the Auth service
var _auth = Restangular.withConfig(function(Configurer) {
Configurer.setBaseUrl("/");
}).service("auth/simple");
return {
login: login,
};
function login(email, pass) {
return _auth.post({ username: email, password: pass });
}
Manually everything works as expected.
#JoMendez's answer was very close but didn't work in my case. Used #DaveGray's here.
Had to wrap the isPresent() call in a function.
browser.wait(function() {
return element(by.css('.mainPage')).isPresent();
});
Try this:
it("should be able to login", function() {
browser.wait(element(by.css(".mainPage")).isPresent);//this is different from sleep, this will stop the excecution of all the protractor code that is after it, until the element is present, but it won't prevent the application of loading or if is redirecting, it will keep working.
expect(element(by.css(".loginPage")).isPresent()).toBe(false);
expect(element(by.css(".mainPage")).isPresent()).toBe(true);
});
});

JQuery include in phantomjs is not working

My code is:
var url = 'https://search.yahoo.com/',
page = new WebPage(),
fs = require('fs');
page.settings.userAgent = 'Mozilla/5.0 (platform; rv:geckoversion) Gecko/geckotrail appname/appversion';
page.onConsoleMessage = function (msg) {
console.log(msg);
};
page.open(url, function(status) {
if (status !== 'success')
{
console.log('Unable to access network');
phantom.exit();
return;
}
else
{
page.includeJs("https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js", function()
{
page.evaluate(function()
{
$('#yschsp').val("ask question");
$(".sbb").click();
});
page.onLoadFinished = function(status) {
var content = page.content;
fs.write('1.html', content, 'w');
console.log($('#link-1').val());
phantom.exit();
};
});
}
});
JQuery works perfect in page.evaluate but does not work in page.onLoadFinished. I get an error
Can't get variable: $
That means that in function page.onLoadFinished jquery is not working. But I can not understand why?
Since jQuery is loaded into the page context, you can only use there. The only function that interfaces with the page context is evaluate (and the other evaluate functions).
So this line
console.log($('#link-1').val());
must be inside of an evaluate callback. Since you have a page.onConsoleMessage event handler you will receive the console message from the page context.
The other thing is that adding an page.onLoadFinished event handler after the page has loaded isn't doing anything useful. You can remove the handler surrounding your code since the page load is finished when the page.open callback is called.
If #link-1 is not yet loaded, you should either log the value after a static timeout (setTimeout) or use waitFor.