Can I use Polymer 2 to expand my browser?

Question

In the browser extension, I mean WebExtension https://developer.mozilla.org/en/Add-ons/WebExtensions .

I tried to use it only for local files and got:

Access to the imported resource in the file: /// from the source "null" was blocked by the CORS policy: incorrect response. The origin of 'null' is therefore not allowed access.

WebExtension (especially for pop-up settings) does not have a specific server. Their links will be similar to chrome-extension: //pkngljipephggpkgjfkjhggmcjfmhgkn/page.html

Answer 1

Just tested and here is the answer. In the near future: yes, but with complications.

After entering only one Polymer element, I got a lot of errors: Refuse to execute the inline script because it violates the following content security policy: "script -src" self ". To enable inline execution, either the" insecure-inline "keyword is required, or hash ('sha256-AYzkEOy570v3pgwSjL36msfNQGIBNCoa6ppxJtI8Fag ='), or nonce ('nonce -...').

The requirements for the Chrome 31+ extension - so I can’t change the content security policy. I cannot use the built-in <script> tags for any templates.

So, I modified the Polymer code by moving all the built-in scripts to separate the scripts, and it worked.

Cons: I cannot automatically update the code if Polymer is updated. Every time I need to rewrite his code.

Answer 2

Vulcanize and Crisper tools can be used to troubleshoot CORS / CSP.

Detailed description here: https://www.polymer-project.org/1.0/docs/tools/optimize-for-production

Both tools have Gulp plugins, so you can script the build step as follows:

 gulp.task('vulcanize', function() { return gulp.src('index.html') .pipe(vulcanize({ inlineScripts: true, inlineCss: true })) .pipe(crisper()) .pipe(gulp.dest('popup')); });