Skip to content

Commit 69de42e

Browse files
silverwindljharb
authored andcommitted
[Fix] no-unknown-property: only match data-* attributes containing -
Fixes #3712
1 parent da1013c commit 69de42e

File tree

3 files changed

+35
-2
lines changed

3 files changed

+35
-2
lines changed

CHANGELOG.md

+2
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,12 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
1111
* [`boolean-prop-naming`]: literalType error fix ([#3704][] @developer-bandi)
1212
* [`boolean-prop-naming`]: allow TSIntersectionType ([#3705][] @developer-bandi)
1313
* [`no-unknown-property`]: support `popover`, `popovertarget`, `popovertargetaction` attributes ([#3707][] @ljharb)
14+
* [`no-unknown-property`]: only match `data-*` attributes containing `-` ([#3713][] @silverwind)
1415

1516
### Changed
1617
* [`boolean-prop-naming`]: improve error message (@ljharb)
1718

19+
[#3713]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3713
1820
[#3707]: https://github.com/jsx-eslint/eslint-plugin-react/issues/3707
1921
[#3705]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3705
2022
[#3704]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3704

lib/rules/no-unknown-property.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -431,7 +431,7 @@ function normalizeAttributeCase(name) {
431431
* @returns {boolean} Result
432432
*/
433433
function isValidDataAttribute(name) {
434-
return !/^data-xml/i.test(name) && /^data(-?[^:]*)$/.test(name);
434+
return !/^data-xml/i.test(name) && /^data-[^:]*$/.test(name);
435435
}
436436

437437
/**

tests/lib/rules/no-unknown-property.js

+32-1
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,10 @@ ruleTester.run('no-unknown-property', rule, {
4141
features: ['jsx namespace'],
4242
},
4343
{ code: '<App clip-path="bar" />;' },
44+
{
45+
code: '<App dataNotAnDataAttribute="yes" />;',
46+
options: [{ requireDataLowercase: true }],
47+
},
4448
// Some HTML/DOM elements with common attributes should work
4549
{ code: '<div className="bar"></div>;' },
4650
{ code: '<div onMouseDown={this._onMouseDown}></div>;' },
@@ -603,7 +607,34 @@ ruleTester.run('no-unknown-property', rule, {
603607
],
604608
},
605609
{
606-
code: '<div data-testID="bar" data-under_sCoRe="bar" />;',
610+
code: '<div data-testID="bar" data-under_sCoRe="bar" dataNotAnDataAttribute="yes" />;',
611+
errors: [
612+
{
613+
messageId: 'dataLowercaseRequired',
614+
data: {
615+
name: 'data-testID',
616+
lowerCaseName: 'data-testid',
617+
},
618+
},
619+
{
620+
messageId: 'dataLowercaseRequired',
621+
data: {
622+
name: 'data-under_sCoRe',
623+
lowerCaseName: 'data-under_score',
624+
},
625+
},
626+
{
627+
messageId: 'unknownProp',
628+
data: {
629+
name: 'dataNotAnDataAttribute',
630+
lowerCaseName: 'datanotandataattribute',
631+
},
632+
},
633+
],
634+
options: [{ requireDataLowercase: true }],
635+
},
636+
{
637+
code: '<App data-testID="bar" data-under_sCoRe="bar" dataNotAnDataAttribute="yes" />;',
607638
errors: [
608639
{
609640
messageId: 'dataLowercaseRequired',

0 commit comments

Comments
 (0)