Chrome says my content script isn't UTF-8 - google-chrome-extension

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.

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
},
},
}),
],
},

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!

Had this error get thrown after editing working source code in WordPad. When I saved the file in WordPad, the encoding was lost. To fix it, open the same file in NotePad, Save as, and specify "UTF-8" in the Encoding drop down menu next to the save button.

In case anyone has this issue with Parcel, just add a .terserrc file with this content.
{
"ecma": 6,
"output": {
"ascii_only": true
}
}
This is an adaptation of #marian-klühspies response https://stackoverflow.com/a/58528858/2920671

Related

How to to globally disable E501 in VSCODE and pylama

I am using Visual Studio Code and pylama linter.
Currently I am added # noqa to every long line to avoid the following linter message:
line too long (100 > 79 characters) [pycodestyle]pylama(E501)
I've added "--disable=E501" to VSCODE's workspace settings.json file as shown below:
{
"editor.tabSize": 2,
"editor.detectIndentation": false,
"python.linting.enabled": true,
"python.linting.pylintEnabled": false,
"python.linting.flake8Enabled": false,
"python.linting.pycodestyleEnabled": false,
"python.linting.pylamaEnabled": true,
"[python]": {
"editor.tabSize": 4
},
"python.linting.pylama": [
"--disable=E501"
]
}
but still I get E501.
How can I disable E501 in my VSCODE workspace for good?
For other linters, the .settings file seems to be looking for
python.linting.<linter>Args
so I recommend trying:
"python.linting.pylamaArgs": [
"--ignore=E501"
]
or potentially
python.linting.pylamaArgs": ["--disable=E501"]
See also: https://code.visualstudio.com/docs/python/settings-reference#_pylama
that seems to suggest the same:
pylamaArgs [] Additional arguments for pylama, where each top-level element that's separated by a space is a separate item in the list.

ESlint override rule by nested directory

I want to disable rule for all files inside nested directory. I found examples only for exact path or by file extension. But it is not what I want.
We use it for shared config and don't know where this directory will be. We have many of them.
I'm trying config like this:
{
overrides: [
{
files: [
'**/test/**/*',
],
rules: {
"import/no-extraneous-dependencies": "off"
}
},
],
}
But glob like **/test/**/* and many others didn't not work.
Can someone help to reach this goal?
The above code should work.
How were you testing this? If it's an extension like VSCode you may need to refresh things to see latest definitions loaded.
If you are using a eslint service like esprint you will also need to restart it to grab latest definitions.
Caching
Make sure that eslint is not configured to cache results to avoid having to cache bust when debugging things. eslint docs
Here's an example for a react-native app with multiple overrides
module.exports = {
...baseConfig,
overrides: [
typescriptOverrides,
e2eOverrides,
themeOverrides,
{
files: ['**/*.style.js'],
rules: {
'sort-keys': [
'error',
'asc',
{
caseSensitive: true,
natural: true,
},
],
},
},
{
files: ['**/*.test.js'],
rules: {
'arrow-body-style': 'off',
},
},
],
};
Debugging the glob matcher
Run eslint in debug mode and see all the files being run example DEBUG=eslint:cli-engine npx eslint src/**/*.test.js
You can test your glob patterns by running a ls command. Example: ls ./src/**/*.test.js will either return all the files or 'no matches found'.

Suppressing nightwatchjs warnings in terminal output

I'm using nightwatchjs to run my test suite, and I would like to remove the warning messages being outputted to my terminal display.
At the moment, I'm getting loads of these (admittedly genuine) warning messages whilst my scripts are running and it's making the reading of the results harder and harder.
As an example;
Yes they are valid messages, but it's not often possible for me to uniquely pick out each individual element and I'm not interested in them for my output.
So, I'd like to know how I can stop them from being reported in my terminal.
Below is what I've tried so far in my nightwatch.conf.js config file;
desiredCapabilities: {
browserName: 'chrome',
javascriptEnabled : true,
acceptSslCerts: true,
acceptInscureCerts: true,
chromeOptions : {
args: [
'--ignore-certificate-errors',
'--allow-running-insecure-content',
'--disable-web-security',
'--disable-infobars',
'--disable-popup-blocking',
'--disable-notifications',
'--log-level=3'],
prefs: {
'profile.managed_default_content_settings.popups' : 1,
'profile.managed_default_content_settings.notifications' : 1
},
},
},
},
but it's still displaying the warnings.
Any help on this would be really appreciated.
Many thanks.
You can try setting detailed_output property to false in the configuration file. This should stop these details from printing in the console.
You can find a sample config file here.
You can find relevant details available under Output Settings section of official docs here.
Update 1: This looks like a combo of properties which controls this and the below combo works for me.
live_output: false,
silent: true,
output: true,
detailed_output: false,
disable_error_log: false,

Eslint expected indentation of 1 tab but found 4 spaces error

