Blame view

node_modules/vue/src/compiler/error-detector.js 3.35 KB
aaac7fed   liuqimichale   add
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
  /* @flow */
  
  import { dirRE, onRE } from './parser/index'
  
  // these keywords should not appear inside expressions, but operators like
  // typeof, instanceof and in are allowed
  const prohibitedKeywordRE = new RegExp('\\b' + (
    'do,if,for,let,new,try,var,case,else,with,await,break,catch,class,const,' +
    'super,throw,while,yield,delete,export,import,return,switch,default,' +
    'extends,finally,continue,debugger,function,arguments'
  ).split(',').join('\\b|\\b') + '\\b')
  
  // these unary operators should not be used as property/method names
  const unaryOperatorsRE = new RegExp('\\b' + (
    'delete,typeof,void'
  ).split(',').join('\\s*\\([^\\)]*\\)|\\b') + '\\s*\\([^\\)]*\\)')
  
  // strip strings in expressions
  const stripStringRE = /'(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*"|`(?:[^`\\]|\\.)*\$\{|\}(?:[^`\\]|\\.)*`|`(?:[^`\\]|\\.)*`/g
  
  // detect problematic expressions in a template
  export function detectErrors (ast: ?ASTNode): Array<string> {
    const errors: Array<string> = []
    if (ast) {
      checkNode(ast, errors)
    }
    return errors
  }
  
  function checkNode (node: ASTNode, errors: Array<string>) {
    if (node.type === 1) {
      for (const name in node.attrsMap) {
        if (dirRE.test(name)) {
          const value = node.attrsMap[name]
          if (value) {
            if (name === 'v-for') {
              checkFor(node, `v-for="${value}"`, errors)
            } else if (onRE.test(name)) {
              checkEvent(value, `${name}="${value}"`, errors)
            } else {
              checkExpression(value, `${name}="${value}"`, errors)
            }
          }
        }
      }
      if (node.children) {
        for (let i = 0; i < node.children.length; i++) {
          checkNode(node.children[i], errors)
        }
      }
    } else if (node.type === 2) {
      checkExpression(node.expression, node.text, errors)
    }
  }
  
  function checkEvent (exp: string, text: string, errors: Array<string>) {
    const stipped = exp.replace(stripStringRE, '')
    const keywordMatch: any = stipped.match(unaryOperatorsRE)
    if (keywordMatch && stipped.charAt(keywordMatch.index - 1) !== '$') {
      errors.push(
        `avoid using JavaScript unary operator as property name: ` +
        `"${keywordMatch[0]}" in expression ${text.trim()}`
      )
    }
    checkExpression(exp, text, errors)
  }
  
  function checkFor (node: ASTElement, text: string, errors: Array<string>) {
    checkExpression(node.for || '', text, errors)
    checkIdentifier(node.alias, 'v-for alias', text, errors)
    checkIdentifier(node.iterator1, 'v-for iterator', text, errors)
    checkIdentifier(node.iterator2, 'v-for iterator', text, errors)
  }
  
  function checkIdentifier (
    ident: ?string,
    type: string,
    text: string,
    errors: Array<string>
  ) {
    if (typeof ident === 'string') {
      try {
        new Function(`var ${ident}=_`)
      } catch (e) {
        errors.push(`invalid ${type} "${ident}" in expression: ${text.trim()}`)
      }
    }
  }
  
  function checkExpression (exp: string, text: string, errors: Array<string>) {
    try {
      new Function(`return ${exp}`)
    } catch (e) {
      const keywordMatch = exp.replace(stripStringRE, '').match(prohibitedKeywordRE)
      if (keywordMatch) {
        errors.push(
          `avoid using JavaScript keyword as property name: ` +
          `"${keywordMatch[0]}"\n  Raw expression: ${text.trim()}`
        )
      } else {
        errors.push(
          `invalid expression: ${e.message} in\n\n` +
          `    ${exp}\n\n` +
          `  Raw expression: ${text.trim()}\n`
        )
      }
    }
  }