CasperJS : how to call __doPostBack - web-scraping

I am trying to scrap a page :
http://fd1-www.leclercdrive.fr/057701/courses/pgeWMEL009_Courses.aspx#RS284323
But as you can see this link redirect to
fd1-www.leclercdrive.fr/057701/courses/pgeWMEL009_Courses.aspx
when you first access it. after you click on "fruits et légumes" you can access the page using the url directly
So I need to simulate a click on the button "Fruits et légumes" to access the page I want. In the code, it does a dopostback
Here is my code that I use with casperjs :
var casper = require('casper').create({
verbose: true,
logLevel: "debug"
});
casper.start('http://fd1-www.leclercdrive.fr/057701/courses/pgeWMEL009_Courses.aspx#RS284323');
// here i simulate the click on "Fruits et légumes"
casper.evaluate(function() {
__doPostBack('objLienReceptdionEvenement','2##284323');
});
casper.then(function() {
console.log(' new location is ' + this.getCurrentUrl());
});
casper.run();
I still be redirected to the wrong page

The call to __doPostBack is not correct (extra 'd' in 'objLienReceptdionEvenement')
Should be
// here i simulate the click on "Fruits et légumes"
casper.evaluate(function() {
__doPostBack('objLienReceptionEvenement','2##284323');
})

Related

WordPress External Link Disclaimer Page

I am currently using this script to warn the user they are leaving the current webiste when clicking on an external link on a WordPress website:
<script>
jQuery(function() {
function leave_now(event) {
var choice = window.confirm( 'Leave page?' );
return choice;
}
var select_external = 'a[href*="//"]:not([href*="yourdomain.com"])';
jQuery(document).on( 'click', select_external, leave_now )
});
</script>
It works great, but I actually need to modify this so it takes them to a warning PAGE instead of having a popup window appear. After the warning page is loaded, it waits 5 seconds, then loads the URL that was clicked on.
Any suggestions would be appreciated.
Set the location.href which will navigate you to the url you specify
location.href='http://www.your-url.com'
So, on click, you could have that function run and set that location instead of do a warning

Meteor Iron Router not working on certain links

I have a route like this:
Router.route('/box', function () {
this.render('boxCanvasTpl');
},{
name: 'box',
layoutTemplate: 'appWrapperLoggedInTpl',
waitOn: function() {
console.log("Box route ran ok.");
return [
Meteor.subscribe('item_ownership_pub', function() {
console.log("subscription 'item_ownership_pub' is ready.");
}),
Meteor.subscribe('my_items', function() {
console.log("subscription 'my_items' is ready.");
})
];
}
});
... and I am clicking a link in a Template like this:
My Link
I receive the 'Box route ran ok.' message, but some reason the page does not navigate to the given URL. I have added console.log code in the funciton that is run when the 'boxCanvasTpl' is rendered, but these aren't showing in the browser console. It seems that something inbetween is stopping the templkate from re-rendering, but can't put my finger on it - any ideas?
There are some properties of Iron Router that you need to be aware of.
Say that the user is currently already on /boxes and there is a box template that renders for that path. If you:
click on a link Click Me
or
click on a link Click Me
Iron Router will NOT re-render the template because it already exists on the page. It will also NOT re-render the template if the box template happens to be a partial template that is already rendered on the page that you're on and also exists on the page that you want to navigate to.
Since it doesn't re-render, any code you have inside Template.box.onRendered will also not run again.
This behavior is most common in your layout, header, and footer templates. For many users, these templates are used for all of a website's pages, regardless of path. Because the layout, header, and footer template is rendered on a person's first visit to the site, they won't be re-rendered ever again if the user decides to navigate to other parts of the site using the same templates, so the code inside Template.layout/header/footer.onRendered won't fire.
Also note - even if a reactive Spacebars helper changes the physical look of the layout / header / footer, it doesn't qualify as an actual render, so reactive updates to the template do not trigger the onRendered callback.
The lack of re-rendering is what gives Meteor that "snappy" feel.
EDIT
Try to code in a reactive, event-driven style. Try not to think too much in a render / re-render sense.
You go to /box
You click on a link for /box?box=2342
Get your params or query in Iron Router
https://github.com/iron-meteor/iron-router/blob/devel/Guide.md#route-parameters
In Iron Router use the data from the params or query to set the data context for the template.
Grab stuff from the data context as needed inside of the template's .onRendered, .events, and .helpers callbacks.
Set Session vars as necessary and use them in helpers to give reactive changes to the page without having to re-render a template. Also use events to trigger updates to the session vars to, again, trigger reactive changes to the page.
Try this:
afterwards, go to /test?BUNNIES=lalalala
check out the console logs
test.html
<template name="test">
{{myData}}
</template>
test.js
Template.test.helpers({
myData: function() {
console.log("data context accessed from test.helpers: ", this);
console.log("this.BUNNIES accessed from test.helpers: ", this.BUNNIES);
return this.BUNNIES;
}
});
Template.test.onRendered(function() {
console.log("data context accessed from test.onRendered: ", this.data);
});
Template.test.events({
'click': function(){
console.log("data accessed from test.events: ", this);
}
});
router.js
Router.route('/test', function() {
console.log("routed!");
this.render('test');
}, {
name: 'test',
data: function(){
//here I am setting the data context
// for /test?BUNNIES=1234
var query = this.params.query;
console.log("query: ", query);
return query;
},
waitOn: function() {
console.log("waitOn is running (should see this message once for each subscription)");
return [
Meteor.subscribe('item_ownership_pub'),
Meteor.subscribe('my_items')
];
}
});
way cleaner way of writing router
Router.route('/test', {
waitOn: function() {
console.log("waitOn is running (should see this message once for each subscription");
return [
Meteor.subscribe('item_ownership_pub'),
Meteor.subscribe('my_items')
];
},
data: function(){
var query = this.params.query;
console.log("query: ", query);
return query;
},
action: function(){
console.log("this will re-render if url params changed");
this.render();
}
})