I am using VScode with latest version of Eslint. It is my first time using a linter.
I keep getting this linting error when using a tab as indentation:
severity: 'Error'
message: 'Expected indentation of 1 tab but found 4 spaces. (indent)'
at: '4,5'
source: 'eslint'
Here is my config file
{
"env": {
"browser": true,
"commonjs": true,
"es6": true,
"node": true
},
"extends": "eslint:recommended",
"rules": {
"indent": [
"error",
"tab"
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"single"
],
"semi": [
"error",
"always"
]
}
}
I don't understand why this error is being thrown as I indicated tabs for indentation. It is obviously calculating my 1 tab as 4 spaced but I don't understand why it is doing that when I am pressing tab for indentation.
update: The reason is because in VScode using ctrl + shift + i to beautify code will actually use spaces and not tabs. That is the reason.
Try to disable indent inside .eslintrc.js file
rules: {
'indent': 'off'
}
this works fine for me
In VSCODE, go to menu:
File / Preferences / Settings then Text Editor (or just search for 'tab' in the search settings box)
Then remove the tick from the following settings:
Insert Spaces
Detect Indentation
Also to auto format the document with the default VSCode keyboard shortcut use:
Shift+Alt+f
If you use both eslint and prettier, don't disable indent by using {'indent': 'off'} in rules object. To ensure the consistency of your code style, you have to use this rule.
Solution:
This issue is probably happened because of eslint & prettier conflict.
Try to play with different options of eslint in .eslintrc file.
If you hover the error lines in vsCode, at the end of error description you can click on that link to see eslint docs.
For example, in case of indent docs is in this link:
Eslint Indent Docs
For me, error resolved by adding this line (for ternary expressions):
...
rules: {
indent: [
'error',
2,
{
SwitchCase: 1,
ignoredNodes: ['ConditionalExpression'], <-- I add this line
},
],
...
You can also try flatTernaryExpressions or offsetTernaryExpressions for ternary expressions.
You can automaticaly fix the problems with
npm run lint -- --fix
I used VScode to solve this problem. All you have to do is hold the mouse over the part where there is an error.
and...
Wee, that exactly what it says. You have in your config "indent": [ "error", "tab" ], So it expects tab as indent. But found in your file 4 spaces. Remove spaces and put tab in you file
I had a similar problem and solved with this code:
rules: {
...
indent: [2, "tab"],
"no-tabs": 0,
...
}
change "editor.tabSize": 4
to "editor.tabSize": 2 in VS Code Settings
If you are using VSCODE follow the next steps.
Access the settings by clicking: code > preferences > settings, as shown in the following image.
In the settings, click: Text Editor after that, uncheck the Insert Space option and the Detect Indentation option as shown in the following image.
Restart VSCODE and your dev server.
There was a conflict between plugins in my example. I'm using eslint version 8.24.0. To fix, i just removed the rule plugin:prettier/recommended and added prettier at last position from extends as explained in eslint-config-prettier documentation. See: https://github.com/prettier/eslint-config-prettier#arrow-body-style-and-prefer-arrow-callback
Before:
"extends": [
"eslint:recommended",
"plugin:#typescript-eslint/recommended",
"plugin:prettier/recommended",
"plugin:storybook/recommended",
]
After:
"extends": [
"eslint:recommended",
"plugin:#typescript-eslint/recommended",
"plugin:storybook/recommended",
"prettier"
]
I was having the same problem and I solved my problem with documentation. Instead of disabling eslint indent, you can add it as shown in the documentation.
Docs
Simple:
rules: {
indent: ['error', 2, { "MemberExpression": 1 }],
}
In file
settings.json
remove this line if have:
"editor.defaultFormatter": "esbenp.prettier-vscode",
eslint conflict with prettier
It worked for me, if error is coming then just solve it line by line simply in your code,
like :
1.)Expected indentation of 2 spaces but found 8 -> then put only 2 spaces from the starting of the line
2.)Unexpected tab character -> don't use tabs, use spaces
3.)Trailing spaces not allowed -> don't give any spaces after lines end.
4.)Missing space before value for key 'name' -> put 1 space after ":" in object value
5.)A space is required after ',' -> put 1 space after "," in parameter of the function
6.)Opening curly brace does not appear on the same line as controlling statement -> just put the opening curly brace where function starts in the same line
7.)Closing curly brace should be on the same line as opening curly brace or on the line after the previous block -> put the closing curly brace just below where the function starts.
Please add the below comment at the first line of the JS file that you are customizing.
/* eslint-disable */

Durandal.js optimizer generating empty main-built.js

