Firing click event from script content - chrome extension

Question

In my contents of the chrome script extension, I click on certain links / buttons on web pages from specific sites. For this, I use the following code in the script content (I embed jQuery in the script content):

$(css_selector).trigger("click") 

This works on most sites.

However, on some sites, such as delta.com, match.com, and paypal.com, this method of triggering an item click does not work. On delta.com, I get the following exception that occurred while trying to run a script in the content:

 Error: An attempt was made to reference a Node in a context where it does not exist. Error: NotFoundError: DOM Exception 8 

The strange thing is that if I open javascript consoleon delta.com, turn on jQuery and try the same piece of code to run the code, it works.

On match.com and paypal.com, the trigger simply does not work in the content script, and there is no error. I can't even fire the click event through the javascript console like I did on delta.com.

If I manually use the mouse click, everything works fine on all three sites. So I also tried to simulate this use of mousedown (), mouseup (), but that didn't work either.

This seems to be a problem because javascripts from these sites capture and ignore events. I tried reading the code from these sites to see what was happening, but there was too much code.

Does anyone have an idea of ​​what's going on here and how to fix it?

Answer 1

Due to the extension of the browser sandbox and the basic jQuery functionality, you cannot trigger a click event without jQuery using trigger or click .

However, you can call the method of the raw click DOM element, which will act just as if the element were clicked. Just use [0] to access the DOM element:

 $(css_selector)[0].click(); 

Although you rarely need it, you can run all the relevant buttons using the same code in each . Since this in each is a DOM element, it is pretty simple:

 $(css_selector).each(function(){ this.click(); }); 

Answer 2

The jQuery click trigger function does not start the non-jQuery DOM (jsfiddle.net/k2W6M).

The jQuery documentation should really point to this fact. I am sure that more than a few people have gone wild pursuit of this.

I struggled with this problem for several days, trying to call the onclick handler via the link with .click () and .trigger ("click"), all in vain while I saw this.

To get the full answer to this question, sending a MouseEvent element has the same effect as clicking an element. The following code worked for me and should work when trying to click an element / link on a page from the contents of the script:

 $(css_selector)[0].dispatchEvent(new MouseEvent("click")) 

Answer 3

content_script is executed in the sandbox, see https://developer.chrome.com/extensions/content_scripts

However, content scripts have some limitations. They can not:

• Use variables or functions defined by their extension pages
• Use variables or functions defined by web pages or other content scripts.

---

$ in content_script cannot access $ on the webpage, but the event data is stored inside $, so we cannot run it.

 // taken from jQuery#1.11.2 from line4571, trigger method ... // jQuery handler handle = ( jQuery._data( cur, "events" ) || {} )[ event.type ] && jQuery._data( cur, "handle" ); if ( handle ) { handle.apply( cur, data ); } // Native handler handle = ontype && cur[ ontype ];