Browse Source

detect and warn against using keywords as property names

dev
Evan You 9 years ago
parent
commit
02d5330e50
  1. 27
      src/compiler/error-detector.js
  2. 3
      test/unit/features/options/template.spec.js

27
src/compiler/error-detector.js

@ -2,6 +2,12 @@
import { dirRE } from './parser/index'
const keywordRE = new RegExp('\\b' + (
'do,if,in,for,let,new,try,var,case,else,with,await,break,catch,class,const,' +
'super,throw,while,yield,delete,export,import,return,switch,typeof,default,' +
'extends,finally,continue,debugger,function,arguments,instanceof'
).split(',').join('\\b|\\b') + '\\b')
// detect problematic expressions in a template
export function detectErrors (ast: ?ASTNode): Array<string> {
const errors: Array<string> = []
@ -32,9 +38,22 @@ function checkNode (node: ASTNode, errors: Array<string>) {
}
function checkExpression (exp: string, text: string, errors: Array<string>) {
try {
new Function(exp)
} catch (e) {
errors.push(`- invalid expression: ${text}`)
exp = stripToString(exp)
const keywordMatch = exp.match(keywordRE)
if (keywordMatch) {
errors.push(
`- avoid using JavaScript keyword as property name: ` +
`"${keywordMatch[0]}" in expression ${text}`
)
} else {
try {
new Function(exp)
} catch (e) {
errors.push(`- invalid expression: ${text}`)
}
}
}
function stripToString (exp) {
return exp.replace(/^_s\((.*)\)$/, '$1')
}

3
test/unit/features/options/template.spec.js

@ -53,10 +53,11 @@ describe('Options template', () => {
it('warn error in generated function', () => {
new Vue({
template: '<div v-if="!@">{{ a"" }}</div>'
template: '<div v-if="!@"><span>{{ a"" }}</span><span>{{ do + 1 }}</span></div>'
}).$mount()
expect('failed to compile template').toHaveBeenWarned()
expect('invalid expression: v-if="!@"').toHaveBeenWarned()
expect('invalid expression: {{ a"" }}').toHaveBeenWarned()
expect('avoid using JavaScript keyword as property name: "do" in expression {{ do + 1 }}').toHaveBeenWarned()
})
})

Loading…
Cancel
Save