reviewdog / action-stylelint

Run stylelint with reviewdog

GitHub Action: Run stylelint with reviewdog

This action runs stylelint with reviewdog on pull requests to improve code review experience.

Inputs

fail_on_error

Whether reviewdog should fail when errors are found. [true,false] This is useful for failing CI builds in addition to adding comments when errors are found. It's the same as the -fail-on-error flag of reviewdog.

filter_mode

Optional. Reviewdog filter mode [added, diff_context, file, nofilter] It's the same as the -filter-mode flag of reviewdog.

github_token

Required. Default is ${{ github.token }}.

level

Optional. Report level for reviewdog [info,warning,error]. It's same as -level flag of reviewdog.

packages

Optional. Additional NPM packages to be installed, e.g.:

packages: 'stylelint-config-sass-guidelines stylelint-order'

reporter

Reporter of reviewdog command [github-pr-check,github-pr-review,github-check]. Default is github-pr-check. github-pr-review can use Markdown and add a link to rule page in reviewdog reports.

stylelint_input

Optional. Files or glob. Default: **/*.css. It's same as [input] of stylelint.

stylelint_config

Optional. It's same as --config flag of stylelint.

workdir

Optional. The directory from which to look for and run stylelint. Default '.'

Example usage

You also need to install stylelint.

# Example
$ npm install stylelint stylelint-config-recommended -D

You can create stylelint config and this action uses that config too.

.github/workflows/reviewdog.yml

name: reviewdog
on: [pull_request]
jobs:
  stylelint:
    name: runner / stylelint
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: stylelint
        uses: reviewdog/action-stylelint@v1
        with:
          reporter: github-pr-review # Change reporter.
          stylelint_input: '**/*.css'

action-stylelint's Issues

multiple lint runners

I'd love to be able to do something like the following as we are transitioning to TailwindCss.

name: stylelint
on: [pull_request]
jobs:
  stylelint:
    name: runner / stylelint
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: 'stylelint tailwind'
        uses: reviewdog/action-stylelint@v1
        with:
          github_token: ${{ secrets.github_token }}
          stylelint_input: 'src/**/*.tw.{css,scss}'
  stylelint-themed:
    needs: stylelint
    name: runner / stylelint / themed
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: 'stylelint react-themed'
        uses: reviewdog/action-stylelint@v1
        with:
          github_token: ${{ secrets.github_token }}
          stylelint_input: 'src/**/_home.{css,scss}'

Unfortunately when I add a file in each input that I know will fail, I do not get all failures. Instead, whatever runner runs last trumps the first and only reports the errors from the one runner and not both. When I only run one of these at a time, it does what it's supposed to.

Example:

These are errors from stylelint tailwind

I also get the errors I should for stylelint react-themed, but they never show up in the report. Here is the file that I've forced to have errors:

Is this something that can be adjusted with action-stylelint here or is this a restriction of reviewdog itself?

Only github-pr-review works

If you don't use github-pr-review you get routed to https://github.com/reviewdog/action-stylelint/blob/v1.14.0/script.sh#L34. This doesn't format as JSON so I suspect reviewdog cannot read it. I don't understand why we have the conditional logic here so not sure how to fix this.

Wrong version in marketplace

Only 1.0.0 and 1.0.1 are in the marketplace. I saw the same with the eslint action.

support npm v9

related: reviewdog/action-eslint#152

Question | How to specify number of changed lines in diff_context

Hi, I've searched the whole documentation but can't figure how to specify the no of lines for the diff_context, or is this even possible: changed lines +-N lines (N=3 for example). https://github.com/reviewdog/reviewdog#diff_context

This is not working for me:

 - name: stylelint
        uses: reviewdog/action-stylelint@v1
        with:
          github_token: ${{ secrets.github_token }}
          filter_mode: diff_context(5)
          reporter: github-pr-review 
          workdir: "./app/"
          stylelint_input: "**/*.scss"

Failed to parse stylelint diff due to 401 (unauthorized)

We currently run a custom stylelint and eslint setup and I'm looking into a reviewdog replacement to surface errors as PR comments. Github claims that API will come more easily at some point, but until then, plugins I seek.

I have the token all setup (as without the Github token, I expectantly get "no token provided" errors) but once the token is added, and reviewdog-stylelint runs I get this:

I'm a touch lost here as to what besides the token reviewdog might be hitting authentication problems with. Any help here would be appreciated!

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

This repository currently has no open or pending branches.

Detected dependencies

github-actions

.github/workflows/depup.yml

• actions/checkout v4
• haya14busa/action-depup v1
• peter-evans/create-pull-request v6

.github/workflows/release.yml

• actions/checkout v4
• haya14busa/action-bumpr v1
• haya14busa/action-update-semver v1
• haya14busa/action-cond v1
• actions/checkout v4
• haya14busa/action-bumpr v1

.github/workflows/reviewdog.yml

• actions/checkout v4
• actions/setup-node v4

.github/workflows/update_semver.yml

• actions/checkout v4
• haya14busa/action-update-semver v1

npm

package.json

• stylelint ^16.0.0
• stylelint-config-recommended ^14.0.0

