wikimedia/grunt-stylelint

Invisible text in terminal output

machal opened this issue · 40 comments

Runnig grunt stylelint on my collegue's MacOS Terminal ends with empty output:

image

Output isn't invisible – copying and pasting into text editor doesn't make text visible.

Another Grunt tasks are doing well.

Collegue runs MacOS Sierra. On my El Capitan and another collegue's Windows machines works everything well.

We use grunt-stylelint 0.7.0 and stylelint-config-standard 16.0.0: https://github.com/stylelint/stylelint-config-standard

{
  "extends": "stylelint-config-standard",
  "rules": {
    "indentation": 2,
    "number-leading-zero": "never",
    "selector-pseudo-element-colon-notation": "single",
    "unit-whitelist": ["em", "rem", "%", "px", "vw", "vh"],
    "rule-empty-line-before": null,
    "block-closing-brace-empty-line-before": null,
    "max-empty-lines": 2,
    "declaration-empty-line-before": "never",
    "at-rule-empty-line-before": ["always", {
      "except": ["after-same-name", "first-nested"]
    }]
  }
}

That's profoundly odd. I've never seen that issue myself, I'm afraid.

ntwb commented

It's not just the terminals color settings is it? Via Settings -> Preferences, or in the bash profile by chance is it?

Closing this as no further information has been provided for the last 6+ months.

@rettgerst commented on #58:

node v9.6.1
grunt-cli v1.2.0
grunt v1.0.2
stylelint 9.1.1
grunt-stylelint 0.9.0

@tenub commented on #58:

Same issue here, using iTerm2 on macOS 10.13.2 and the same versions as above (except node 9.7.1).

Also happens in Wikimedia's Jenkins instance:

screen shot 2018-03-20 at 15 56 02

Also suffering this problem in mac OS under iTerm or the default mac terminal.

I have this same issue in Ubuntu. Even when setting a output file in .stylelintrc options - the file that is written has all these dots.

I've been experiencing the same issue both locally and in our CI environments. I've been playing around with the lockfile and it seems as if table (which is used by stylelint) has lodash@4.17.5 set as a dependency instead of being a requirement, then the log output from the lint task is readable. Otherwise the log output is similar to what's described in the comments above. This does not make sense to me.
grunt-legacy-log@1.0.1 upped its lodash dependency to 4.17.5 about 25 days ago, could this be related?

@mickelus did you find any combination of versions of grunt-stylelint and stylelint that made it work?

axten commented

same problem here...
this is not caused by mac os, iTerm, stylelint or grunt-stylelint versions as i have multiple working copies on my machine with stylelint 8.2 and grunt-stylelint 0.9 and just the one i initialized (npm install) today has this error.

doing npm install with an old package-lock.json fixed the error so the bug is dependency related.

I'm using grunt-stylelint@0.9.0 and stylelint@8.4.0 in both the setup that works and in the one that doesn't work. In my setup stylelint@8.4.0 depends on table@4.0.2 which then depends on lodash@4.17.5. If the lodash dependency is deduped then the error output from stylelint becomes unreadable.

@mickelus sorry but I still don't quite understand how you make it work and the output is readable...
To me 'it works' means the grunt task works and outputs correctly.
What package do we have to lock down? (stylelint@8.4.0 > table@4.0.2 > lodash@x.x.x)
I understood it is that lodash, but to what version do we have to lock it so that grunt-stylelint works and the output is readable?

+1 Also experiencing this problem.

Hey all, sorry about the slow response. This seems to be caused by lodash's latest release, 4.17.5 –upstream stylelint depends on ^4.17.4 which works fine, but the latest point release indeeds seems to break the world.

Above is a quick hack that I've added to pin to 4.17.4 so that things go back to working, but obviously this is unsatisfactory. I'll get it fixed and pushed out in a quick release here, but really this needs properly fixing – just not in a way that breaks downstream users of the tool whilst we figure that out. :-)

[Credit to @mickelus and @gugol2 for finding the culprit so I could confirm and hack around it. Thank you!]

OK, v0.10.0 now released. Hope this works for everyone.

ntwb commented

Thanks @jdforrester were you able to determine what exactly broke in the Lodash change between 4.17.4 and 4.17.5?

Happy to help if its something @stylelint can fix I can push out a patch release also pinning Lodash to 4.17.4 or fix the underlying issue if its a change stylelint needs to make due to a Lodash API change we've missed etc etc

@ntwb Not yet, sadly; I was thinking I'd poke into it tomorrow. Is there an issue in the stylelint repo for this, or should I make one?

