Accesing a webpage's on-click events inside a chrome popup extension

24 Views Asked by At

I am trying to create a chrome extension that should be able to track any click events on the current webpage (outside of the extension). I have tried adding event listeners and content-scripts, but I can only access click events within the extension and not outside of it. Is there any way to do this?

This is my manifest file:

{
    "manifest_version": 3,
    "name": "Your Extension",
    "version": "1.0",
    "permissions": [
      "activeTab",
      "tabs"
    ],
    "browser_action": {
      "default_popup": "popup.html"
    },
    "content_scripts": [
      {
        "matches": ["<all_urls>"],
        "js": ["content.js"],
        "run_at": "document_start" 
      }
    ]
  }

My popup.html:

<!-- popup.html -->
<!DOCTYPE html>
<html>
<head>
  <title>Popup</title>
  <script src="content.js"></script>
</head>
<body id="your-popup-id">
    <span>This is my popup extension</span>  
</body>
</html>

My content.js file:

window.addEventListener('click', myClickListener, true);

function myClickListener(e) {
    alert("You clicked on " + e.target);
}

The alert fires whenever I click inside the popup extension, but it doesn't fire when I click outside of it within the current tab. The popup extension either closes or does nothing even if open.

I have tried a couple of answers from stackoverflow, but haven't gotten anywhere with this.

Any help would be appreciated.

0

There are 0 best solutions below