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

Add vue/operator-linebreak rule #1200

Merged
merged 2 commits into from Jun 7, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
1 change: 1 addition & 0 deletions docs/rules/README.md
Expand Up @@ -333,6 +333,7 @@ The following rules extend the rules provided by ESLint itself and apply them to
| [vue/object-curly-newline](./object-curly-newline.md) | enforce consistent line breaks inside braces | :wrench: |
| [vue/object-curly-spacing](./object-curly-spacing.md) | enforce consistent spacing inside braces | :wrench: |
| [vue/object-property-newline](./object-property-newline.md) | enforce placing object properties on separate lines | :wrench: |
| [vue/operator-linebreak](./operator-linebreak.md) | enforce consistent linebreak style for operators | :wrench: |
| [vue/prefer-template](./prefer-template.md) | require template literals instead of string concatenation | :wrench: |
| [vue/space-in-parens](./space-in-parens.md) | enforce consistent spacing inside parentheses | :wrench: |
| [vue/space-infix-ops](./space-infix-ops.md) | require spacing around infix operators | :wrench: |
Expand Down
25 changes: 25 additions & 0 deletions docs/rules/operator-linebreak.md
@@ -0,0 +1,25 @@
---
pageClass: rule-details
sidebarDepth: 0
title: vue/operator-linebreak
description: enforce consistent linebreak style for operators
---
# vue/operator-linebreak
> enforce consistent linebreak style for operators

- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.

This rule is the same rule as core [operator-linebreak] rule but it applies to the expressions in `<template>`.

## :books: Further reading

- [operator-linebreak]

[operator-linebreak]: https://eslint.org/docs/rules/operator-linebreak

## :mag: Implementation

- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/operator-linebreak.js)
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/operator-linebreak.js)

<sup>Taken with ❤️ [from ESLint core](https://eslint.org/docs/rules/operator-linebreak)</sup>
1 change: 1 addition & 0 deletions lib/configs/no-layout-rules.js
Expand Up @@ -33,6 +33,7 @@ module.exports = {
'vue/object-curly-newline': 'off',
'vue/object-curly-spacing': 'off',
'vue/object-property-newline': 'off',
'vue/operator-linebreak': 'off',
'vue/padding-line-between-blocks': 'off',
'vue/script-indent': 'off',
'vue/singleline-html-element-content-newline': 'off',
Expand Down
1 change: 1 addition & 0 deletions lib/index.js
Expand Up @@ -108,6 +108,7 @@ module.exports = {
'object-curly-spacing': require('./rules/object-curly-spacing'),
'object-property-newline': require('./rules/object-property-newline'),
'one-component-per-file': require('./rules/one-component-per-file'),
'operator-linebreak': require('./rules/operator-linebreak'),
'order-in-components': require('./rules/order-in-components'),
'padding-line-between-blocks': require('./rules/padding-line-between-blocks'),
'prefer-template': require('./rules/prefer-template'),
Expand Down
9 changes: 9 additions & 0 deletions lib/rules/operator-linebreak.js
@@ -0,0 +1,9 @@
/**
* @author Yosuke Ota
*/
'use strict'

const { wrapCoreRule } = require('../utils')

// eslint-disable-next-line no-invalid-meta, no-invalid-meta-docs-categories
module.exports = wrapCoreRule(require('eslint/lib/rules/operator-linebreak'))
129 changes: 129 additions & 0 deletions tests/lib/rules/operator-linebreak.js
@@ -0,0 +1,129 @@
/**
* @author Yosuke Ota
*/
'use strict'

const RuleTester = require('eslint').RuleTester
const rule = require('../../../lib/rules/operator-linebreak')

const tester = new RuleTester({
parser: require.resolve('vue-eslint-parser'),
parserOptions: { ecmaVersion: 2020 }
})

tester.run('operator-linebreak', rule, {
valid: [
`
<template>
<div :foo="1 + 2" />
</template>
`,
{
code: `
<template>
<div :foo="1 + 2" />
</template>
`,
options: ['before']
},
{
code: `
<template>
<div :foo="1 + 2" />
</template>
`,
options: ['none']
},
`
<template>
<div :[foo+bar]="value" />
</template>
`,
{
code: `
<template>
<div :[foo+bar]="value" />
</template>
`,
options: ['before']
},
{
code: `
<template>
<div :[foo+bar]="value" />
</template>
`,
options: ['none']
}
],
invalid: [
{
code: `
<template>
<div :foo="1
+ 2" />
</template>
`,
output: `
<template>
<div :foo="1 +
2" />
</template>
`,
errors: [
{
message: "'+' should be placed at the end of the line.",
line: 4
}
]
},
{
code: `
<template>
<div :foo="1 +
2" />
</template>
`,
output: `
<template>
<div :foo="1
+ 2" />
</template>
`,
options: ['before'],
errors: [
{
message: "'+' should be placed at the beginning of the line.",
line: 3
}
]
},
{
code: `
<template>
<div :foo="1 +
2" />
<div :foo="1
+ 2" />
</template>
`,
output: `
<template>
<div :foo="1 + 2" />
<div :foo="1 + 2" />
</template>
`,
options: ['none'],
errors: [
{
message: "There should be no line break before or after '+'.",
line: 3
},
{
message: "There should be no line break before or after '+'.",
line: 6
}
]
}
]
})