Skip to content

Improve docs and error message for vue/no-dupe-keys #2260

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.

Sign up for GitHub

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

Merged
merged 5 commits into from
Aug 1, 2023
Merged

Improve docs and error message for vue/no-dupe-keys #2260

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
23ff0c3
Touchup docs and error message for no-dupe-keys
vincerubinetti Jul 31, 2023
e16b857
Undo prettier format
vincerubinetti Jul 31, 2023
3aa3766
EOF fix
vincerubinetti Jul 31, 2023
87a0628
Fix prettier line wrap?
vincerubinetti Jul 31, 2023
636f623
Fix md script tag
vincerubinetti Jul 31, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions docs/rules/no-dupe-keys.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,12 @@ since: v3.9.0

- :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.

This rule prevents to use duplicated names.
This rule prevents using duplicate key names.

## :book: Rule Details

This rule is aimed at preventing duplicated property names.
This rule prevents duplicate `props`/`data`/`methods`/etc. key names defined on a component.
Even if a key name does not conflict in the `<script>` tag itself, it still may lead to a conflict in the `<template>` since Vue allows directly accessing these keys from there.

<eslint-code-block :rules="{'vue/no-dupe-keys': ['error']}">

Expand Down
2 changes: 1 addition & 1 deletion docs/rules/no-duplicate-attr-inheritance.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ since: v7.0.0

## :book: Rule Details

This rule aims to prevent duplicated attribute inheritance.
This rule aims to prevent duplicate attribute inheritance.
This rule to warn to apply `inheritAttrs: false` when it detects `v-bind="$attrs"` being used.

<eslint-code-block :rules="{'vue/no-duplicate-attr-inheritance': ['error']}">
Expand Down
5 changes: 2 additions & 3 deletions docs/rules/no-duplicate-attributes.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,12 @@ since: v3.0.0

- :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.

When duplicate arguments exist, only the last one is valid.
It's possibly mistakes.
When there are multiple attributes with the same name on a component, only the last one is used and the rest are ignored, so this is usually a mistake.

## :book: Rule Details

This rule reports duplicate attributes.
`v-bind:foo` directives are handled as the attributes `foo`.
`v-bind:foo` directives are handled as the attribute `foo`.

<eslint-code-block :rules="{'vue/no-duplicate-attributes': ['error']}">

Expand Down
7 changes: 4 additions & 3 deletions lib/rules/no-dupe-keys.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,8 @@ module.exports = {
}
],
messages: {
duplicatedKey: "Duplicated key '{{name}}'."
duplicateKey:
"Duplicate key '{{name}}'. May cause name collision in script or template tag."
}
},
/** @param {RuleContext} context */
Expand All @@ -96,7 +97,7 @@ module.exports = {
if (usedNames.has(o.name)) {
context.report({
node: o.node,
messageId: 'duplicatedKey',
messageId: 'duplicateKey',
data: {
name: o.name
}
Expand Down Expand Up @@ -131,7 +132,7 @@ module.exports = {

context.report({
node: variable.defs[0].node,
messageId: 'duplicatedKey',
messageId: 'duplicateKey',
data: {
name: prop.propName
}
Expand Down
108 changes: 72 additions & 36 deletions tests/lib/rules/no-dupe-keys.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -529,19 +529,23 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 5
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 10
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 14
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 21
}
]
Expand Down Expand Up @@ -575,19 +579,23 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 5
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 10
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 14
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 21
}
]
Expand All @@ -612,15 +620,18 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 5
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 9
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 12
}
]
Expand Down Expand Up @@ -656,19 +667,23 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 7
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 13
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 16
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 23
}
]
Expand All @@ -688,7 +703,8 @@ ruleTester.run('no-dupe-keys', rule, {
options: [{ groups: ['foo'] }],
errors: [
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -713,7 +729,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 12
}
]
Expand All @@ -736,7 +753,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 10
}
]
Expand All @@ -757,7 +775,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 9
}
]
Expand All @@ -778,7 +797,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 9
}
]
Expand All @@ -799,7 +819,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 9
}
]
Expand All @@ -820,7 +841,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 9
}
]
Expand All @@ -840,7 +862,8 @@ ruleTester.run('no-dupe-keys', rule, {
options: [{ groups: ['foo'] }],
errors: [
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -860,7 +883,8 @@ ruleTester.run('no-dupe-keys', rule, {
options: [{ groups: ['foo'] }],
errors: [
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -884,7 +908,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 6
}
]
Expand All @@ -904,7 +929,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -923,7 +949,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 6
}
]
Expand All @@ -943,7 +970,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -963,7 +991,8 @@ ruleTester.run('no-dupe-keys', rule, {
`,
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 7
}
]
Expand All @@ -981,7 +1010,8 @@ ruleTester.run('no-dupe-keys', rule, {
parser: require.resolve('vue-eslint-parser'),
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 6
}
]
Expand All @@ -1008,15 +1038,18 @@ ruleTester.run('no-dupe-keys', rule, {
parser: require.resolve('vue-eslint-parser'),
errors: [
{
message: "Duplicated key 'baz'.",
message:
"Duplicate key 'baz'. May cause name collision in script or template tag.",
line: 4
},
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 12
},
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 15
}
]
Expand All @@ -1038,11 +1071,13 @@ ruleTester.run('no-dupe-keys', rule, {
parserOptions: { parser: require.resolve('@typescript-eslint/parser') },
errors: [
{
message: "Duplicated key 'foo'.",
message:
"Duplicate key 'foo'. May cause name collision in script or template tag.",
line: 8
},
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 9
}
]
Expand All @@ -1059,7 +1094,8 @@ ruleTester.run('no-dupe-keys', rule, {
parser: require.resolve('vue-eslint-parser'),
errors: [
{
message: "Duplicated key 'bar'.",
message:
"Duplicate key 'bar'. May cause name collision in script or template tag.",
line: 5
}
]
Expand Down