title: Sending messages from devtools panel to new tab in Chrome extensions
body: <p>I should send data from my devtools panel to tab. When I send a message using chrome.tabs.sendMessage, why is it not received?</p>
  
  <p>panel.js</p>
  
  <pre><code>$(".options").on("submit", "form", function(e) {
    e.preventDefault();
    newTabPort = chrome.runtime.connect({ name: "new tab" });
    newTabPort.postMessage($(this).serializeArray());
  });
  </code></pre>
  
  <p>background.js</p>
  
  <pre><code>chrome.runtime.onConnect.addListener(function(port) {
    port.onMessage.addListener(function(message) {
      console.log(message);
    });
  
    if (port.name == "new tab") {
      chrome.tabs.create({'url': chrome.extension.getURL('page/request_sending_page.html')}, function(tab) {});
      chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
        var activeTab = tabs[0];
        chrome.tabs.sendMessage(activeTab.id, {message: "olololololololo"});
      });
    }
  });
  </code></pre>
  
  <p>my_extension_page.js</p>
  
  <pre><code>chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    $("body").append("Hello world &lt;br&gt;");
    $("body").append(request.message);
  });
  </code></pre>
  
  <p>Thank you!</p>