我正在尝试为基于FireFox/Gecko的浏览器做一个扩展，在chat.openai.com上添加一个上传文件按钮。当我添加我的扩展时，它只会在我刷新1聊天页面时添加按钮。如果我转到过去的聊天，它不会放入按钮。（顺便说一句，我在ChatGPT的帮助下写了这段代码，哈哈）。
manifest.json:

{
    "manifest_version": 3,
    "name": "ChatGPT File Upload",
    "version": "1.0",
    "description": "Adds a button to upload files into ChatGPT. (NOT for images, videos, Word Documents, or other non-raw-text files. Please use .txt, .js, .py, .html, .css, .json, and .csv.",
    "permissions": [
      "scripting",
      "https://chat.openai.com/*"
    ],
    "action": {
      "default_icon": {
        "128": "icon128.png",
        "256": "icon128.png"
      }
    },
    "icons": {
      "128": "icon128.png",
      "256": "icon256.png"
    },
    "content_scripts": [
      {
        "matches": ["https://chat.openai.com/*"],
        "js": ["content.js"]
      }
    ],
    "background": {
      "scripts": ["background.js"],
      "service_worker": "background.js"
    }
  }

background.js:

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    if (changeInfo.url && changeInfo.url.startsWith('https://chat.openai.com/')) {
      chrome.scripting.executeScript({
        target: { tabId: tabId },
        files: ['content.js']
      });
    }
  });

content.js:

console.log("Content script loaded.");

// This script will be injected into chat.openai.com pages
// You can add your desired functionality here
// Create the button
const button = document.createElement('button');
button.innerText = '📂 Submit File';
button.style.backgroundColor = '#35393d';
button.style.color = 'white';
button.style.padding = '5px';
button.style.border = '1px solid #6b6458';
button.style.borderRadius = '5px';
button.style.margin = '5px';
button.style.width = '180px';

// Create a container div for centering
const containerDiv = document.createElement('div');
containerDiv.style.display = 'flex';
containerDiv.style.justifyContent = 'center';

// Append the button to the container div
containerDiv.appendChild(button);

// Find the target element
const targetElement = document.querySelector("div.relative.flex.h-full.max-w-full.flex-1.overflow-hidden > div > main > div.absolute.bottom-0 > form > div > div:nth-child(1)");

// Insert the container div before the target element
targetElement.parentNode.insertBefore(containerDiv, targetElement);

// Add click event listener to the button
button.addEventListener('click', async () => {
  // Create the file input element
  const fileInput = document.createElement('input');
  fileInput.type = 'file';
  fileInput.accept = '.txt, .js, .py, .html, .css, .json, .csv';

  // Handle file selection
  fileInput.addEventListener('change', async (event) => {
    const file = event.target.files[0];
    if (file) {
      const reader = new FileReader();

      reader.onload = async (e) => {
        const fileContent = e.target.result;
        const chunkSize = 15000;
        const chunks = [];

        // Split file content into chunks
        for (let i = 0; i < fileContent.length; i += chunkSize) {
          const chunk = fileContent.slice(i, i + chunkSize);
          chunks.push(chunk);
        }

        // Submit each chunk to the conversation
        for (let i = 0; i < chunks.length; i++) {
          const chunk = chunks[i];
          const part = i + 1;
          const filename = file.name;
          await submitConversation(chunk, part, filename);
        }
      };

      reader.readAsText(file);
    }
  });

  // Trigger file input click event
  fileInput.click();
});

// Submit conversation function
async function submitConversation(text, part, filename) {
  const textarea = document.querySelector("textarea[tabindex='0']");
  const enterKeyEvent = new KeyboardEvent('keydown', {
    bubbles: true,
    cancelable: true,
    keyCode: 13,
  });
  textarea.value = `Part ${part} of ${filename}:\n\n${text}`;
  textarea.dispatchEvent(enterKeyEvent);
}

我在网上找到了不同的background.js，但似乎没有一个能解决我的问题。我对开发很陌生，所以我对这类事情基本上一无所知。