ASP.NET Route config for Backbone Routes with PushState

I have run into an issue recently where we have been told to remove the hash symbols from our Backbone applications. This presents two problems: (a) the ASP.NET routes need to handle any remotely linked URL (currently this is no problem with the hash symbols) so that we're not hitting a 404 error and (b) the proper route needs to be preserved and passed on to the client side (Backbone) application. We're currently using ASP.NET MVC5 and Web API 2 for our backend.
The setup
For an example (and test project), I've created a test project with Backbone - a simple C# ASP.NET MVC5 Web Application. It is pretty simple (here is a copy of the index.cshtml file, please ignore what is commented out as they'll be explained next):
<script type="text/javascript">
$(document).ready(function(event) {
Backbone.history.start({
//pushState: true,
//root: "/Home/Index/"
});
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
//appRouter.navigate("/test/sometext", { trigger: true });
//appRouter.navigate("/help", { trigger: true });
});
</script>
<div class="jumbotron">
<h3>Backbone PushState Test</h3>
</div>
<div class="row"></div>
Now, without pushState enabled I have no issue remote linking to this route, ie http://localhost/Home/Index#test/sometext
The result of which is that the div with a class of .row is now "Hello, sometext".
The problem
Enabling pushState will allow us to replace that pesky # in the URL with a /, ie: http://localhost/Home/Index/test/sometext. We can use the Backbone method of router.navigate("url", true); (as well as other methods) to use adjust the URL manually. However, this does not solve the problem of remote linking. So, when trying to access http://localhost/Home/Index/test/sample you just end up with the typical 404.0 error served by IIS. so, I assume that it is handled in in the RouteConfig.cs file - inside, I add a "CatchAll" route:
routes.MapRoute(
name: "CatchAll",
url: "{*clientRoute}",
defaults: new { controller = "Home", action = "Index" }
);
I also uncomment out the pushState and root attributes in the Backbone.history.start(); method:
Backbone.history.start({
pushState: true,
root: "/Home/Index/"
});
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
//appRouter.navigate("/test/sometext", { trigger: true });
//appRouter.navigate("/help", { trigger: true });
This allows me to at least let get past the 404.0 page when linking to these routes - which is good. However, none of the routes actually "trigger" when I head to them. After attempting to debug them in Chrome, Firefox, and IE11 I notice that none of the events fire. However, if I manually navigate to them using appRouter.navigate("/help", { trigger: true }); the routes are caught and events fired.
I'm at a loss at this point as to where I should start troubleshooting next. I've placed my Javascript inside of the $(document).ready() event as well as the window.onload event also (as well as not inside of an event); none of these correct the issue. Can anyone offer advice on where to look next?
You simply have to move Backbone.history.start after the "new Route" line.
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
Backbone.history.start({
pushState: true,
root: "/Home/Index/"
});
Make sure you go to ".../Home/Index/help". If it doesn't work, try temporarily removing the root and go to ".../help" to see if the root is the problem.
If you still have troubles, set a js breakpoint in Backbone.History.loadUrl on the "return" line. It is called from the final line of History.start to execute the current browser url on page load. "this.matchRoot()" must pass then, "fragment" is matched against each "route" or regexp string in "this.handlers". You can see why or why not the browser url matches the route regexps.
To set to the js breakpoint, press F12 in the browser to open the dev console, press Ctrl-O or Ctrl-P to open a js file, then type the name of the backbone js file. Then search for "loadUrl:". You can also search for "Router =" to find the start of the router class definition (same as for "View =" and "Model =" to find the backbone view/model implementation code). I find it quite useful to look at the backbone code when I have a question like this. It is surprisingly readable and what better place to get answers?
If your js files happen to be minified/compressed, preferably turn this off. Alternately you can try the browser unminify option. In Chrome this is the "{}" button or "pretty print". Then the js code is not all on 1 line and you can set breakpoints. But the function and variable names may still be mangled.
I have solved my own problem using what feels to be "hackish", via the following. If anyone can submit a better response it would be appreciated!
My Solution:
I globally override the default Backbone.Router.intilaize method (it is empty) with the following:
$(document).ready(function (event) {
var _root = "/Home/Index/";
_.extend(Backbone.Router.prototype, {
initialize: function () {
/* check for route & navigate to it */
var pathName = window.location.pathname;
var route = pathName.split(_root)[1];
if (route != undefined && route != "") {
route = "/" + route;
this.navigate("", { trigger: false });
this.navigate(route, { trigger: true });
}
}
});
});

