Is it possible to use Polymer 2 for building browser extention?

By browser extension I mean WebExtension https://developer.mozilla.org/ru/Add-ons/WebExtensions.

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

Access to Imported resource at 'file:///' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access.

WebExtension (especially for popup of settings) don't have specific server. Their links will be like chrome-extension://pkngljipephggpkgjfkjhggmcjfmhgkn/page.html

Answers:

Answer

Vulcanize and Crisper tools can be used to workaround the CORS/CSP issues.

Lot's of how-to details 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 like this:

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

Updated answer after year of production

I used Polymer 1 and Polymer 3. For both you need to create whole building ecosystem. In case of Polymer 3 it is very very difficult due to WRONG! documentation for polymer-build (don't read documentation, read source code directly)


Just tested and here is answer. Shortly: yes, but with complications.

After inserting only one Polymer element I got many errors: Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-AYzkEOy570v3pgwSjL36msfNQGIBNCoa6ppxJtI8Fag='), or a nonce ('nonce-...') is required to enable inline execution.

In requirements to extension Chrome 31+ - so I cannot change content security policy. I cannot use inline <script> tags for any templates.

So I modified code of Polymer by moving all inline scripts to separate scripts and it's worked.

Cons: I cannot make automatic update of code if Polymer will be updated. Each time I need to rewrite it's code.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.