Andrey  Lovyagin
Andrey Lovyagin

Reputation: 19

Chrome extension. JS works on popup window and not on main window

So, I have trouble. I am making a chrome extension, I have popup.html (window with credits), content.js, background.js (that works on click). Main trouble is that when I click on icon of extension background.js getting that I clicked it and starts working on popup page and not on the page I needed. I've tried to make it in popup.js, but same thing, it is working in popup.html page and not on the main page. How to change js code?

Main part of content.js:

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    if( request.message === "clicked_browser_action" ) {
        var name = window.location.href;
        subject = name.substr(name.indexOf("/",1)+2,name.indexOf("-",1)-name.indexOf("/",1)-2);
        exam = name.substr(name.indexOf("-",1)+1,name.indexOf(".",1)-name.indexOf("-",1)-1);
        myLoop();
    }
  }
);


background.js:

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    var activeTab = tabs[0];
    chrome.tabs.sendMessage(activeTab.id, {"message": "clicked_browser_action"});
  });
});

Upvotes: 1

Views: 822

Answers (1)

woxxom
woxxom

Reputation: 73856

Sounds like you include content.js in popup.html. This is wrong. Content scripts are for web pages but the browser_action (or page_action) popup is an extension page with its own chrome-extension:// URL, DOM, window, document. In Chrome browser you can inspect it by right-clicking inside the popup, then clicking "inspect". See also How to access the webpage DOM?

Solution:

  • remove content.js from popup.html
  • write a separate popup.js
  • since chrome.browserAction.onClicked won't work when you have a popup you'll also move its contents into popup.js so it'll run each time the popup is shown

popup.html:

<script src=popup.js></script>

popup.js:

// this will run every time the popup is shown
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
  var activeTab = tabs[0];
  chrome.tabs.sendMessage(activeTab.id, {"message": "clicked_browser_action"});
});

Upvotes: 1

Related Questions