1

So I was working on basic example and here is my requirement for chrome extension : The extension should be able to read the data from webpage and display it on the popup when icon clicked upon.

I have these files - manifest.json , popup.html , background.js , content.js , webPage.html (this is html file stored at my local machine and data is to be read from this page)

manifest.json 

{
          "name": "Test",
          "version": "1.0",
          "description": "Testing",
          "permissions": ["file:///A:/Study/TestExt/webp.html"],
           "content_scripts": [
            {
              "matches": ["file:///A:/Study/TestExt/webp.html"],
              "js": ["content.js"]
            }
          ],
          "background": {
            "persistent": true,
            "scripts": ["background.js"]
          },
          "browser_action": {
              "default_title": "Test",
              "default_icon": "icon.png",
              "default_popup": "popup.html"

          },
          "manifest_version": 2
        }

popup.html 

<html>

            <head>
             <script src= "background.js"></script>  
            </head>

            <body>

              <p id="writeWord"></p>

            </body>

            </html>

webp.html 

<html>

            <body>
            <div >

            <p id="readWord">WordToBeRead</p>

            </div>

            </body>

        </html>

content.js 

var innerText = document.getElementById("readWord").innerHTML;

            var k = new Object();
            k.textWord = innerText;

            chrome.runtime.sendMessage(k, function(response) {
                console.log("hello");
            });

background.js 

chrome.runtime.onMessage.addListener(
          function(request, sender, sendResponse) {
            console.log(sender.tab ?
                        "from a content script:" + sender.tab.url :
                        "from the extension");
            if (request.textWord == "WordToBeRead")

            document.getElementById("writeWord").innerHTML = request.textWord;
          });

So ideally when I click on extension icon I should get popup with word "WordToBeRead" but I am getting only empty popup. I can't figure it out where exactly I am going wrong.

jCoder
  • 41
  • 2
  • 8
  • Using the same script for a background script and for your popup is a bad idea. These should be two separate scripts. – Makyen Mar 20 '17 at 05:42
  • What *exactly* is shown in the [various appropriate consoles for your extension](http://stackoverflow.com/a/38920982/3773011) when you load and execute your extension? – Makyen Mar 20 '17 at 05:45
  • Your content script sends a message immediately upon loading. It is not possible for your popup to be open at that time, thus it is not possible for your popup to receive the message. You will need the content script to either store the data in `storage.local` or wait to receive a message requesting the data from the popup, and then send it as a response. – Makyen Mar 20 '17 at 05:49

0 Answers0