javascript - Creating a Chrome Extension that has button links to websites -
i've written code extension should launch given websites , html file when launched works properly; however, when click on extension, buttons not anything.
<!doctype html> <html> <head> <title>google apps launcher</title> <script src="popup.js"></script> </head> <body> <h1>google apps launcher</h1> <form> <input type="button" value="gmail" onclick="window.location.href='https://www.gmail.com'"> <input type="button" value="google drive" onclick="window.location.href='https://drive.google.com/drive/u/0/'"> <input type="button" value="google calendar" onclick="window.location.href='https://calendar.google.com/calendar/render#main_7'"> <input type="button" value="google docs" onclick="window.location.href='https://docs.google.com/document/u/0/'"> <form/> </body> </html>
first off, please learn how learning how debug extension popups. involves right-clicking button , selecting inspect popup.
if that, first thing you'll see along lines:
refused execute inline script because violates following content security policy directive: "script-src 'self' chrome-extension-resource:". either 'unsafe-inline' keyword, hash ('sha256-...'), or nonce ('nonce-...') required enable inline execution.
that's because chrome's restrictive content security policy extensions doesn't allow setting click handlers string of text in html itself. see onclick within chrome extension not working more information.
furtherfore, handlers try achieve? if click on in popup window, window
refers popup itself. doubt want load said sites in popup itself, want open new tab instead. don't think can navigate popup window external website.
you presented choice in fixing this:
the path of least resistance use pure html links instead of js:
<a href="https://www.gmail.com" target="_blank">gmail</a>
you style
<a>
element wish - can look button.if want
<input type="button">
elements, need follow standard procedure usingaddeventlistener
"click"
events inpopup.js
. see csp documentation ,onclick
question linked above - code in the other answer.you'll want use
chrome.tabs.create
instead open links in new tabs, example:chrome.tabs.create({url: "https://gmail.com"});
see question: open new tab without losing popup focus.
Comments
Post a Comment