Facebook button changes position when clicked

I have the following problem with the like&share facebook button. When I click on 'share' everything works as expected, but when I click on like, the pop-up box is cut and the whole div object is moved to the left. How can I overcome this?
Here are pictures:
http://collabl.bingo.icnhost.net/resources/pr2.png
http://collabl.bingo.icnhost.net/resources/pr3.png
The code I use is:
<div class="fb-like" data-send="true" data-width="250" style="height:20px;" layout="button_count"></div>
and
$(document).ready(function() {
$.ajaxSetup({ cache: true });
$.getScript('//connect.facebook.net/en_US/all/debug.js', function(){
FB.init({
appId: '.......',
channelUrl: '//.......',
status : false, // Check Facebook Login status
xfbml : true
});
$('#loginbutton,#feedbutton').removeAttr('disabled');
});
});
Your code looks nothing like what I'm using for the javascript.
Try using the code generated directly from the facebook developers page:
https://developers.facebook.com/docs/reference/plugins/like/

Yahoo UI Custom Button

I have a YUI button defined through HTML markup. I managed to get it loaded and "skinned" properly.
The problem is a custom click event. I have tried a number of approaches all of which links the custom function to the 'click' event, but no matter which way I do it, it ALWAYS triggers upon page loading and then it doesn't fire when clicked. I can't seem to get it to "wait" for a user to click. It just shoots like a virgin on his first date.
Code below....
<script type="text/javascript">
YAHOO.util.Event.onContentReady("submitbutton", onButtonReadySubmit);
YAHOO.util.Event.onContentReady("editbutton",onButtonReadyEdit);
var myTabs = new YAHOO.widget.TabView("demo");
function editDoc(sBaseRef, sUNID) {
var sNewURL = sBaseRef + "/0/" + sUNID + "?EditDocument";
alert("Going to : " + sNewURL);
window.location.href=sNewURL;
}
function onButtonReadySubmit() {
var oSubmitButton = new YAHOO.widget.Button("submitbutton");
}
function onButtonReadyEdit() {
var oEditButton = new YAHOO.widget.Button("editbutton");
YAHOO.util.Event.addListener("editbutton", 'click', editDoc('a URL path goes here' , 'A PageKey goes here'));
}
YUI Button publishes its own click event that you subscribe to on the YUI Button instance, rather than using YAHOO.util.Event.addListener. This is described in detail on the YUI Button landing page: http://developer.yahoo.com/yui/button/#handlingevents.
Your problem is the 3rd argument. That should be a reference to function. What happens in your code is that the 3 argument is a function that is called as the listener is being created, and returns nothing.
You have:
YAHOO.util.Event.addListener("editbutton", 'click', editDoc(
'a URL path goes here',
'A PageKey goes here'
));
Simply what you want is:
YAHOO.util.Event.addListener("editbutton", 'click', editDoc);
However, you also want to pass 'a URL path goes here' and 'A PageKey goes here' to the function at click-time. To do this, use the optional fourth argument to addListener() - an object to pass to the function.
function editDoc (ev, oArgs) {
var sBaseRef = oArgs.url,
sUNID = oArgs.key;
/* code here */
}
YAHOO.util.Event.addListener("editbutton", 'click', editDoc, {
url: 'a URL path goes here',
key: 'A PageKey goes here'
});
See http://developer.yahoo.com/yui/docs/YAHOO.util.Event.html#method_addListener for more.
As Todd mentions, you can also do this as part of the YUI Button creation - but the same issues of function versus function references apply.

Resources