what does this error message on my chrome extension, from popup.html mean and how to fix it?

Question

So as you already read in the title my problem hast todo with popup.html

I have no idea what the problem is please help me!

this is the error code

Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist. Stacktrace popup.html:0 (Anonyme Funktion)

popup.html is:

<!DOCTYPE html>
<html>
  <head>
    <style>
      #popup-container {
        width: 600px;
        height: 800px;
      }
    </style>
    <title>DissBott</title>
  </head>
  <body>
    <h1>ChatGPT Extension</h1>
    <p>input</p>
    <textarea id="input"></textarea>
    <br>
    <button id="submitButton">Submit</button>
    <button id="clearButton">Clear</button>
    <br>
    <p>Response:</p>
    <p id="response"></p>
    <script src="popup.js"></script>
  </body>
</html>

popup.js is:

// Popup Script
//background.js


const submitButton = document.getElementById("submitButton");
const clearButton = document.getElementById("clearButton");
const promptTextarea = document.getElementById("prompt");
const responseParagraph = document.getElementById("response");

submitButton.addEventListener("click", function() {
  // onClick's logic below:
  // Get the prompt from the textarea
  const prompt = input;
  // Send the message to the background script
  chrome.runtime.sendMessage({
    message: "clicked_browser_action",
    prompt: prompt
  }, function(response) {
    // Display the response
    responseParagraph.innerText = response;
  });
});

clearButton.addEventListener("click", function() {
  // Clear the textarea
  promptTextarea.value = "";
  // Clear the response
  responseParagraph.innerText = "";
});

my manifest.json


{
  "manifest_version": 3,
  "name": "DissBot",
  "description": "This is an extension that uses the ChatGPT model.",
  "version": "1.0",
  "host_permissions": [
    "https://api.openai.com/"
  ],
  "action": {
    "default_popup": "popup.html"
    },
    "background": {
     "script": ["bg.js"]
    }
}

I tried to make a chrome extension it didnt work.

Answer 1

Here is a sample of chrome.runtime.sendMessage .

manifest.json

{
  "name": "hoge",
  "version": "1.0",
  "manifest_version": 3,
  "background": {
    "service_worker": "background.js"
  },
  "action": {
    "default_popup": "popup.html"
  }
}

popup.html

<html>
  <body>
    <button id="send">Send</button>
    <script src="popup.js"></script>
  </body>
</html>

popup.js

document.getElementById("send").onclick = () => {
  chrome.runtime.sendMessage("send", (respose) => {
    console.log(respose);
  });
}

background.js

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  console.log(message);
  sendResponse("response");
  return true;
});

what does this error message on my chrome extension, from popup.html mean and how to fix it?

Question

1 answers

solution1
0 2023-01-22 04:26:48

what does this error message on my chrome extension, from popup.html mean and how to fix it?

Question

1 answers

solution1 0 2023-01-22 04:26:48

solution1
0 2023-01-22 04:26:48