`Tslint --fix` does not autofix but instead generates lint problems as console errors - tslint

I'm using the Angular starter kit
and I'm trying to get tslint to autofix all my lint problems with the --fix flag.
I'm running the script:
npm run tslint --fix src/**/*.ts
It just generates the same error that I'm already being told about in tslint and not autofixing it:
console output:
ERROR: src/app/app-routing.module.ts[10, 5]: comment must start with a space
ERROR: src/app/app-routing.module.ts[2, 20]: Too many spaces before 'from'
Am I missing something that allows it to implement the changes?
My versions are:
"tslint": "^5.6.0"
"codelyzer": "^3.1.2"
Question: How can I get tslint to implement autofix to my lint errors?

Unfortunately, not all linting violations are auto-fixable. You can see which rules are auto-fixable here by looking for the Has Fixer tag.
My guess is that "comment must start with a space" is governed by the comment-format rule, which is not auto-fixable.
I'm not sure which rule is causing your second error, but it is most likely also not auto-fixable.
Here's a snippet you can run tslint --fix against to verify that some violations are fixed, and others are not.
//no var keyword (comment does not start with space)
var x: string = 'x';
console.log(x);
// array-type
let y: String[] = [];
console.log(y);
// ban-single-arg-parens
['1', '2'].filter((arg) => {
console.log(arg);
});
// semicolon
let z: string = ''
console.log(z);
// no unused variable
let a: string = '';
// trailing comma
let list = ['1', '2', ];
// missing trailing comma
let obj = [
1,
2
];
Rules to include when linting the above file:
"semicolon": [true, "always"],
"trailing-comma": [true, {"multiline": "always", "singleline": "never"}],
"array-type": [true, "array-generic"],
"arrow-parens": [true, "ban-single-arg-parens"],
It's tempting to think that all whitespace errors would be auto-fixable, and perhaps they should be. Sadly, they're not.

Update library tslint and codelyzer to latest.
and then use this command:
tslint --fix src/**/*.ts -t verbose without using npm run
after complete, it will show to you the unfixable problems so you have to fix it manually.
You can also add it to scripts in package.json like this:
"lint-fix": "tslint --fix src/**/*.ts -t verbose"

Related

YAML indenting with neovim and treesitter?

I've recently upgraded to neovim 0.5.0, and I've been experimenting at replacing older syntax and indenting plugins with treesitter. I'm having some problems getting things to work correctly when editing YAML files.
I have the following in my init.lua file:
local ts = require 'nvim-treesitter.configs'
ts.setup {ensure_installed = 'maintained',
highlight = {
enable = true,
additional_vim_regex_highlighting = false,
},
indent = {
enable = true,
disable = {"python", }
},
}
Running :checkhealth reports
health#nvim_treesitter#check
========================================================================
[...]
## Parser/Features H L F I J
[...]
- yaml ✓ ✓ ✓ ✓ ✓
But when I create a YAML file, for example...
- hosts: foo<RETURN>
...then the cursor ends up at column 0 on the following line, rather
than indented as required. This behaviors persists for the rest of the
file: regardless of the YAML syntax, the cursor always goes to column 0
on return
I know that treesitter indent support is considered "experimental". Is
this just broken right now, or do I have something misconfigured?
Looks like the YAML parser's indentations are pretty rudimentary: https://github.com/nvim-treesitter/nvim-treesitter/blob/master/queries/yaml/indents.scm
You may have a better development experience by just disabling tree-sitter indentation for just yaml and using the default Vim regex indentation instead.
In your nvim-treesitter config
require('nvim-treesitter.configs').setup {
indent = {
enable = true,
disable = { 'yaml' }
}
}

jest: output only ASCII characters in the reports

On a clean node project with Jest 24.9.0, this test suite
test('a test', () => {
expect('foo').toBe('foo');
});
test('b test', () => {
throw 'foo';
});
outputs the following (abbreviated):
√ a test
× b test (1ms)
● b test
The non-ASCII characters, especially the bullet, cause a significant slow-down in an Emacs buffer on Windows 10.
How can I instruct Jest to output only ASCII characters in its decorations?
Jest documentation is silent on the issue; grepping node_modules folder for these characters turned out nothing promising (directly related to Jest).
I tried various reporters, but not to my satisfaction. It's easiest to simply filter the report:
package.json
{
"scripts": {
"test": "jestwrapper"
}
}
bin/jestwrapper
#!/usr/bin/bash
jest 2>&1 | perl -C -Mutf8 -lpe'tr/√✔✓✘✕●/+++xx-/'

TSlint: 'let' and 'const' triggers forbidden 'var' keyword error

