I have developed a Chrome extension On Chrome everything works as I expect

I am now trying to migrate the extension to Firefox

It tells me that the developed extension is compatible with Firefox (I used this link https://www.extensiontest.com/)

However, I have some problems I have a devtools_script ("VariableGrid.js") which sends messages to the ContentScript via chrome.tabs.query

chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
chrome.tabs.sendMessage(chrome.devtools.inspectedWindow.tabId, { from: "FromExample", message: "MessageExample" }, (response) => {
......
});
});

My ContentScript replies to the message like this

chrome.runtime.onMessage.addListener(
(request, sender, sendResponse) => {
......
});

On Firefox chrome.tabs is undefined I tried using browser.tabs but it's the same

I read that tabs can only be used on background script

Why does this work on my Chrome extension and not on Firefox?

If I tried to move that piece of code to the background script I would still have a problem:

chrome.devtools.inspectedWindow.tabId is undefined

my Manifest is like this

 {
  "browser_specific_settings": {
    "gecko": {
      "id": "addon@example.com",
      "strict_min_version": "42.0"
    }
  },
  "name": "xxxx",
  "description": "xxxx",  
  "version": "0.0.0.1",
  "browser_action": {
      "default_popup": "Popup.html"
  },
  "manifest_version": 2,
  "background": {
    "scripts":["jquery.min.js", "background.js"],
    "persistent": true
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["jquery.min.js", "Content.js"]
    }
  ],  
  "web_accessible_resources": [
    "Content.js"
  ],
  "devtools_page": "Devtools.html",
  "permissions": [
    "webRequest",
    "webRequestBlocking",
        "tabs",
        "activeTab",
        "notifications",
        "storage",
        "http://*/",
        "https://*/",
        "<all_urls>"
  ]
}