Chrome says my content script isn't UTF-8

Question

Receiving the error Could not load file 'worker.js' for content script. It isn't UTF-8 encoded.

> file -I chrome/worker.js
chrome/worker.js: text/plain; charset=utf-8

With to-utf8-unix

> to-utf8-unix chrome/worker.js                                      
chrome/worker.js
----------------
Detected charset:
UTF-8
Confidence of charset detection:
100
Result:
Conversion not needed.
----------------

I also tried converting the file with Sublime Text back and forth without any luck.

manifest:

  "content_scripts": [{
      "matches": ["http://foo.com/*"],
      "js": ["worker.js"]
  }],

The file in question: https://www.dropbox.com/s/kcv23ooh06wlxg3/worker.js?dl=1

It is a compiled javascript file spit out from clojurescript with cljsbuild:

               {:id "chrome-worker"
                :source-paths ["src/chrome/worker"],
                :compiler {:output-to "chrome/worker.js",
                           :optimizations :simple,
                           :pretty-print false}}
               ]}

Other files (options page, background) are compiled the same way and don't generate this error. I tried getting rid of weird characters like Emojis but that didn't fix the problem.

Answer 1

It turns out this is a problem within the google closure compiler that clojurescript uses to generate javascript - https://github.com/google/closure-compiler/issues/1704

A workaround is to set compilation to "US-ASCII"

:closure-output-charset "US-ASCII"

Thanks a to to pesterhazy from the clojurians slack for helping with this!

Answer 2

In case you are using Webpack you can solve it by replacing the default minifier Uglify with Terser, which won´t produce those encoding issues.

in your webpack.conf.js add

const TerserPlugin = require('terser-webpack-plugin');

// add this into your config object
optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin({
        parallel: true,
        terserOptions: {
          ecma: 6,
          output: { 
             ascii_only: true 
          },
        },
      }),
    ],
  },