Port error while changing chrome extension from manifest v1 to v2

While attempting to port the extension from manifest version 1 to version 2, this appeared:

Port error: Could not establish connection. Receiving end does not exist. chromeHidden.Port.dispatchOnDisconnect miscellaneous_bindings:232

This appeared in Console in developer tools. I have no idea where to start fixing this cause i don't know what's causing it to begin with..

what can cause this problem? and is there someway to know exactly what's causing it? Thanks.

The most likely cause of failure is the activation of the default Content security policy when "manifest_version": 2 is active. A consequence of the default CSP is that inline JavaScript will not be executed.

<script>chrome.extension.onConnect.addListener(...);</script>

The previous line is an example of inline code. The solution is to place the script in an external JS file:

<script src="script.js"><!--original contents moved to script.js--></script>

Background pages/scripts

When you were using background pages, do not use:

• "background_page": "background.htm", or
• "background": {"page": "background.htm"},
  but
• "background": {"scripts": ["background.js"]}
  where background.js contains the script which was initially placed within the <script> tags at background.htm.

Inline event listeners

Browser action popups, app launchers, option pages, etc. often contain inline event listeners. By the CSP, these are also forbidden.

<button onclick="test();"> does not work. The solution is to add the event in an external JS file using addEventListener. Have a look at the documentation or this answer for an example.

Other

• JavaScript creation from strings (eval, Function, setTimeout, ...) is forbidden. Rewrite your code to not create code from strings, or use the sandbox manifest option (introduced in Chrome 21). Since Chrome 22, the unsafe-eval CSP policy can be used to lift this restriction.

• JSONP does not work, because external (JavaScript) resources cannot be loaded in the extension's context. Use an ordinary XMLHttpRequest instead of JSONP (more information + example).
  The only exception is when the resource is fetched over https^{not http}. The CSP can be adjusted to introduce this exception - see documentation:

  "content_security_policy": "script-src 'self' https://example.com; object-src 'self'",
  

Official documentation

The official documentation also provides an excellent explanation on the topic, see "Tutorial: Migrate to Manifest V2".