I try to initiate a click event on Twitter's .com web page. But somehow it doesn't work when I try the code in my extension.
if(typeof TIP == 'undefined'){
var TIP = {};
}
TIP.Tweets = {
getNumberOfTweets: function(){
var tweets = $('#stream-items-id .js-stream-item').length;
return tweets;
},
setNumberOfTweets: function(number){
TIP.Tweets.currentNumberOfTweets = number;
}
}
TIP.initiate = function(){
TIP.Tweets.currentNumberOfTweet = TIP.Tweets.getNumberOfTweets();
setInterval(function(){
var tweets = TIP.Tweets.getNumberOfTweets();
if(TIP.Tweets.currentNumberOfTweets != tweets){
TIP.Tweets.setNumberOfTweets(tweets);
TIP.renderImages();
}
}, 100);
//Render images
TIP.renderImages();
}
TIP.renderImages = function(){
$('#stream-items-id .js-view-details').each(function(){
var btn = this
if($.trim($(this).text()) == 'View photo'){
$(btn).click();//This is the button I want to click, which is the view photo button
console.log('rendered');
}
});
}
$(function(){
TIP.initiate();
});
But, when I try to insert the code manually it works. I insert the following code below in Google Chrome's console:
$('#stream-items-id .js-view-details').each(function(){
var btn = this
if($.trim($(this).text()) == 'View photo'){
$(btn).click();
console.log('rendered');
}
});
If I try to do something else instead of initiating a click event. It works fine. For instance, if I want to manipulate the inner html of the button. It works fine in extension code. The problem only occurs when I try to initiate a click in the extension.
Requested manifest.json file:
{
"name": "Twitter Image Previewer",
"version": "1.0",
"description": "Enables image previews in tweets",
"browser_action": {
"default_icon": "icon.png"
},
"content_scripts": [
{
"matches": ["http://twitter.com/*", "https://twitter.com/*"],
"css": ["style.css"],
"js": ["jquery.min.js", "JeasyCreate.js", "extension.js"],
"all_frames": true
}
],
"permissions": [
"http://*/",
"https://*/"
]
}
I know nothing of JQuery but thought I should point out that it does work as a more pure JS way....
// https://developer.mozilla.org/en/DOM/element.dispatchEvent
function simulateClick(obj) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0, false, false, false, false, 0, null);
var canceled = !obj.dispatchEvent(evt);
/*
if(canceled) {
// A handler called preventDefault
alert("canceled");
} else {
// None of the handlers called preventDefault
alert("not canceled");
}
*/
}
var photos = document.querySelectorAll('#stream-items-id .js-view-details');
for (var i = 0; i < photos.length; i++) {
if (photos[i].firstChild.data.trim()=='View photo') simulateClick(photos[i]);
}