testdata-subproject/package.json

• stylelint ^16.0.0
• stylelint-config-recommended ^14.0.0

---

• Check this box to trigger a request for Renovate to run again on this repository

Ancient lockfile -> ENOENT -> stylelint not found

Trying to get setup with a basic configuration and the Action fails with:

Is this an issue on my end?

Our config:

name: Stylelint

on:
  pull_request:

jobs:
  stylelint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: reviewdog/action-stylelint@v1
        with:
          level: warning
          fail_on_error: true
          stylelint_input: "**/*.scss"
          stylelint_config: frontend/.stylelintrc

Node 12 SyntaxError

Hello,

i tried to run this action on self-hosted ARM64 runner with Node 12 installed.

After run, got this error

I read something about optional chaining and discovered, it is not supported in node 12.

Are there any plans to support node 12 in this action ?

Thanks.

Unable to lint only specific files

Currently it is possible to lint only one file or glob match. Is it possible to add support for custom list of files to be linted? It should be only matter of removing quotes from stylelint first argument.

Input which does lint successfully:

with:
    github_token: ***
    stylelint_input: src/scss/bootstrap-ext/_input-group.scss src/scss/bootstrap-ext/_tables.scss
    stylelint_config: .stylelintrc.json
    level: warning
    reporter: github-check
    name: stylelint
    workdir: .

Using input like this works:

with:
    github_token: ***
    stylelint_input: src/scss/bootstrap-ext/_input-group.scss
    stylelint_config: .stylelintrc.json
    level: warning
    reporter: github-check
    name: stylelint
    workdir: .

Failed to unmarshal rdjson on version 1.20.0

After upgrading to version 1.20.0 we have started to receive:

reviewdog: parse error: failed to unmarshal rdjson (DiagnosticResult): proto: syntax error (line 2:1): unexpected token

reviewdog: PullRequest needs 'git' command: failed to run 'git rev-parse --show-prefix': exit status 128

Until yesterday It runs successfully, but getting the above error when trying to run reviewdog in github actions.

  stylelint:
    name: runner / stylelint
    runs-on: ubuntu-latest
    timeout-minutes: 10
    steps:
      - name: Use Node.js
        uses: actions/setup-node@v1
        with:
          node-version: '14.x'
      - uses: actions/checkout@v2
      - name: Get npm cache directory
        id: npm-cache-dir
        run: |
          echo "::set-output name=dir::$(npm config get cache)"
      - uses: actions/cache@v2
        id: npm-cache # use this to check for `cache-hit` ==> if: steps.npm-cache.outputs.cache-hit != 'true'
        with:
          path: ${{ steps.npm-cache-dir.outputs.dir }}
          key: ${{ runner.os }}-node-hoge-ci-reviewdog-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-hoge-ci-reviewdog-
      - name: Install depencies
        run: |
          npm install
      - name: Stylelint review
        uses: reviewdog/action-stylelint@v1
        with:
          reporter: github-pr-review
          stylelint_input: './**/*.scss'
          filter_mode: file
          fail_on_error: true
          github_token: ${{ secrets.github_token }}

support --ignore-path option

https://github.com/stylelint/stylelint/blob/master/docs/user-guide/ignore-code.md#files-entirely

It would be great if this action supports --ignore-path option as well. stylelint by default checks .stylelintignore, but I'd like to use .gitignore instead.

Action Required: Fix Renovate Configuration

There is an error with this repository's Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.

Error type: undefined. Note: this is a nested preset so please contact the preset author if you are unable to fix it yourself.

Failed run ci in action github

Hello everyone, I have a question.

We are receiving this error in our company's action, and apparently we have not made any changes.

Is there anything we can do to solve it? We temporarily fixed the version at 1.18.1 and it is correct, but in the last version it does not work, always generating this error.

in action code:

    - name: Run reviewdog stylelint
        uses: reviewdog/action-stylelint@v1
        with:
          github_token: ****
          reporter: github-pr-check
          filter_mode: nofilter
          stylelint_input: src/**
          fail_on_error: true

Stylelint not found

I have setup a workflow using the example. When the workflow executes I get this message:

/entrypoint.sh: line 11: /github/workspace/node_modules/.bin/stylelint: not found
/entrypoint.sh: line 15: /github/workspace/node_modules/.bin/stylelint: not found

I have tried adding an npm install command into the step to install dependencies but when it runs, stylelint is not found. Have I missed something here?

Here's my workflow file:

name: reviewdog

on: [pull_request]

jobs:

  stylelint:
    name: runner / stylelint
    runs-on: ubuntu-latest
    steps:
      - uses: actions/setup-node@v1
      - name: depencies
        run: npm install -g stylelint stylelint-scss stylelint-order stylelint-selector-bem-pattern
      - name: stylelint
        uses: reviewdog/action-stylelint@v1
        with:
          github_token: ${{ secrets.github_token }}
          reporter: github-pr-review
          stylelint_input: 'web/app/Components/**/*.scss'

Reporter creates cross-product of style lint JSON errors

I think there is a bug in the reporter if you lint more than one file?

