Skip to content

Conversation

rohitgs28
Copy link
Contributor

@rohitgs28 rohitgs28 commented Mar 14, 2025

This PR fixes issue #8430, where the custom-property-pattern rule was not reporting the correct error location for custom property names declared via @Property at-rules.

Changes

  • Code Changes:
    In lib/rules/custom-property-pattern/index.mjs, the error location calculation for @Property at-rules has been adjusted. The fix computes the base error index using the at-rule’s source column plus an offset (and optionally adds an extra offset for property names ending with a hyphen) so that the reported start and end columns match the expected values.
  • Test Changes:
    New test cases were added to lib/rules/custom-property-pattern/__tests__/index.mjs to ensure that:
    • A valid @Property rule with a properly formatted custom property name (e.g. --foo-bar) passes.
    • Invalid @Property rules (e.g. --Foo-bar with an uppercase letter or --foo- for an incomplete name) are flagged with the correct error location.

Testing

  • Rebuilt the project with npm run build.
  • Ran npm test and confirmed that all tests pass and the error locations in @Property at-rules now match the expected snapshots.

Closes #8430.

Please let me know if any further changes are required.

Copy link

changeset-bot bot commented Mar 14, 2025

🦋 Changeset detected

Latest commit: 683a0ef

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
stylelint Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Contributor

github-actions bot commented Mar 14, 2025

Try the Instant Preview in Online Demo

Stylelint Online Demo

Install the Instant Preview to Your Local

npm i -D https://pkg.pr.new/stylelint@8468

View Commit

Copy link
Member

@ybiquitous ybiquitous left a comment

Choose a reason for hiding this comment

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

Hi. Thanks for the pull request. Can you add a test case for the new behavior?

@rohitgs28 rohitgs28 closed this Mar 14, 2025
@rohitgs28 rohitgs28 reopened this Mar 14, 2025
@rohitgs28 rohitgs28 closed this Mar 14, 2025
@rohitgs28 rohitgs28 reopened this Mar 14, 2025
@ybiquitous ybiquitous changed the title Fix custom-property-pattern: validate @property at-rule names Fix custom-property-pattern false negatives for @property preludes Mar 14, 2025
@ybiquitous ybiquitous changed the title Fix custom-property-pattern false negatives for @property preludes Fix custom-property-pattern false negatives for @property preludes Mar 14, 2025
@rohitgs28 rohitgs28 requested a review from ybiquitous March 14, 2025 05:52
Copy link
Member

@ybiquitous ybiquitous left a comment

Choose a reason for hiding this comment

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

Thank for the quick action! Additionally, can you check my reviews?

