Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ci(lint): Replace deprecated Stylelint Github formatter with a Github problem matcher. #112

Merged
merged 9 commits into from
Nov 25, 2024

Conversation

junhaoliao
Copy link
Collaborator

@junhaoliao junhaoliao commented Nov 4, 2024

References

See #110 .

Description

  1. Add custom Stylelint problem matcher.
  2. Update lint:ci script in package.json.

Validation performed

  1. Created a test branch from the this PR source branch.
  2. Made violations in the code.
  3. Created a PR to junhaoliao's fork's main branch and observed the workflow ran and the errors were labelled inline: https://github.com/junhaoliao/yscope-log-viewer/pull/11/files

Summary by CodeRabbit

  • New Features

    • Introduced a Stylelint problem matcher configuration for improved error reporting.
  • Improvements

    • Enhanced linting workflow to better integrate Stylelint output into GitHub Actions.
    • Streamlined linting command in the package configuration to run all checks collectively.

These updates aim to improve the efficiency and clarity of style issue identification within the codebase.


Copy link

coderabbitai bot commented Nov 4, 2024

Walkthrough

This pull request introduces a new JSON configuration file for Stylelint problem matching, modifies the GitHub Actions workflow for linting to integrate this matcher, and simplifies the linting command in the package.json. The new configuration allows Stylelint's output to be interpreted correctly, enhancing the reporting of style issues. The workflow changes include setting up and tearing down the problem matcher, while the package.json updates streamline the linting process by consolidating lint checks.

Changes

File Path Change Summary
.github/problem-matchers/stylelint.json Added a new JSON file for Stylelint problem matching, defining patterns for error message interpretation.
.github/workflows/lint.yaml Modified the workflow to include a step for setting up and removing the Stylelint Problem Matcher, and updated the linting command to disable ANSI colors.
package.json Updated the lint:ci script to run all lint checks in sequence without specifying individual tasks.

Possibly related PRs


📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between c684c88 and 32d5ba5.