action-stylelint/entrypoint.sh

Lines 15 to 17 in f40371a

	$(npm bin)/stylelint "${INPUT_STYLELINT_INPUT:-'**/*.css'}" --config="${INPUT_STYLELINT_CONFIG}" -f json \
	| jq -r '{source: .[].source, warnings:.[].warnings[]} | "\(.source):\(.warnings.line):\(.warnings.column):\(.warnings.severity): \(.warnings.text) [\(.warnings.rule)](https://stylelint.io/user-guide/rules/\(.warnings.rule))"' \
	| reviewdog -efm="%f:%l:%c:%t%*[^:]: %m" -name="stylelint" -reporter=github-pr-review -level="${INPUT_LEVEL}"

The jq expression jq -r '{source: .[].source, warnings:.[]}' takes the cross product of all files and all lints. stylelint does have a unix formatter, though that doesn't include the level of the error, which you might want.

E.g.

$ node_modules/.bin/stylelint --fix ./foundation/ -f json | jq -r '{source: .[].source, warnings:.[].warnings[]}'

{
  "source": "<redacted>/foundation/_fonts.scss",
  "warnings": {
    "line": 86,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_fonts.scss",
  "warnings": {
    "line": 96,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_fonts.scss",
  "warnings": {
    "line": 252,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_fonts.scss",
  "warnings": {
    "line": 262,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_fonts.scss",
  "warnings": {
    "line": 281,
    "column": 17,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_index.scss",
  "warnings": {
    "line": 86,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_index.scss",
  "warnings": {
    "line": 96,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_index.scss",
  "warnings": {
    "line": 252,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_index.scss",
  "warnings": {
    "line": 262,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_index.scss",
  "warnings": {
    "line": 281,
    "column": 17,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_mixins.scss",
  "warnings": {
    "line": 86,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_mixins.scss",
  "warnings": {
    "line": 96,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_mixins.scss",
  "warnings": {
    "line": 252,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_mixins.scss",
  "warnings": {
    "line": 262,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_mixins.scss",
  "warnings": {
    "line": 281,
    "column": 17,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_variables.scss",
  "warnings": {
    "line": 86,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_variables.scss",
  "warnings": {
    "line": 96,
    "column": 5,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_variables.scss",
  "warnings": {
    "line": 252,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_variables.scss",
  "warnings": {
    "line": 262,
    "column": 9,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}
{
  "source": "<redacted>/foundation/_variables.scss",
  "warnings": {
    "line": 281,
    "column": 17,
    "rule": "plugin/no-unsupported-browser-features",
    "severity": "warning",
    "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
  }
}

vs:

$ node_modules/.bin/stylelint --fix ./foundation/ -f json | jq -r '.'

[
  {
    "source": "<redacted>/foundation/_fonts.scss",
    "deprecations": [],
    "invalidOptionWarnings": [],
    "parseErrors": [],
    "errored": false,
    "warnings": []
  },
  {
    "source": "<redacted>/foundation/_index.scss",
    "deprecations": [],
    "invalidOptionWarnings": [],
    "parseErrors": [],
    "errored": false,
    "warnings": [
      {
        "line": 86,
        "column": 5,
        "rule": "plugin/no-unsupported-browser-features",
        "severity": "warning",
        "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
      },
      {
        "line": 96,
        "column": 5,
        "rule": "plugin/no-unsupported-browser-features",
        "severity": "warning",
        "text": "Unexpected browser feature \"css-mixblendmode\" is not supported by Edge 17,18 and only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
      },
      {
        "line": 252,
        "column": 9,
        "rule": "plugin/no-unsupported-browser-features",
        "severity": "warning",
        "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
      },
      {
        "line": 262,
        "column": 9,
        "rule": "plugin/no-unsupported-browser-features",
        "severity": "warning",
        "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
      },
      {
        "line": 281,
        "column": 17,
        "rule": "plugin/no-unsupported-browser-features",
        "severity": "warning",
        "text": "Unexpected browser feature \"css-gradients\" is only partially supported by Safari 12,13,12.1, iOS Safari 13,12.0-12.1,12.2-12.3 (plugin/no-unsupported-browser-features)"
      }
    ]
  },
  {
    "source": "<redacted>/foundation/_mixins.scss",
    "deprecations": [],
    "invalidOptionWarnings": [],
    "parseErrors": [],
    "errored": false,
    "warnings": []
  },
  {
    "source": "<redacted>/foundation/_variables.scss",
    "deprecations": [],
    "invalidOptionWarnings": [],
    "parseErrors": [],
    "errored": false,
    "warnings": []
  }
]

Receiving `unmarshal rdjson` error in Github action CI

Run reviewdog/action-stylelint@v1
Run $GITHUB_ACTION_PATH/script.sh
 Installing reviewdog 🐶 ... https://github.com/reviewdog/reviewdog
16.2.1
stylelint version: 16.2.1
 Running stylelint with reviewdog 🐶 ...
  reviewdog: parse error: failed to unmarshal rdjson (DiagnosticResult): proto: syntax error (line 1:3946): invalid escape code "\\." in string
Error: Process completed with exit code 1.