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.

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

Jump to bottom

fix(eslint-plugin-vue): [valid-v-bind-sync] Added Case: when valid is then valid .sync #1335

Merged
merged 6 commits into from Dec 4, 2020
Merged

fix(eslint-plugin-vue): [valid-v-bind-sync] Added Case: when valid is then valid .sync #1335

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
92f550a
fix(eslint-plugin-vue): [valid-v-bind-sync] If Valid Is then .sync is…
aggmoulik Oct 17, 2020
e618757
Formatted Document
aggmoulik Oct 17, 2020
9eb250c
fix: [v-bind-sync] added check for :is bind attribute
aggmoulik Oct 19, 2020
25e5139
fix: [valid-v-bind-sync] add unit tests for `v-bind:is`
aggmoulik Oct 19, 2020
fab2761
Update tests/lib/rules/valid-v-bind-sync.js
ota-meshi Dec 4, 2020
b5a7016
Update package.json
ota-meshi Dec 4, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
18 changes: 17 additions & 1 deletion lib/rules/valid-v-bind-sync.js
View file
Open in desktop
Expand Up @@ -82,6 +82,22 @@ function maybeNullObjectMemberExpression(node) {
return false
}

function isValidIs(node) {
const { attributes } = node
const isAttribute = attributes.some((attr) => {
// check for `VAttribute`
if (attr.type === 'VAttribute') {
// check for `is` attribute
if (attr.key.type === 'VIdentifier' && attr.key.name === 'is') return true

// check for `:is` `bind` attribute
if (attr.key.type === 'VDirectiveKey' && attr.key.argument.name === 'is')
Copy link
Member

Choose a reason for hiding this comment

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

You need to check if it is v-bind. Also, the argument can be null.

https://github.com/vuejs/vue-eslint-parser/blob/master/docs/ast.md#vdirectivekey

In addition, could you add a test to make sure it is not judged as is?

<tr v-on:is="myRow" :some-prop.sync="somePropValue">
<tr v-bind="myRow" :some-prop.sync="somePropValue">

return true
}
})
return isAttribute
}

// ------------------------------------------------------------------------------
// Rule Definition
// ------------------------------------------------------------------------------
Expand Down Expand Up @@ -120,7 +136,7 @@ module.exports = {
const element = node.parent.parent
const name = element.name

if (!isValidElement(element)) {
if (!isValidElement(element) && !isValidIs(node.parent)) {
context.report({
node,
loc: node.loc,
Expand Down
42 changes: 42 additions & 0 deletions tests/lib/rules/valid-v-bind-sync.js
View file
Open in desktop
Expand Up @@ -145,6 +145,48 @@ tester.run('valid-v-bind-sync', rule, {
{
filename: 'empty-value.vue',
code: '<template><MyComponent :foo.sync="" /></template>'
},
{
filename: 'test.vue',
code: `
<template>
<table>
<tr is="my-row"
:some-prop.sync="somePropValue"
:some-other-prop.sync="someOtherPropValue">
<td></td>
</tr>
</table>
</template>
`
},
{
filename: 'test.vue',
code: `
<template>
<table>
<tr :is="my-row"
:some-prop.sync="somePropValue"
:some-other-prop.sync="someOtherPropValue">
<td></td>
</tr>
</table>
</template>
`
},
{
filename: 'test.vue',
code: `
<template>
<table>
<tr v-bind:is="myRow"
:some-prop.sync="somePropValue"
:some-other-prop.sync="someOtherPropValue">
<td></td>
</tr>
</table>
</template>
`
}
],
invalid: [
Expand Down