@rohitgs28 rohitgs28 marked this pull request as draft March 14, 2025 12:03
…ts (closes stylelint#8430)

- Removed unnecessary typeof additions.
- Use shared regex (atRuleRegexes.propertyName) to support both lower/upper cases.
- Simplified error index calculation for @Property rules by using atRuleParamIndex utility.
- Added an empty line in the @Property block for clarity.
- Simplified test CSS for @Property rules (e.g. '@Property --foo-bar {}') to focus on core syntax.

This refactor addresses reviewer suggestions and improves code clarity and maintainability.
@rohitgs28 rohitgs28 marked this pull request as ready for review March 14, 2025 17:38
@rohitgs28 rohitgs28 requested a review from ybiquitous March 14, 2025 17:39
…loses stylelint#8430)

Forgot to remove the leftover typeof additions from the code.
This change cleans up the code, ensuring we only use the shared utilities
and simplify the @Property handling logic as suggested.
closes stylelint#8430)

Removed the "extra" parameter from the complain function since it is no longer needed after simplifying the error location calculation. This further streamlines the code and improves clarity.
@rohitgs28 rohitgs28 requested a review from ybiquitous March 16, 2025 08:17
Copy link
Member

@jeddy3 jeddy3 left a comment

Choose a reason for hiding this comment

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

@rohitgs28 Thanks for making @ybiquitous suggested changes.

I've requested a couple more minor ones related to our code conventions. Otherwise, looking good thank you.

@@ -70,19 +69,26 @@ const rule = (primary) => {

complain(0, prop, decl);
});
root.walkAtRules(atRuleRegexes.propertyName, (atRule) => {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done

@rohitgs28 rohitgs28 requested a review from jeddy3 March 16, 2025 08:45
Copy link
Member

@jeddy3 jeddy3 left a comment

Choose a reason for hiding this comment

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

Thanks for making the changes.

One last one, then LGTM.

@rohitgs28 rohitgs28 requested a review from jeddy3 March 16, 2025 08:55
Copy link
Member

@jeddy3 jeddy3 left a comment

Choose a reason for hiding this comment

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

LGTM, thank you!

Copy link
Member

@ybiquitous ybiquitous left a comment

Choose a reason for hiding this comment

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

Thanks LGTM 👍

@jeddy3 jeddy3 merged commit 2c639ff into stylelint:main Mar 16, 2025
19 checks passed
@jeddy3
Copy link
Member

jeddy3 commented Mar 16, 2025

@rohitgs28 Thank you for your first contribution to Stylelint 🎉

renovate bot added a commit to andrei-picus-tink/auto-renovate that referenced this pull request Mar 28, 2025
| datasource | package   | from    | to      |
| ---------- | --------- | ------- | ------- |
| npm        | stylelint | 16.16.0 | 16.17.0 |


## [v16.17.0](https://github.com/stylelint/stylelint/blob/HEAD/CHANGELOG.md#16170---2025-03-26)

It adds 1 new rule, support for `languageOptions` to 2 rules, 1 option to a rule, the `--compute-edit-info` CLI flag (along with support for `EditInfo` in 3 rules), and fixes 1 bug. `EditInfo` is useful for automated fixing tools and editor integrations.

-   Added: `layer-name-pattern` rule ([#8474](stylelint/stylelint#8474)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `--compute-edit-info` CLI flag ([#8473](stylelint/stylelint#8473)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `ignorePreludeOfAtRules: []` to `length-zero-no-unit` ([#8472](stylelint/stylelint#8472)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `at-rule-no-unknown` support for `languageOptions` ([#8475](stylelint/stylelint#8475)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `property-no-unknown` support for `languageOptions` ([#8476](stylelint/stylelint#8476)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `declaration-block-no-redundant-longhand-properties` support for computing `EditInfo` ([#8482](stylelint/stylelint#8482)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Added: `function-url-quotes` support for computing `EditInfo` ([#8483](stylelint/stylelint#8483)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Added: `selector-attribute-quotes` support for computing `EditInfo` ([#8484](stylelint/stylelint#8484)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Fixed: `custom-property-pattern` false negatives for `@property` preludes ([#8468](stylelint/stylelint#8468)) ([@rohitgs28](https://github.com/rohitgs28)).
renovate bot added a commit to andrei-picus-tink/auto-renovate that referenced this pull request Mar 28, 2025
| datasource | package   | from    | to      |
| ---------- | --------- | ------- | ------- |
| npm        | stylelint | 16.16.0 | 16.17.0 |


## [v16.17.0](https://github.com/stylelint/stylelint/blob/HEAD/CHANGELOG.md#16170---2025-03-26)

It adds 1 new rule, support for `languageOptions` to 2 rules, 1 option to a rule, the `--compute-edit-info` CLI flag (along with support for `EditInfo` in 3 rules), and fixes 1 bug. `EditInfo` is useful for automated fixing tools and editor integrations.

-   Added: `layer-name-pattern` rule ([#8474](stylelint/stylelint#8474)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `--compute-edit-info` CLI flag ([#8473](stylelint/stylelint#8473)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `ignorePreludeOfAtRules: []` to `length-zero-no-unit` ([#8472](stylelint/stylelint#8472)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `at-rule-no-unknown` support for `languageOptions` ([#8475](stylelint/stylelint#8475)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `property-no-unknown` support for `languageOptions` ([#8476](stylelint/stylelint#8476)) ([@ryo-manba](https://github.com/ryo-manba)).
-   Added: `declaration-block-no-redundant-longhand-properties` support for computing `EditInfo` ([#8482](stylelint/stylelint#8482)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Added: `function-url-quotes` support for computing `EditInfo` ([#8483](stylelint/stylelint#8483)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Added: `selector-attribute-quotes` support for computing `EditInfo` ([#8484](stylelint/stylelint#8484)) ([@pamelalozano16](https://github.com/pamelalozano16)).
-   Fixed: `custom-property-pattern` false negatives for `@property` preludes ([#8468](stylelint/stylelint#8468)) ([@rohitgs28](https://github.com/rohitgs28)).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

Fix custom-property-pattern false negatives for @property preludes
3 participants