Loading a local HTML file with javascript files - google-chrome-extension

Question

I'm building my first chrome extension, and I'm running into a very basic problem.
My extension has a background script running all the time, that redirects the url of a webpage to a local web page if certain conditions are met.
chrome.tabs.update(e.tabId,
{url: "popup.html"});
Popup.html is loaded into the tab. This works fine, but I want to include some javascript in popup.html.
I'm able to include a popup.js file, but trying document.addEventListener doesn't work, because document is null.
Also, when I try to include jquery.js, I get
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".
I tried updating the manifest file properties to this, but it didn't seem to help:
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["background.js", "jquery.min.js", "popup.js"]
}
],
"permissions": [
"tabs", "http://*/*", "https://*/*",
"webNavigation"
],
"background": {
"scripts": ["background.js", "popup.js", "jquery.min.js"]
}
I looked into this document http://developer.chrome.com/stable/extensions/contentSecurityPolicy.html but it didn't have any solution. Any ideas?

Answer 1

I, that error says you are running a inline script directly in a tag in your HTML document, or in a event handler like onclick="myCode();". Content Security Policy prevent you to do so.
I don't know if it's you who wrote that script, or if it is some external framework. Nevertheless, you should assure you don't have inline code in popup.html, or you should relax your Content Security Policy allowing inline scripts with 'unsafe-inline'.
Remember that when relaxing security policy, you are relaxing SECURITY, and your code is more vulnerable to attacks. Do it with debug purpose, but try to remove it from your release version.