I'm trying to use casper to log-in to http://insider.espn.go.com/insider/pickcenter/.
Now issue is that when you click log-in button, a AngularJS generated fileds - username and password appear.
I have put WaitForSelector to wait for this pop-up. But it always exits saying " Timeout expired"
Here's my script. Please help.
var links = [];
var casper = require("casper").create();
function getLinks() {
var links = document.querySelectorAll('a');
return Array.prototype.map.call(links, function(e) {
return e.getAttribute('href');
});
}
casper.on('page.loaded', function() {
this.echo('page title is ' + this.getTitle());
});
casper.start('http://insider.espn.go.com/insider/pickcenter/', function() {
// search for 'casperjs' from google form
this.emit('page.loaded');
casper.capture('test1.png');
this.click('#ins_signin');
});
casper.wait(5000,function(){
casper.capture('test2.png')
});
casper.wait(5000,function(){
casper.capture('test3.png')
});
casper.waitForSelector(".ng-scope", function() {
this.echo('Login Modal Active!');
casper.capture('test4.png');
//this.capture('screenshotofmodal.png', { top: 0, left:0, width:1000, height: 4000});
});
casper.then(function() {
this.fill('input[id="username"]', { q: 'removed' }, true);
this.fill('input[id="passwordfield"]', { q: 'removed' }, true);
});
casper.then(function() {
this.click('#submitBtn');
});
casper.then(function() {
// aggregate results for the 'phantomjs' search
links = links.concat(this.evaluate(getLinks));
});
casper.run(function() {
// echo results in some pretty fashion
this.echo(links.length + ' links found:');
this.echo(' - ' + links.join('\n - ')).exit();
});
First, before clicking, I would add a check to validate the the button is loaded. After, I would anchor the sign up form on a unique selector. After looking quickly on the page, when you click sign in, the email input has a class "ng-touched" which only appears after clicking on sign up. What I would try would look like this :
casper.start('http://insider.espn.go.com/insider/pickcenter/', function() {
// search for 'casperjs' from google form
this.emit('page.loaded');
casper.capture('test1.png');
});
casper.waitForSelector("#ins_signin",function then(){
this.click("#ins_signin");
}, function onTimeOut(){
this.capture('waitSignInFail.png');
}, 5000);
casper.waitForSelector(".ng-touched", function then() {
this.echo('Login Modal Active!');
casper.capture('weHaveSignInForm.png');
}, function onTimeOut(){
this.capture('signInFormFail.png');
}, 5000);
Related
I have a problem with my delete action inside the datatables. My delete function won't working on second page after pagination.
I did $(this).off().on('click', '.btn_btn-danger_act-delete-member-maillinglist' , function(){ but it doesn't working and my button on first page also won't work.
$('.act-delete-member-maillinglist').each(function() {
$(this).off().on('click', '.btn_btn-danger_act-delete-member-maillinglist', function() {
var email = $(this).attr('data-email');
var list = $(this).attr('data-list');
Polaris.deleteMemberMailingList(list, email, function() {
$('.container_list_member_mailinglist').html('<i class="fa fa-spinner fa-spin"></i>');
Polaris.fetchDataMemberMailingList(lname, function() {
$('#popupmembermailing').find('.container-loader').hide();
});
});
});
});
I'm trying to get the news comments on yahoo, where there is a link "See reactions", with the following id: "caascommtbar-wide" and tried to get the element with CasperJS, Selenium, ScrapySharp, to click on the link and display the comments, but in those tools you never find the element and I've even tried using the XPath
CasperJS:
casper.then (function () {
if (this.exists ('a.caascommtbar-anchor')) {
this.echo ("It exists");
} else
this.echo ("It Does not Exist");
});
casper.then (function () {
// Click on 1st result link
this.click ('a.caascommtbar-anchor');
});
Selenium:
driver.FindElement (By.Id ("caascommtbar-anchor")). Click ();
Does anyone know why you can not access this part of the HTML code where the comments are located?
It should be noted that the same thing happens to me when trying to access the Facebook comments contained in the news forums.
As Isaac said the part of pages are loaded asynchronously, so you should implement waitFor steps in your code. Here is the code that does just that.
var url = "https://es-us.vida-estilo.yahoo.com/instagram-cierra-la-cuenta-de-una-modelo-por-ser-gorda-103756072.html";
var casper = require('casper').create({
viewportSize: {width: 1280, height: 800},
});
casper.start(url, function() {
this.echo('Opened page');
});
casper.waitForSelector('a.comments-title', function() {
this.click('.comments-title');
});
casper.waitForSelector('ul.comments-list > li', function() {
this.echo(this.getHTML('ul.comments-list'));
});
casper.run();
Hope that helps
The problem was why the page was not loaded yet and I had to wait, I'm new with casperjs.
Now I have the problem when trying to remove all comments along with their answers, but can not find an algorithm to help me. Try to press all the answer buttons, but only get the first answers to the first comments.
casper.waitForSelector('button.showMore', function () {
this.click('.showMore');
}, function onWaitTimeout() {
});
var buttons;
casper.waitForSelector('ul.comments-list', function getLinks() {
buttons = this.evaluate(function ()
{
var buttons = document.getElementsByClassName('replies-button');
buttons = Array.prototype.map.call(buttons, function (button) {
button.click();
casper.waitForSelector('ul.comments-list', function () {
casper.wait(3000, function () {
});
});
return button.getAttribute('class');
});
return buttons;
});
}, function onWaitTimeout() {
});
function wait5seconds() {
casper.wait(3000, function () {
});
}
casper.waitForSelector('ul.comments-list > li', function () {
var x = this.getHTML('ul.comments-list');
this.echo(x);
}, function onWaitTimeout() {
});
casper.run();
I'm playing around with CasperJS and trying to catch some Free-Email Alias on https://registrierung.web.de/#.homepage.loginbox_1.1.registrierung
So I have the input field: "E-Mail-Wunschname:" where I want to paste a name, then click the "Prüfen" button and then just scrape the suggested accounts.
So far I have tried that:
var casper = require('casper').create({
pageSettings: {
loadImages: false,
loadPlugins: true,
userAgent:('Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:45.0) Gecko/20100101 Firefox/45.0')
}
});
var mouse = require("mouse").create(casper);
casper.start('https://registrierung.web.de/#.homepage.loginbox_1.1.registrierung').viewport(1200,1000);
casper.then(
function() {
this.sendKeys('.wishname.feedback-panel-trigger.multiReplaceCharsInWishnamelField',"Test");
this.sendKeys('.wishname.feedback-panel-trigger.multiReplaceCharsInWishnamelField',casper.page.event.key.Enter);
this.wait(5000);
}
);
casper.then(function() {
this.wait(5000);
this.capture('webde.png');
console.log('clicked ok, new location is ' + this.getCurrentUrl());
});
casper.run();
I also tired to click the button with:
casper.wait(6000, function() {
this.evaluate(function(){
document.querySelector('.wishname.feedback-panel-trigger.multiReplaceCharsInWishnamelField').value = "Test";
document.querySelector('#checkAvailabilityBtn').click();
});
});
casper.then(function() {
this.capture('webde.png');
console.log('clicked ok, new location is ' + this.getCurrentUrl());
});
With both ways it's just a complete submit of the page and not just the generation of the suggestion.
Clicking on the button (casper.click("#checkAvailabilityBtn")) seems to work well.
Here is the full script:
var casper = require('casper').create();
casper.start('https://registrierung.web.de/#.homepage.loginbox_1.1.registrierung').viewport(1200,1000);
casper.then(function() {
this.sendKeys('.wishname.feedback-panel-trigger.multiReplaceCharsInWishnamelField', "Test");
this.click("#checkAvailabilityBtn");
});
casper.wait(5000);
casper.then(function() {
this.capture('test80_webde.png');
console.log('clicked ok, new location is ' + this.getCurrentUrl());
});
casper.run();
By the way, casper.sendKeys() is not able to handle key presses such as the Enter key. You would need to use PhantomJS' page.sendEvent() function. It works normally in the following way, but doesn't seem to work correctly in this case, because it reloads the page:
this.sendKeys('.wishname.feedback-panel-trigger.multiReplaceCharsInWishnamelField', "Test", {keepFocus: true});
this.page.sendEvent("keypress", this.page.event.key.Enter);
I have a dialog box that loads a partial view, called from a number of different views in my MVC 4 app. It has a text area and a small notice of how many characters are remaining in the text area. All works fine on page load, however when the dialog box is closed, whether by the send button or the close button in the dialog titlebar, when it is reopened the '#textarea_feedback' div content disappears until a page reload. I believe I should be using dialog('destroy') but cannot seem to get the syntax right. Either it has no effect or it displays the partialview at the bottom of the page. Please advise, hope I've included enough code to identify the issue. Thanx
$(document).ready(function () {
var text_max = 160;
$('#textarea_feedback').html(text_max + ' characters remaining');
$('#txtMessage').keyup(function () {
var text_length = $('#txtMessage').val().length;
var text_remaining = text_max - text_length;
$('#textarea_feedback').html(text_remaining + ' characters remaining');
});
$('#send').click(function (e) {
if ($('#txtSMSMessage').val().trim()) {
e.preventDefault();
$.ajax({
type: "POST",
data: $('form#Composer').serialize(),
url: '/MyController/MyAction',
success: function (data) {
alert('Sent');
$('#Composer').closest("div.ui-dialog-content").dialog("close");
},
error: function (a, b, c) {
$("#Composer").unblock();
alert(b);
}
});
//$('#Composer').closest("div.ui-dialog-content").dialog("destroy");
}
});
//var dialog = $('#Composer').closest("div.ui-dialog-content").dialog();
//console.debug(dialog);
//dialog.on("dialogbeforeclose", function (event, ui) {
// dialog.dialog('destroy')
//});
});
Wanted to post answer in case it could help someone else, really was LShetty's comment that lead me in the right direction. Added to the CLOSE function of the Ajax call that created the dialog box:
$.ajax({
url:
...
type: "POST",
success: function (responseText, textStatus, XMLHttpRequest) {
dialog.html(responseText);
dialog.dialog({
...
title: 'Send message',
open: function () {
...
},
close: function () {
$(this).dialog('destroy').remove()
},
...
});
}
I am new to casper js. I am not able to click a button on an overlay page. Can you tell me how to work with overlay page using casper js?
Well, these events should help you :
casper.on('popup.created', function() {
this.echo("url popup created : " + this.getCurrentUrl(),"INFO");
});
casper.on('popup.loaded', function() {
this.echo("url popup loaded : " + this.getCurrentUrl(),"INFO");
});
And here an exemple :
casper.then(function(){
this.clickLabel("Activate your account");
// */mail/* = RegExp for the url
this.waitForPopup(/mail/, function(){
this.test.pass("popup opened");
});
this.withPopup(/mail/, function(){
this.viewport(1400,800);
this.test.pass("With Popup");
//following, a 'wait instruction' because I have a redirection in my popup
this.waitForSelector(".boxValid", function(){
this.test.assertSelectorHasText(".boxValid", "Inscription confirmed");
});
});
});
To know how it works, look at the doc.