I'm running TSLint (v5.3.2) with my typescript project. I'm getting Forbidden 'var' keyword, use 'let' or 'const' instead but I'm not using 'var' and it points to my use of 'let' or 'const'.
For example, here's a codeFrame format of the error to show I'm using 'const' and not 'var':
Forbidden 'var' keyword, use 'let' or 'const' instead (no-var-keyword)
58 | .map((response) => {
59 | // update the login status
> 60 | const tokensValid = response['isvalid'] === true;
| ^
61 | if (tokensValid) {
62 | this.loggedIn$.next(true);
63 | return true;
So far I haven't been able to figure out why I'm getting this error. Any ideas?
Thanks.
Turns out to be an issue with yarn 1.1.0. Downgraded to yarn 1.0.1 and tslint started passing again. Have not determine exactly what changed between the two versions that caused the issue.
Just encountered this problem with webpack, tslint-loader and awesome-typescript-loader. I solved it by doing this (simplified):
module: {
rules: [
{
test: /\.tsx?$/,
enforce: 'pre', // this little bugger
loader: 'tslint-loader',
},
{
test: /\.tsx?$/,
use: ['awesome-typescript-loader'],
},
],
},
This seems to be an error with TSlint itself. I would recommend you to deactivate this rule on the tslint.json config and see if it works.
{
"rules": {
"no-var-keyword": true
}
}
In case it does not work it might be an error with your IDE or something. Hope this helps you out.
Adding npx to the command did the trick for me:
npx tslint -c tslint.json -p tsconfig.json
(Using Yarn 1.16.0)

Mocha test failing using babel and webpack

So I am using webpack, babel, and mocha here. When I have code like this:
import userImage from '../../images/user.png';
and I build with webpack, userImage results in a string to the path of the file since I am using the file loader for images (requirements call for me not to embed images) however when I try to run my mocha tests using:
./node_modules/.bin/babel-node ./node_modules/.bin/babel-istanbul cover ./node_modules/.bin/_mocha
I get a syntax error:
SyntaxError: /repositories/react-seed/web/app/images/user.png: Unexpected character '�' (1:0)
> 1 | �PNG
| ^
2 |
3 |
I also get this error when removing istanbul. So it seems like it is trying to load the actually image file however can parse it as JavaScript since it is not.
Anyone know a way around this issue?
You can use the --compilers option which allows you to customize the nodejs require system in order to let it understand png files. So :
mocha --compilers png:./mochacfg.js
Or create a file 'test/mocha.opts' containing (better for your needs):
--compilers png:./mochacfg.js
With ./mochacfg.js:
require.extensions['.png'] = function(){ return null; }
This ignores png files (should be ok if you do nothing special with them).
If you want to do something with the image data:
var fs = require('fs');
require.extensions['.png'] = function(module, filepath) {
var src = fs.readFileSync(filepath).toString ('base64');
return module._compile('module.exports = "data:image/png;base64,' + src + '";');
}
Its quite late to answer this question but just for knowledge sharing purpose, I am answering another approach to do this.
Create a test-config.js file and use it while running the mocha test cases.
var jsdom = require('jsdom').jsdom;
process.env.NODE_ENV = 'test';
// -------------------------------
// Disable webpack-specific features for tests since
// Mocha doesn't know what to do with them.
['.css', '.scss', '.png', '.jpg'].forEach(ext => {
require.extensions[ext] = () => null;
});
and inside package.json use this test command to run the test cases
"test": "mocha ./test/test-setup.js './test/**/*.spec.js' --compilers js:babel-core/register",
I hope it helps someone.

`Invalid mapping` error trying to use babel require hook and polyfill with react jsx transpile

I'm trying to use babel for both ES6 and JSX transpilation for mocha tests.
Suppose we have test.jsx like this:
var React = require("react");
React.createClass({
render: function(){
return (<div>Hello World</div>);
}
});
Running babel test.jsx gives us valid transformed code. No problem.
I would expect that if I create a test.js file like this:
require("babel/register");
require("./test.jsx");
And then run node test.js, it would transpile my jsx for me in line, but instead I get an error:
c:\Users\user\dev\app\node_modules\babel\node_modules\babel-core\lib\babel\t
ransformation\file\index.js:628
throw err;
^
Error: c:/Users/user/dev/app/test.jsx: Invalid mapping: {"generated":{"line"
:6,"column":11},"source":"c:/Users/user/dev/app/test.jsx","name":null}
at SourceMapGenerator_validateMapping [as _validateMapping] (c:/Users/user/dev/app/node_modules\babel\node_modules\source-map\lib\source-map\source-map-
generator.js:275:15)
at SourceMapGenerator_addMapping [as addMapping] (c:/Users/user/dev/app/
node_modules\babel\node_modules\source-map\lib\source-map\source-map-generator.j
s:105:14)
at SourceMap.mark (c:/Users/user/dev/app/node_modules\babel\node_modules
\babel-core\lib\babel\generation\source-map.js:65:9)
at CodeGenerator.print (c:/Users/user/dev/app/node_modules\babel\node_mo
dules\babel-core\lib\babel\generation\index.js:236:16)
at NodePrinter.plain (c:/Users/user/dev/app/node_modules\babel\node_modu
les\babel-core\lib\babel\generation\node\printer.js:16:27)
at CodeGenerator.ReturnStatement (c:/Users/user/dev/app/node_modules\bab
el\node_modules\babel-core\lib\babel\generation\generators\statements.js:120:13)
at CodeGenerator.print c:/Users/user/dev/app/node_modules\babel\node_mo
dules\babel-core\lib\babel\generation\index.js:238:22)
at NodePrinter.plain (c:/Users/user/dev/app/node_modules\babel\node_modu
les\babel-core\lib\babel\generation\node\printer.js:16:27)
at CodeGenerator.printJoin (c:/Users/user/dev/app/node_modules\babel\nod
e_modules\babel-core\lib\babel\generation\index.js:286:13)
at NodePrinter.sequence (c:/Users/user/dev/app/node_modules\babel\node_m
odul
es\babel-core\lib\babel\generation\node\printer.js:23:27)
According to the docs, it looks like this should work. Am I missing something obvious, or should I report this as a bug in babel?
This was a bug in acorn-jsx, the JSX parser that Babel uses. The recommended fix would be:
rm -rf node_modules/babel && npm install

Resources