Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
6 changes: 3 additions & 3 deletions docs/rules/no-bare-strings-in-template.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ since: v7.0.0

## :book: Rule Details

This rule disallows the use of bare strings in `<template>`.
This rule disallows the use of bare strings in `<template>`.
In order to be able to internationalize your application, you will need to avoid using plain strings in your templates. Instead, you would need to use a template helper specializing in translation.

This rule was inspired by [no-bare-strings rule in ember-template-lint](https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-bare-strings.md).
Expand Down Expand Up @@ -50,7 +50,7 @@ This rule was inspired by [no-bare-strings rule in ember-template-lint](https://
</eslint-code-block>

:::tip
This rule does not check for string literals, in bindings and mustaches interpolation. This is because it looks like a conscious decision.
This rule does not check for string literals, in bindings and mustaches interpolation. This is because it looks like a conscious decision.
If you want to report these string literals, enable the [vue/no-useless-v-bind] and [vue/no-useless-mustaches] rules and fix the useless string literals.
:::

Expand All @@ -72,7 +72,7 @@ If you want to report these string literals, enable the [vue/no-useless-v-bind]
}
```

- `allowlist` ... An array of allowed strings.
- `allowlist` ... An array of allowed strings or regular expression patterns (e.g. `/\d+/` to allow number).
- `attributes` ... An object whose keys are tag name or patterns and value is an array of attributes to check for that tag name.
- `directives` ... An array of directive names to check literal value.

Expand Down
48 changes: 39 additions & 9 deletions lib/rules/no-bare-strings-in-template.js
Original file line number Diff line number Diff line change
Expand Up @@ -149,17 +149,33 @@ module.exports = {
*/
const opts = context.options[0] || {}
/** @type {string[]} */
const allowlist = opts.allowlist || DEFAULT_ALLOWLIST
const rawAllowlist = opts.allowlist || DEFAULT_ALLOWLIST
const attributes = parseTargetAttrs(opts.attributes || DEFAULT_ATTRIBUTES)
const directives = opts.directives || DEFAULT_DIRECTIVES

const allowlistRe = new RegExp(
allowlist
.map((w) => regexp.escape(w))
.sort((a, b) => b.length - a.length)
.join('|'),
'gu'
)
/** @type {string[]} */
const stringAllowlist = []
/** @type {RegExp[]} */
const regexAllowlist = []

for (const item of rawAllowlist) {
if (regexp.isRegExp(item)) {
regexAllowlist.push(regexp.toRegExp(item))
} else {
stringAllowlist.push(item)
}
}

const allowlistRe =
stringAllowlist.length > 0
? new RegExp(
stringAllowlist
.map((w) => regexp.escape(w))
.sort((a, b) => b.length - a.length)
.join('|'),
'gu'
)
: null

/** @type {ElementStack | null} */
let elementStack = null
Expand All @@ -168,7 +184,21 @@ module.exports = {
* @param {string} str
*/
function getBareString(str) {
return str.trim().replace(allowlistRe, '').trim()
let result = str.trim()

if (allowlistRe) {
result = result.replace(allowlistRe, '')
}

for (const regex of regexAllowlist) {
const flags = regex.flags.includes('g')
? regex.flags
: `${regex.flags}g`
const globalRegex = new RegExp(regex.source, flags)
result = result.replace(globalRegex, '')
}

return result.trim()
}

/**
Expand Down
60 changes: 60 additions & 0 deletions tests/lib/rules/no-bare-strings-in-template.js
Original file line number Diff line number Diff line change
Expand Up @@ -132,6 +132,32 @@ tester.run('no-bare-strings-in-template', rule, {
</template>
`,
options: [{ allowlist: ['@@'] }]
},
// regex
{
code: `
<template>
<h1>123 321</h1>
</template>
`,
options: [{ allowlist: [String.raw`/\d+/g`] }]
},
{
code: `
<template>
<h1>$foo</h1>
<h1>$bar</h1>
</template>
`,
options: [{ allowlist: [String.raw`/\$\w+/`] }]
},
{
code: `
<template>
<h1>foo123foo</h1>
</template>
`,
options: [{ allowlist: [String.raw`/\d+/`, 'foo'] }]
}
],
invalid: [
Expand Down Expand Up @@ -316,6 +342,40 @@ tester.run('no-bare-strings-in-template', rule, {
endColumn: 34
}
]
},
{
code: `
<template>
<h1>123, foo is invalid, 321</h1>
</template>
`,
options: [{ allowlist: [String.raw`/^\d+$/g`] }],
errors: [
{
messageId: 'unexpected',
line: 3,
column: 13,
endLine: 3,
endColumn: 37
}
]
},
{
code: `
<template>
<h1>foo123bar</h1>
</template>
`,
options: [{ allowlist: [String.raw`/\d+/`, 'foo'] }],
errors: [
{
messageId: 'unexpected',
line: 3,
column: 13,
endLine: 3,
endColumn: 22
}
]
}
]
})
Loading