I am trying to optimize my Durandal app but the main-built.js is blank.
I have tried running node r.js -o app.build.js and this threw an error saying that it could not find a file. I added these paths in my main.js file and each individual error went away. However, now the command above just exits with "Tracing dependencies for: durnadal/amd/almond.custom" and the file is still blank.
Question: Which libraries need to go into the paths below? It seems to the external libraries that I use in my index.html and it needs the exact file name?
require.config({
paths: {
"text": "durandal/amd/text",
"breeze": "lib/breeze/breeze.min",
"knockout": "lib/knockout/knockout.mapping-latest",
}
});
When I run Optimizer.exe in the Durandal AMD folder main-built.js is blank. This is the app.build.js file that is generated - any help appreciated on how to get more verbose logging with Almond. I have tried optimizer -verbose true with no luck.
{
"name": "durandal/amd/almond-custom",
"inlineText": true,
"stubModules": [
"durandal/amd/text"
],
"paths": {
"text": "durandal/amd/text"
},
"baseUrl": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App",
"mainConfigFile": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App\\main.js",
"include": [
"text!about.html",
"about",
"appNavigation",
"config",
"text!dareAdd.html",
"dareAdd",
"text!dareDetail.html",
"dareDetail",
"text!dareList.html",
"dareList",
"text!dareListItem.html",
"dataContext",
"dataService",
"dataServiceHelper",
"enums",
"errorWatcher",
"text!home.html",
"home",
"text!index.html",
"text!indextopcoat.html",
"indextopcoat",
"text!kendoIndex.html",
"text!loader.html",
"logger",
"text!login.html",
"login",
"main-built",
"main",
"text!menu.html",
"model",
"text!navbar.html",
"text!notifyOfError.html",
"notifyOfError",
"text!privacy.html",
"privacy",
"text!profile.html",
"profile",
"text!shell.html",
"shell",
"text!signup.html",
"signup",
"text!testpage.html",
"testpage",
"uiutilities",
"userState",
"viewModelHelper",
"text!walkthrough.html",
"walkthrough",
"widgetService",
"css/telerik/js/kendo.dataviz.min",
"css/topcoat/js/hello",
"css/topcoat/js/hello.min",
"css/topcoat/js/index",
"css/topcoat/lib/hello",
"css/topcoat/lib/vendor/ender.min",
"css/topcoat/lib/vendor/fastclick",
"durandal/app",
"durandal/composition",
"durandal/events",
"durandal/http",
"text!durandal/messageBox.html",
"durandal/messageBox",
"durandal/modalDialog",
"durandal/system",
"durandal/viewEngine",
"durandal/viewLocator",
"durandal/viewModel",
"durandal/viewModelBinder",
"durandal/widget",
"durandal/plugins/router",
"durandal/transitions/entrance",
"js/cordova",
"js/facebookscript",
"lib/bootstrap/bootstrap",
"lib/bootstrap/bootstrap.min",
"lib/breeze/breeze.debug",
"lib/breeze/breeze.intellisense",
"lib/breeze/breeze.min",
"lib/breeze/q",
"lib/breeze/q.min",
"lib/jquery/jquery-2.0.3.intellisense",
"lib/jquery/jquery-2.0.3",
"lib/jquery/jquery-2.0.3.min",
"lib/knockout/knockout-2.3.0.debug",
"lib/knockout/knockout-2.3.0",
"lib/knockout/knockout.mapping-latest.debug",
"lib/knockout/knockout.mapping-latest",
"lib/knockout/knockout.validation.debug",
"lib/knockout/knockout.validation",
"lib/moment/moment",
"lib/moment/moment.min",
"lib/ratchet/ratchet",
"lib/sammy/sammy-0.7.4",
"lib/sammy/sammy-0.7.4.min",
"lib/toastr/toastr",
"lib/toastr/toastr.min"
],
"exclude": [],
"keepBuildDir": true,
"optimize": "uglify2",
"out": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App\\main-built.js",
"pragmas": {
"build": true
},
"wrap": true,
"insertRequire": [
"main"
]
}
In your path you are setting your reference to knockout equal to the mapping plugin, which is no bueno.
As shown in this answer, Durandal.js optimizer not working (empty main-built.js) you can run it like Rainer shows and you should see a more specific error.
One thing that I found - if you remove a view model or use a folder or directory as a purgatory (about to be deleted) those files may not be used in your app but if they are in the file structure they will still be evaluated by the optimizer.
EDIT
Check here for more info on the optimizer - Tracking down optimizer issues in durandal.js
Also, are you building debug or release? Are you targeting the correct one? durandal optimizer references wrong path when building it as a post build process in Visual Studio
Also, if you are referencing Knockout.js, I think you mean to reference "lib/knockout/knockout-2.3.0" not the knockout mapping plugin.
Unless I am missing something you shouldn't have to add those paths to your main.js file. Breeze and Knockout should be referenced already. Depending on your project type, your editor, etc... it is probably bundled in your App.Start folder under DurandalBundleConfig. If it is not then are you just referencing the libraries from your index.html?
Move them into the bundle config if that is the case (something like this) -
bundles.Add(
new ScriptBundle("~/scripts/vendor")
.Include("~/Scripts/jquery-{version}.js")
.Include("~/Scripts/jquery-ui-{version}.min.js")
.Include("~/Scripts/knockout-{version}.js")
.Include("~/Scripts/sammy-{version}.js")
.Include("~/Scripts/bootstrap.min.js")
.Include("~/Scripts/knockout-bootstrap.min.js")
.Include("~/Scripts/Q.js")
.Include("~/Scripts/breeze.debug.js")
);
Note that you need to load Q prior to Breeze, as Breeze depends on Q.

Resources