ntwb commented

There's no issue, feel free to create one and we can go from there 👍

ntwb commented

I've just started testing this and the grunt-stylelint 0.10.0 release hasn't fixed this issue.

I've created a new stylelint branch with a commit pinning Lodash to 4.17.4 and this also hasn't resolved the issue for me: stylelint/stylelint@27c9816

To test the above branch/commit add the following to your package.json file:

  • "stylelint": "git://github.com/stylelint/stylelint.git#27c98164102fec3666715791715e18c870974d12"

Running npm list --depth=1 should reveal:

├─┬ stylelint@9.2.0 (git://github.com/stylelint/stylelint.git#27c98164102fec3666715791715e18c870974d12)
...
...
│ ├── lodash@4.17.4

I'll continue digging and report back if I find anything new

I confirm that the grunt-stylelint 0.10.0 release hasn't fixed this issue.

ntwb commented

Here's what I've just discovered:

grunt-stylelint - Latest version: 0.10.0
stylelint - Latest version: 9.2.0
stylelint-config-wordpress - Latest version: 13.0.0

This configuration works perfectly for me: (Latest stylelint + latest grunt-stylelint)

"grunt-stylelint": "~0.10.0",
"stylelint": "~9.2.0",
"stylelint-config-wordpress": "~11.0.0"
grunt stylelint
Running "stylelint:css" (stylelint) task
>> Linted 2 files without errors

Running "stylelint:scss" (stylelint) task
>> Linted 2 files without errors

Done.

Once I update stylelint-config-wordpress to 12.0.0 I get:

grunt stylelint
Running "stylelint:css" (stylelint) task

src/templates/default/css/bbpress.css
  ... ..  .  ...                      ...           
      .   .                                         
          .                                         
  ... ..  .  ...                      ...           
      .   .                                         
          .

✖ 2 problems

Warning: Task "stylelint:css" failed. Use --force to continue.

Aborted due to warnings.

Once I update stylelint-config-wordpress to 13.0.0 I get:
(I've truncated the paste below, the original paste is ~1000 lines)

grunt stylelint
Running "stylelint:css" (stylelint) task

src/includes/admin/assets/css/admin.css
 ... ..  .  ...                                                                               ...                                          
     .   .                                                                                                                                 
         .                                                                                                                                 

...
 ... ..  .  ...                                                                               ...                                          
     .   .                                                                                                                                 
         .                                                                                                                                 

src/templates/default/css/bbpress.css
  ... ..  .  ...                                                                                     ...                                   
      .   .                                                                                                                                
          .                                                                                                                                
...
  ... ..  .  ...                                                                                     ...                                   
      .   .                                                                                                                                
          .

✖ 327 problems

Warning: Task "stylelint:css" failed. Use --force to continue.

Aborted due to warnings.
ntwb commented

Using the latest versions of the following packages:

grunt-stylelint - Latest version: 0.10.0
stylelint - Latest version: 9.2.0
stylelint-config-wordpress - Latest version: 13.0.0
stylelint-config-recommended - Latest version: 2.1.0

And removing the following rules from the following packages:

  • stylelint-config-wordpress

    • "selector-pseudo-element-colon-notation": "double",
  • stylelint-config-recommended

    • "block-no-empty": true,
    • "font-family-no-missing-generic-family-keyword": true,
    • "no-descending-specificity": true,

If any one of the above 4 rules are added back it triggers the error.

Results in:

 grunt stylelint
Running "stylelint:css" (stylelint) task
>> Linted 2 files without errors

Running "stylelint:scss" (stylelint) task
>> Linted 2 files without errors

Done.

There is either a race condition somewhere, or the above 4 rules have changed in some way that is not immediately obvious (to me at least)

cc @jeddy3

ntwb commented

Can others who have this issue please respond with a couple of things please:

  1. What stylelint config do you use? e.g stylelint-config-wordpress
  2. By removing these 4 rules does the issue no longer reproducible?
  • block-no-empty
  • font-family-no-missing-generic-family-keyword
  • no-descending-specificity
  • selector-pseudo-element-colon-notation

Very odd.

above 4 rules have changed in some way that is not immediately obvious (to me at least)

font-family-no-missing-generic-family-keyword was last modified 4 months ago, and the other rules 9 months ago.

Can others who have this issue please respond with a couple of things please:

Good idea. Hopefully, more data points will help narrow down where the problem is.

I think for all people the issue is only present when there are errors. By disabling those 4 rules, @ntwb's output goes from Failure to Success. Which stops the 'dotted output' from showing.

ntwb commented

Latest updates:

  • It's not the rules as I suggested above, it is a grunt-stylelint issue

  • When using a custom formatter e.g. https://github.com/Dreamseer/stylelint-formatter-pretty#grunt-stylelint everything works as expected, with warnings/errors correctly reported, the warning/errors I see are from the 4 rules I mentioned above 🤦‍♂️ . Basically grunt-stylelint is in someway mangling the formatting output.

  • Checking out this repo into node_modules/grunt-stylelint the issue remains, if I run npm install from inside that directory the issue is resolved.

Now to work out why....

axten commented

please reopen this ticket...
the bug is not fixed and all of our new projects struggeling with this bug.
are there any updates?

ntwb commented

I've just spent another hour trying to resolve this and nothing much to report

Switching the default formatter from string to json works

Testing the string formatter in stylelint directly also works.

In the screenshot below, running grunt stylelint using the latest stylelint and latest shared config versions at the top is grunt-stylelint v0.4.0 (not a typo, v0.4.0) and at the bottom v0.3.0

v0.3.0...v0.4.0

ivsjcayj0x

I'm not sure whats going on, not sure why I had to incrementally go from v0.10.0 to v0.3.0 to find a version of grunt-stylelint the rendered any errors correctly to the terminal /shrug

If anyone else has any ideas or scenarios to explore I'm willing to have a go but right at this moment I'm out of ideas :(

axten commented

So i made a minimal setup to test how to fix it...
first target was the lodash version and I get it to work by simple adding "lodash": "4.17.4" as a top level dependency in my test project.
boom! this seems to be a workaround for now!

so digging deeper by diffing the package-lock file:
packages "postcss-reporter", "postcss-sorting", "stylelint", "stylelint-order", "table" had changed from lodash 4.17.5 to 4.17.4, so they are the suspects.

then I reverted the changes to have the broken setup again. After testing each package separately against lodash 4.17.4, the winner is "table"!

to sum up: stylelint has a dependency to "table" and if "table" uses lodash 4.17.5 this error occurs.
so now the question is.... how to fix that?

ntwb commented

FYI: This grunt-stylelint repo does not include a package-lock.json file so that cannot be relied upon, it is also only a local package-lock.json file to your existing repo checkout.

I'vee created #65 to address the above

ntwb commented

Awesome @axten 👍

to sum up: stylelint has a dependency to "table" and if "table" uses lodash 4.17.5 this error occurs. so now the question is.... how to fix that?

table currently uses ^4.17.5 semver for lodash which makes this difficult, the best fix I'm guessing would be to find the regression (if it was a regression) in lodash v4.17.5 from v4.17.4.... Easier said that done I'm guessing

axten commented

so some possible paths are:

  • open issue at "stylelint" and figure out how table is used there
  • open issue at "table" and ask for new release with pinned lodash to 4.17.4
  • find out how "table" uses lodash and create an issue at "lodash"
ntwb commented

Indeed @axten, any and all of those options are available, I think it would help if we could help the upstream repos reproduce the issue, that way we can add some tests to hopefully prevent future occurrences of this issue.

p.s. I'm on the stylelint team, if need be I'll create a new release pinning lodash 4.17.4 if we can make that work, at the moment I'm not sure that would work.

axten commented

I think pinning lodash at stylelint will not fix that issue, so i think the fastest way to fix is:
find out how "table" uses lodash (which functions), compare with lodash changelog and create an issue at "lodash"
but I'm now out of time

axten commented

So I digged a bit deeper ... and now I'm totally confused...
so "table" uses lodash _.truncate for every cell and that returns always "..." no matter what cell content is passed...
but after dumping _.truncate function to console, it's clear that this is not the lodash truncate function but the one from "underscore.string" 😳😳😳
so someone overrides the lodash function with underscore...

axten commented

... and the winner is: "grunt-legacy-log" 🏆

https://github.com/gruntjs/grunt-legacy-log/blob/master/index.js#L20-L21

it overrides lodash string functions with underscore string functions... great idea 👊
but that modifies lodash for all packages using the same version.

https://github.com/gruntjs/grunt-legacy-log/blob/master/CHANGELOG#L1-L4

grunt-legacy-log was running on an old lodash version so luckily no other package was influenced by this overrides ... until they updated to newest lodash version on 2018-03-01 💣

Wow. Nice digging!

axten commented

grunt-legacy-log landed a new release so this should be finally fixed!
Try

rm package-lock.json ### or yarn.lock
rm -rf node_modules
npm install

to fix this in an already set up working copy.