Search code examples
javascriptgoogle-chrome-extension

How to get the FB post link through javascript?


I am trying to make a chrome extension which requires me to collect the post links. But the problem with collecting the link is that it is available on the anchor tag on the timestamp that FB provides over each post.

enter image description here

But the href of the anchor tag is populated dynamically when you hover over the element. I tried dispatching a mouseover and mouseenter events on the element but the href is still not populated.

My function :

const hoverOverTag =  (element) => {
  var event = new Event('mouseover', {
  'view': window,
  'bubbles': true,
  'cancelable': true
});


element.addEventListener('mouseover', function(e) {
     console.log("hover");
     console.log(e);
});

 element.dispatchEvent(event);

}

The event listener runs and logs the event properly. But still href does not get populated. I am running this in a content script, is there any way i can get the post link ?


Solution

  • In the following I will describe my method I followed to tackle the issue, the findings and a solution that worked for me.

    After loading the Facebook page, I used the Google Chrome Development Tools to inspect the <a> element.

    Then I added an XHR/fetch Breakpoint on any XHR or fetch. Then hovered the mouse to trigger the event and immediately the code was interrupted and the stopped at the breakpoint.

    After following the code it became clear that the front-end retrieve the post-id of dynamically by sending an Ajax request to the API node /bulk-route-definitions/ at Facebook. Although it is theoretically possible to get the post-id by manually calling that API node with the correct request header data, pursuing that potential solution is simply too time consuming because of all security/privacy protection Facebook currently employs.

    Right after that I started looking at triggering the event programmatically as mentioned in the question above, so I triggered the breakpoint again and checked the call stack and reverse followed the obfuscated and uglified code.

    Eventually I found it:

    var event = new FocusEvent('focusin', {
      'view': window,
      'bubbles': true,
      'cancelable': true
    });
    
    the_a_element.dispatchEvent(event); //reference to the_a_element in the page DOM
    

    Done.