Chrome Extension JavaScript Program Not Working

Question

I am learning chrome extension programming from the tutorial here .

You can find the full code for the chrome extension here .

The code snippet where I tried to remove few links:

var clean_twitter = function(){
  var ugly = [];
  ugly.push('.Trends module trends');
  ugly.push('.flex-module');
  ugly.push('.MomentMakerHomeModule-header');
  ugly.push('.Footer module roaming-module');
  ugly.push('.flex-module-header');

  $('.promoted-tweet').hide(); // oops! :P

  for(var i=0;i<ugly.length;i++) {
    var u = $(ugly[i]).find('a'); // also 'b'
    u.text('');
  }
}

The code tries to remove some buttons and div from the twitter website.

Now, when I put it on my pc nothing happens. I tried to remove the change link inside the trends box and it isn't removed.

Please help if I am doing something wrong here. Thanks.

Answer 1

At the beginning of the process_new_tweets function there's a comment explaining how the presence or absence of .mini-profile in the DOM is used as a flag.

In summary, the absence of the .mini-profile element in the DOM means that the function returns and won't proceed any further. Since the tutorial was written it would appear that Twitter no longer has a .mini-profile element anywhere in its DOM, so the function is always returning and script execution is not proceeding any further.

Remove the following lines from the beginning of the process_new_tweets function:

var mp = document.getElementsByClassName('mini-profile');
if(mp.length === 0) { return; }

And the elements that you've selected in your clean_twitter function will be removed from the DOM as expected.