0

I'm working on a Chrome extension's content script which displays a picture at the bottom of the screen. Right now, my code creates a div but the div isn't showing up when I run the extension.

chrome.runtime.onMessage.addListener(
function(request,sender,sendResponse) {
  if(request.requested === "createDiv"){
    //code to create div
    console.log("hello");
    debugger;
    var div = document.createElement("div");
    div.innerText = "test123";
    div.style.position : "fixed";
    div.style.bottom : "77px";
    div.src = "test.jpg";
    document.body.appendChild(div);

    sendResponse({confirmation: "job done"});
  }
});

Does anyone know why this code isn't working?

glennsl
  • 28,186
  • 12
  • 57
  • 75
Matthew Chiang
  • 1
  • 2
    Can you add the potential errors, what is the expected behavior and what is the actual behavior of your code? – Kmaschta Oct 09 '17 at 19:36
  • Please [edit] the question to be on-topic: include a [mcve] that *duplicates the problem*. For Chrome extensions or Firefox WebExtensions you almost always need to include your *manifest.json* and some of the background, content, and/or popup scripts/HTML, and often webpage HTML/scripts. Questions seeking debugging help ("why isn't my code working the way I want?") must include: (1) the desired behavior, (2) a specific problem or error and (3) the shortest code necessary to reproduce it *in the question itself*. Please also see: [What topics can I ask about here?](/help/on-topic), and [ask]. – Makyen Oct 10 '17 at 00:16
  • What *exactly* is shown in the [various appropriate consoles for your extension](https://stackoverflow.com/a/38920982/3773011) when you load and execute your extension? – Makyen Oct 10 '17 at 00:17

1 Answers1

0

Sorry about that. I'm new to posting here.

function init(){
        debugger;
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) 
    {
                chrome.tabs.sendMessage(tabs[0].id,{createDiv: {width: "100px", height: "100px", innerHTML: "Hello"}}/*from stack*/ ,function(response){
                    console.log("sent message");
            });
    });
}
document.addEventListener('DOMContentLoaded',init);

here is my popup.js. This code is supposed to display an image at the bottom of the screen when you click the browser extension. Right now, no image shows up.

I also re-edited my content.js file to '=' instead of ':' if that helps.

Matthew Chiang
  • 1