📒 Files selected for processing (1)
  • .github/workflows/lint.yaml (2 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • .github/workflows/lint.yaml

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@junhaoliao
Copy link
Collaborator Author

@coderabbitai review

Copy link

coderabbitai bot commented Nov 10, 2024

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Outside diff range and nitpick comments (2)
.github/workflows/lint.yaml (1)

34-38: Consider adding error handling for the lint script

While the setup is good, consider adding error handling to ensure the script fails gracefully and provides clear error messages.

 - name: "Run `lint:ci` script."
   run: |-
     # Disable ANSI color codes in Stylelint default "string" formatter
     export NO_COLOR=1
-    npm run lint:ci
+    npm run lint:ci || {
+      echo "::error::Linting failed. Please check the logs above for details."
+      exit 1
+    }
package.json (1)

14-14: LGTM! The change aligns with the new problem matcher approach.

The simplified lint:ci command works well with the new Stylelint problem matcher configuration, removing the need for specific formatters.

Consider reusing the existing lint:check script to avoid potential maintenance issues:

-    "lint:ci": "npm-run-all --sequential --continue-on-error lint:check:*",
+    "lint:ci": "npm run lint:check",

This would ensure both commands stay in sync if the lint checks are modified in the future.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 4c69bc1 and 598af7a.

📒 Files selected for processing (3)
  • .github/problem-matchers/stylelint.json (1 hunks)
  • .github/workflows/lint.yaml (1 hunks)
  • package.json (1 hunks)
✅ Files skipped from review due to trivial changes (1)
  • .github/problem-matchers/stylelint.json
🔇 Additional comments (2)
.github/workflows/lint.yaml (2)

39-41: Well-implemented cleanup step!

The cleanup step is properly configured with if: always() to ensure the problem matcher is removed regardless of the linting outcome. This is excellent practice for maintaining a clean GitHub Actions environment.


32-33: Verify the existence of the problem matcher JSON file

The step assumes the existence of .github/problem-matchers/stylelint.json. Let's verify this dependency.

✅ Verification successful

Problem matcher JSON file exists and is properly formatted

The .github/problem-matchers/stylelint.json file exists and contains a valid problem matcher configuration with proper regex patterns for parsing Stylelint output. The file structure follows GitHub Actions' problem matcher schema.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the existence and validity of the Stylelint problem matcher JSON file

# Test: Check if the file exists and is valid JSON
if [ -f ".github/problem-matchers/stylelint.json" ]; then
  echo "File exists. Validating JSON..."
  jq '.' .github/problem-matchers/stylelint.json
else
  echo "ERROR: Problem matcher JSON file not found!"
  exit 1
fi

Length of output: 550

Copy link
Contributor

@davemarco davemarco left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I reviewed problem matcher code and looks good. Also looked at test PR, and appears to work correctly. Made some small comments.

@@ -29,4 +29,13 @@ jobs:
with:
node-version: 22
- run: "npm clean-install"
- run: "npm run lint:ci"
- name: "Set up Stylelint Problem Matcher"
run: "echo '::add-matcher::./.github/problem-matchers/stylelint.json'"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we add a variable for the file path? and reuse it later?

.github/workflows/lint.yaml Outdated Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
.github/workflows/lint.yaml Outdated Show resolved Hide resolved
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Outside diff range and nitpick comments (1)
.github/workflows/lint.yaml (1)

32-33: Consider using an environment variable for the problem matcher path

To improve maintainability and follow the DRY principle, consider defining the problem matcher path as an environment variable that can be reused in both setup and cleanup steps.

+      - name: "Set problem matcher path"
+        run: echo "PROBLEM_MATCHER_PATH=./.github/problem-matchers/stylelint.json" >> $GITHUB_ENV
       - name: "Set up Stylelint Problem Matcher"
-        run: "echo '::add-matcher::./.github/problem-matchers/stylelint.json'"
+        run: "echo '::add-matcher::${{ env.PROBLEM_MATCHER_PATH }}'"
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 155b067 and adc0e9e.

📒 Files selected for processing (1)
  • .github/workflows/lint.yaml (1 hunks)
🔇 Additional comments (2)
.github/workflows/lint.yaml (2)

34-38: Well-structured lint execution step

The step is well-organized with:

  • Clear step name
  • Helpful comment explaining the NO_COLOR environment variable
  • Proper command formatting

39-41: Properly implemented cleanup step

The cleanup step follows best practices by:

  • Using if: "always()" to ensure cleanup runs
  • Including the owner parameter for proper matcher removal
  • Having a clear, descriptive name

@junhaoliao junhaoliao changed the title gh-workflow: Add Stylelint problem matcher to GitHub Actions, replacing the previous formatter approach. ci(lint): Add Stylelint problem matcher to GH lint workflow, replacing the previous formatter approach. Nov 21, 2024
@junhaoliao junhaoliao requested a review from davemarco November 21, 2024 23:28
@junhaoliao junhaoliao changed the title ci(lint): Add Stylelint problem matcher to GH lint workflow, replacing the previous formatter approach. ci(lint): Add Stylelint problem matcher to GH lint workflow, replacing the deprecated Stylelint GH formatter approach. Nov 21, 2024
@junhaoliao junhaoliao removed the request for review from davemarco November 21, 2024 23:37
@junhaoliao junhaoliao requested a review from davemarco November 21, 2024 23:46
@junhaoliao
Copy link
Collaborator Author

@davemarco thanks for the review. Could you take a look again at the code and also the PR title?

@davemarco
Copy link
Contributor

Do you like ci(lint): Replace deprecated Stylelint Github formatter with a Github problem matcher.

Copy link
Contributor

@davemarco davemarco left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't explicitly test, but changes looks good to me

@junhaoliao junhaoliao changed the title ci(lint): Add Stylelint problem matcher to GH lint workflow, replacing the deprecated Stylelint GH formatter approach. ci(lint): Replace deprecated Stylelint Github formatter with a Github problem matcher. Nov 25, 2024
@junhaoliao junhaoliao merged commit d07c1b7 into y-scope:main Nov 25, 2024
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants