PhantomJS 'click' event works on link, but not button? - web-scraping

Question

I'm scraping dynamic content with PhantomJS. I want to load this website: https://www.instagram.com/explore/tags/fun/, and click the button at the bottom of the screen "load more" to load more pictures, and save the HAR content. This code works:
var page require('webpage').create();
page.open('http://www.milliondollarhomepage.com', function(status) {
setTimeout(function(){
page.sendEvent('click', 240, 210, button='left') }, 200);
setTimeout(function(){
page.render("screensho1.png");
phantom.exit();
}, 5000);
});
It clicks a --link-- on the screen. But when I use my URL of interest, https://www.instagram.com/explore/tags/fun/ the same code with the proper coordinates won’t click the ---button---.
Any help would be much appreciated.

Answer 1

Positioning of elements is often relative, so I would recommend to avoid absolute click events; instead work with selectors and trigger a click event on the element:
var page = require('webpage').create();
var fs = require('fs');
var system = require('system');
var url = "https://www.instagram.com/explore/tags/fun/";
page.open(url, function(status) {
console.log("Status: " + status);
if(status === "success") {
setTimeout(
function(){
page.evaluate(
function(){document.querySelector("#react-root > section > main > article > div > div > a").click();}
);
}, 200);
setTimeout(
function(){
path = 'hardcoded.png';
page.render(path, {format: 'png', quality: '100'});
phantom.exit();
}, 1000);
}else{
phantom.exit();
}
});