compiler-app-plus.view.spec.js 28.5 KB
Newer Older
fxy060608's avatar
init v3  
fxy060608 已提交
1 2 3 4 5 6
const compiler = require('../lib')

function assertCodegen (template, generatedCode, ...args) {
  const compiled = compiler.compile(template, {
    mp: {
      platform: 'app-plus'
fxy060608's avatar
fxy060608 已提交
7
    },
fxy060608's avatar
init v3  
fxy060608 已提交
8 9 10 11 12 13 14 15 16 17
    view: true
  })
  expect(compiled.render).toBe(generatedCode)
}

/* eslint-disable quotes */
describe('codegen', () => {
  it('generate directive', () => {
    assertCodegen(
      '<p v-custom1:arg1.modifier="value1" v-custom2></p>',
fxy060608's avatar
fxy060608 已提交
18
      `with(this){return _c('p',{attrs:{"_i":0}})}`
fxy060608's avatar
fxy060608 已提交
19 20 21 22
    )
    // extra
    assertCodegen(
      '<p v-custom1:[arg1].modifier="value1" v-custom2></p>',
fxy060608's avatar
fxy060608 已提交
23
      `with(this){return _c('p',{attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
24 25 26 27 28 29
    )
  })

  it('generate filters', () => {
    assertCodegen(
      '<div :id="a | b | c">{{ d | e | f }}</div>',
fxy060608's avatar
fxy060608 已提交
30
      `with(this){return _c('div',{attrs:{"id":_$g(0,'a-id'),"_i":0}},[_v((_$g(0,'t0')))])}`
fxy060608's avatar
init v3  
fxy060608 已提交
31 32 33 34 35 36
    )
  })

  it('generate filters with no arguments', () => {
    assertCodegen(
      '<div>{{ d | e() }}</div>',
fxy060608's avatar
fxy060608 已提交
37
      `with(this){return _c('div',{attrs:{"_i":0}},[_v((_$g(0,'t0')))])}`
fxy060608's avatar
init v3  
fxy060608 已提交
38 39 40 41 42 43
    )
  })

  it('generate v-for directive', () => {
    assertCodegen(
      '<div><li v-for="item in items" :key="item.uid"></li></div>',
fxy060608's avatar
fxy060608 已提交
44
      `with(this){return _c('div',{attrs:{"_i":0}},_l((_$g(1,'f')),function(item,$10,$20,$30){return _c('li',{key:item,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
45 46 47 48
    )
    // iterator syntax
    assertCodegen(
      '<div><li v-for="(item, i) in items"></li></div>',
fxy060608's avatar
fxy060608 已提交
49
      `with(this){return _c('div',{attrs:{"_i":0}},_l((_$g(1,'f')),function(item,i,$20,$30){return _c('li',{key:item,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
50 51 52
    )
    assertCodegen(
      '<div><li v-for="(item, key, index) in items"></li></div>',
fxy060608's avatar
fxy060608 已提交
53
      `with(this){return _c('div',{attrs:{"_i":0}},_l((_$g(1,'f')),function(item,key,index,$30){return _c('li',{key:item,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
54 55 56 57
    )
    // destructuring
    assertCodegen(
      '<div><li v-for="{ a, b } in items"></li></div>',
fxy060608's avatar
fxy060608 已提交
58
      `with(this){return _c('div',{attrs:{"_i":0}},_l((_$g(1,'f')),function($item,$10,$20,$30){return _c('li',{key:$item,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
59 60 61
    )
    assertCodegen(
      '<div><li v-for="({ a, b }, key, index) in items"></li></div>',
fxy060608's avatar
fxy060608 已提交
62
      `with(this){return _c('div',{attrs:{"_i":0}},_l((_$g(1,'f')),function($item,key,index,$30){return _c('li',{key:$item,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
63 64 65 66
    )
    // v-for with extra element
    assertCodegen(
      '<div><p></p><li v-for="item in items"></li></div>',
fxy060608's avatar
fxy060608 已提交
67
      `with(this){return _c('div',{attrs:{"_i":0}},[_c('p',{attrs:{"_i":1}}),_l((_$g(2,'f')),function(item,$10,$20,$30){return _c('li',{key:item,attrs:{"_i":("2-"+$30)}})})],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
68 69 70 71 72 73
    )
  })

  it('generate v-if directive', () => {
    assertCodegen(
      '<p v-if="show">hello</p>',
fxy060608's avatar
fxy060608 已提交
74
      `with(this){return (_$g(0,'i'))?_c('p',{attrs:{"_i":0}},[_v("hello")]):_e()}`
fxy060608's avatar
init v3  
fxy060608 已提交
75 76 77 78 79 80
    )
  })

  it('generate v-else directive', () => {
    assertCodegen(
      '<div><p v-if="show">hello</p><p v-else>world</p></div>',
fxy060608's avatar
fxy060608 已提交
81
      `with(this){return _c('div',{attrs:{"_i":0}},[(_$g(1,'i'))?_c('p',{attrs:{"_i":1}},[_v("hello")]):_c('p',{attrs:{"_i":2}},[_v("world")])],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
82 83 84 85 86 87
    )
  })

  it('generate v-else-if directive', () => {
    assertCodegen(
      '<div><p v-if="show">hello</p><p v-else-if="hide">world</p></div>',
fxy060608's avatar
fxy060608 已提交
88
      `with(this){return _c('div',{attrs:{"_i":0}},[(_$g(1,'i'))?_c('p',{attrs:{"_i":1}},[_v("hello")]):(_$g(2,'e'))?_c('p',{attrs:{"_i":2}},[_v("world")]):_e()],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
89 90 91 92 93 94
    )
  })

  it('generate v-else-if with v-else directive', () => {
    assertCodegen(
      '<div><p v-if="show">hello</p><p v-else-if="hide">world</p><p v-else>bye</p></div>',
fxy060608's avatar
fxy060608 已提交
95
      `with(this){return _c('div',{attrs:{"_i":0}},[(_$g(1,'i'))?_c('p',{attrs:{"_i":1}},[_v("hello")]):(_$g(2,'e'))?_c('p',{attrs:{"_i":2}},[_v("world")]):_c('p',{attrs:{"_i":3}},[_v("bye")])],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
96 97 98 99 100 101
    )
  })

  it('generate multi v-else-if with v-else directive', () => {
    assertCodegen(
      '<div><p v-if="show">hello</p><p v-else-if="hide">world</p><p v-else-if="3">elseif</p><p v-else>bye</p></div>',
fxy060608's avatar
fxy060608 已提交
102
      `with(this){return _c('div',{attrs:{"_i":0}},[(_$g(1,'i'))?_c('p',{attrs:{"_i":1}},[_v("hello")]):(_$g(2,'e'))?_c('p',{attrs:{"_i":2}},[_v("world")]):(3)?_c('p',{attrs:{"_i":3}},[_v("elseif")]):_c('p',{attrs:{"_i":4}},[_v("bye")])],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
103 104 105 106 107 108
    )
  })

  it('generate ref', () => {
    assertCodegen(
      '<p ref="component1"></p>',
fxy060608's avatar
fxy060608 已提交
109
      `with(this){return _c('p',{ref:"component1",attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
110 111 112 113 114 115
    )
  })

  it('generate ref on v-for', () => {
    assertCodegen(
      '<ul><li v-for="item in items" ref="component1"></li></ul>',
fxy060608's avatar
fxy060608 已提交
116
      `with(this){return _c('ul',{attrs:{"_i":0}},_l((_$g(1,'f')),function(item,$10,$20,$30){return _c('li',{key:item,ref:"component1",refInFor:true,attrs:{"_i":("1-"+$30)}})}),1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
117 118 119 120 121 122
    )
  })

  it('generate v-bind directive', () => {
    assertCodegen(
      '<p v-bind="test"></p>',
fxy060608's avatar
fxy060608 已提交
123
      `with(this){return _c('p',_b({attrs:{"_i":0}},'p',_$g(0,'v-bind'),false))}`
fxy060608's avatar
init v3  
fxy060608 已提交
124 125 126 127 128 129
    )
  })

  it('generate v-bind with prop directive', () => {
    assertCodegen(
      '<p v-bind.prop="test"></p>',
fxy060608's avatar
fxy060608 已提交
130
      `with(this){return _c('p',_b({attrs:{"_i":0}},'p',_$g(0,'v-bind'),true))}`
fxy060608's avatar
init v3  
fxy060608 已提交
131 132 133 134 135 136
    )
  })

  it('generate v-bind directive with sync modifier', () => {
    assertCodegen(
      '<p v-bind.sync="test"></p>',
fxy060608's avatar
fxy060608 已提交
137
      `with(this){return _c('p',_b({attrs:{"_i":0}},'p',_$g(0,'v-bind'),false,true))}`
fxy060608's avatar
init v3  
fxy060608 已提交
138 139 140 141 142 143
    )
  })

  it('generate v-model directive', () => {
    assertCodegen(
      '<input v-model="test">',
fxy060608's avatar
fxy060608 已提交
144
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function(){},expression:"test"}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
145 146 147 148 149 150
    )
  })

  it('generate multiline v-model directive', () => {
    assertCodegen(
      '<input v-model="\n test \n">',
fxy060608's avatar
fxy060608 已提交
151
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function(){},expression:"\\n test \\n"}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
152 153 154 155 156 157
    )
  })

  it('generate multiline v-model directive on custom component', () => {
    assertCodegen(
      '<my-component v-model="\n test \n" />',
fxy060608's avatar
fxy060608 已提交
158
      `with(this){return _c('my-component',{attrs:{"_i":0},model:{value:_$g(0,'v-model'),callback:function(){},expression:"\\n test \\n"}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
159 160 161 162 163 164
    )
  })

  it('generate template tag', () => {
    assertCodegen(
      '<div><template><p>{{hello}}</p></template></div>',
fxy060608's avatar
fxy060608 已提交
165
      `with(this){return _c('div',{attrs:{"_i":0}},[[_c('p',{attrs:{"_i":2}},[_v((_$g(2,'t0')))])]],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
166 167 168 169 170 171
    )
  })

  it('generate single slot', () => {
    assertCodegen(
      '<div><slot></slot></div>',
fxy060608's avatar
fxy060608 已提交
172
      `with(this){return _c('div',{attrs:{"_i":0}},[_t("default",null,{"_i":1})],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
173 174 175 176 177 178
    )
  })

  it('generate named slot', () => {
    assertCodegen(
      '<div><slot name="one"></slot></div>',
fxy060608's avatar
fxy060608 已提交
179
      `with(this){return _c('div',{attrs:{"_i":0}},[_t("one",null,{"_i":1})],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
180 181 182 183 184 185
    )
  })

  it('generate slot fallback content', () => {
    assertCodegen(
      '<div><slot><div>hi</div></slot></div>',
fxy060608's avatar
fxy060608 已提交
186
      `with(this){return _c('div',{attrs:{"_i":0}},[_t("default",[_c('div',{attrs:{"_i":2}},[_v("hi")])],{"_i":1})],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
187 188 189 190 191 192
    )
  })

  it('generate slot target', () => {
    assertCodegen(
      '<p slot="one">hello world</p>',
fxy060608's avatar
fxy060608 已提交
193
      `with(this){return _c('p',{attrs:{"slot":"one","_i":0},slot:"one"},[_v("hello world")])}`
fxy060608's avatar
init v3  
fxy060608 已提交
194 195 196 197 198 199
    )
  })

  it('generate scoped slot', () => {
    assertCodegen(
      '<foo><template slot-scope="bar">{{ bar }}</template></foo>',
fxy060608's avatar
fxy060608 已提交
200
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"default",fn:function(bar, _svm, _si){return [_v((_svm._$g(("1-"+_si),'t0')))]}}])})}`
fxy060608's avatar
init v3  
fxy060608 已提交
201 202 203
    )
    assertCodegen(
      '<foo><div slot-scope="bar">{{ bar }}</div></foo>',
fxy060608's avatar
fxy060608 已提交
204
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"default",fn:function(bar, _svm, _si){return _c('div',{attrs:{"_i":("1-"+_si)}},[_v((_svm._$g(("1-"+_si),'t0')))])}}])})}`
fxy060608's avatar
init v3  
fxy060608 已提交
205 206 207 208 209 210
    )
  })

  it('generate named scoped slot', () => {
    assertCodegen(
      '<foo><template slot="foo" slot-scope="bar">{{ bar }}</template></foo>',
fxy060608's avatar
fxy060608 已提交
211
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"foo",fn:function(bar, _svm, _si){return [_v((_svm._$g(("1-"+_si),'t0')))]}}])})}`
fxy060608's avatar
init v3  
fxy060608 已提交
212 213 214
    )
    assertCodegen(
      '<foo><div slot="foo" slot-scope="bar">{{ bar }}</div></foo>',
fxy060608's avatar
fxy060608 已提交
215
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"foo",fn:function(bar, _svm, _si){return _c('div',{attrs:{"_i":("1-"+_si)}},[_v((_svm._$g(("1-"+_si),'t0')))])}}])})}`
fxy060608's avatar
init v3  
fxy060608 已提交
216 217 218 219 220 221
    )
  })

  it('generate dynamic scoped slot', () => {
    assertCodegen(
      '<foo><template :slot="foo" slot-scope="bar">{{ bar }}</template></foo>',
fxy060608's avatar
fxy060608 已提交
222
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:foo,fn:function(bar, _svm, _si){return [_v((_svm._$g(("1-"+_si),'t0')))]}}],null,true)})}`
fxy060608's avatar
init v3  
fxy060608 已提交
223 224 225 226 227 228
    )
  })

  it('generate scoped slot with multiline v-if', () => {
    assertCodegen(
      '<foo><template v-if="\nshow\n" slot-scope="bar">{{ bar }}</template></foo>',
fxy060608's avatar
fxy060608 已提交
229
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"default",fn:function(bar, _svm, _si){return (_svm._$g(("1-"+_si),'i'))?[_v((_svm._$g(("1-"+_si),'t0')))]:undefined}}],null,true)})}`
fxy060608's avatar
init v3  
fxy060608 已提交
230 231 232
    )
    assertCodegen(
      '<foo><div v-if="\nshow\n" slot="foo" slot-scope="bar">{{ bar }}</div></foo>',
fxy060608's avatar
fxy060608 已提交
233
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([{key:"foo",fn:function(bar, _svm, _si){return (_svm._$g(("1-"+_si),'i'))?_c('div',{attrs:{"_i":("1-"+_si)}},[_v((_svm._$g(("1-"+_si),'t0')))]):_e()}}],null,true)})}`
fxy060608's avatar
init v3  
fxy060608 已提交
234 235 236 237 238 239
    )
  })

  it('generate scoped slot with new slot syntax', () => {
    assertCodegen(
      '<foo><template v-if="show" #default="bar">{{ bar }}</template></foo>',
fxy060608's avatar
fxy060608 已提交
240
      `with(this){return _c('foo',{attrs:{"_i":0},scopedSlots:_u([(_$g(1,'i'))?{key:"default",fn:function(bar, _svm, _si){return [_v((_svm._$g(("1-"+_si),'t0')))]}}:null],null,true)})}`
fxy060608's avatar
init v3  
fxy060608 已提交
241 242 243 244 245 246 247
    )
  })

  it('generate class binding', () => {
    // static
    assertCodegen(
      '<p class="class1">hello world</p>',
fxy060608's avatar
fxy060608 已提交
248
      `with(this){return _c('p',{staticClass:_$g(0,'sc'),attrs:{"_i":0}},[_v("hello world")])}`
fxy060608's avatar
init v3  
fxy060608 已提交
249 250 251 252
    )
    // dynamic
    assertCodegen(
      '<p :class="class1">hello world</p>',
fxy060608's avatar
fxy060608 已提交
253
      `with(this){return _c('p',{class:_$g(0,'c'),attrs:{"_i":0}},[_v("hello world")])}`
fxy060608's avatar
init v3  
fxy060608 已提交
254 255 256 257 258 259
    )
  })

  it('generate style binding', () => {
    assertCodegen(
      '<p :style="error">hello world</p>',
fxy060608's avatar
fxy060608 已提交
260
      `with(this){return _c('p',{style:(_$g(0,'s')),attrs:{"_i":0}},[_v("hello world")])}`
fxy060608's avatar
init v3  
fxy060608 已提交
261 262 263 264 265 266
    )
  })

  it('generate v-show directive', () => {
    assertCodegen(
      '<p v-show="shown">hello world</p>',
fxy060608's avatar
fxy060608 已提交
267
      `with(this){return _c('p',{directives:[{name:"show",rawName:"v-show",value:(_$g(0,'v-show')),expression:"_$g(0,'v-show')"}],attrs:{"_i":0}},[_v("hello world")])}`
fxy060608's avatar
init v3  
fxy060608 已提交
268 269 270 271 272 273 274
    )
  })

  it('generate DOM props with v-bind directive', () => {
    // input + value
    assertCodegen(
      '<input :value="msg">',
fxy060608's avatar
fxy060608 已提交
275
      `with(this){return _c('v-uni-input',{attrs:{"value":_$g(0,'a-value'),"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
276 277 278 279
    )
    // non input
    assertCodegen(
      '<p :value="msg"/>',
fxy060608's avatar
fxy060608 已提交
280
      `with(this){return _c('p',{attrs:{"value":_$g(0,'a-value'),"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
281 282 283 284 285 286
    )
  })

  it('generate attrs with v-bind directive', () => {
    assertCodegen(
      '<input :name="field1">',
fxy060608's avatar
fxy060608 已提交
287
      `with(this){return _c('v-uni-input',{attrs:{"name":_$g(0,'a-name'),"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
288 289 290 291 292 293
    )
  })

  it('generate static attrs', () => {
    assertCodegen(
      '<input name="field1">',
fxy060608's avatar
fxy060608 已提交
294
      `with(this){return _c('v-uni-input',{attrs:{"name":"field1","_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
295 296 297 298 299 300
    )
  })

  it('generate events with v-on directive', () => {
    assertCodegen(
      '<input @input="onInput">',
fxy060608's avatar
fxy060608 已提交
301
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
302 303 304 305 306 307
    )
  })

  it('generate events with method call', () => {
    assertCodegen(
      '<input @input="onInput($event);">',
fxy060608's avatar
fxy060608 已提交
308
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
309 310 311 312
    )
    // empty arguments
    assertCodegen(
      '<input @input="onInput();">',
fxy060608's avatar
fxy060608 已提交
313
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
314 315 316 317
    )
    // without semicolon
    assertCodegen(
      '<input @input="onInput($event)">',
fxy060608's avatar
fxy060608 已提交
318
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
319 320 321 322
    )
    // multiple args
    assertCodegen(
      '<input @input="onInput($event, \'abc\', 5);">',
fxy060608's avatar
fxy060608 已提交
323
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
324 325 326 327
    )
    // expression in args
    assertCodegen(
      '<input @input="onInput($event, 2+2);">',
fxy060608's avatar
fxy060608 已提交
328
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
329 330 331 332
    )
    // tricky symbols in args
    assertCodegen(
      `<input @input="onInput(');[\\'());');">`,
fxy060608's avatar
fxy060608 已提交
333
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
334 335 336 337 338
    )
    // function name including a `function` part (#9920)
    // 2.6.10 暂未修复此 bug
    // assertCodegen(
    //   '<input @input="functionName()">',
fxy060608's avatar
fxy060608 已提交
339
    //   `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return functionName()}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
340 341 342 343 344 345 346
    // )
  })

  it('generate events with multiple statements', () => {
    // normal function
    assertCodegen(
      '<input @input="onInput1();onInput2()">',
fxy060608's avatar
fxy060608 已提交
347
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
348 349 350 351
    )
    // function with multiple args
    assertCodegen(
      '<input @input="onInput1($event, \'text\');onInput2(\'text2\', $event)">',
fxy060608's avatar
fxy060608 已提交
352
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
353 354 355 356 357 358
    )
  })

  it('generate events with keycode', () => {
    assertCodegen(
      '<input @input.enter="onInput">',
fxy060608's avatar
fxy060608 已提交
359
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"enter":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
360 361 362 363
    )
    // multiple keycodes (delete)
    assertCodegen(
      '<input @input.delete="onInput">',
fxy060608's avatar
fxy060608 已提交
364
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"delete":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
365 366 367 368
    )
    // multiple keycodes (esc)
    assertCodegen(
      '<input @input.esc="onInput">',
fxy060608's avatar
fxy060608 已提交
369
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"esc":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
370 371 372 373
    )
    // multiple keycodes (space)
    assertCodegen(
      '<input @input.space="onInput">',
fxy060608's avatar
fxy060608 已提交
374
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"space":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
375 376 377 378
    )
    // multiple keycodes (chained)
    assertCodegen(
      '<input @keydown.enter.delete="onInput">',
fxy060608's avatar
fxy060608 已提交
379
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"keydown":function($event){return $handleViewEvent($event,{"enter":true,"delete":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
380 381 382 383
    )
    // number keycode
    assertCodegen(
      '<input @input.13="onInput">',
fxy060608's avatar
fxy060608 已提交
384
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"13":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
385 386 387 388
    )
    // custom keycode
    assertCodegen(
      '<input @input.custom="onInput">',
fxy060608's avatar
fxy060608 已提交
389
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"custom":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
390 391 392 393 394 395
    )
  })

  it('generate events with generic modifiers', () => {
    assertCodegen(
      '<input @input.stop="onInput">',
fxy060608's avatar
fxy060608 已提交
396
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"stop":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
397 398 399
    )
    assertCodegen(
      '<input @input.prevent="onInput">',
fxy060608's avatar
fxy060608 已提交
400
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"prevent":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
401 402 403
    )
    assertCodegen(
      '<input @input.self="onInput">',
fxy060608's avatar
fxy060608 已提交
404
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"self":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
405 406 407 408 409 410 411
    )
  })

  // GitHub Issues #5146
  it('generate events with generic modifiers and keycode correct order', () => {
    assertCodegen(
      '<input @keydown.enter.prevent="onInput">',
fxy060608's avatar
fxy060608 已提交
412
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"keydown":function($event){return $handleViewEvent($event,{"enter":true,"prevent":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
413 414 415 416
    )

    assertCodegen(
      '<input @keydown.enter.stop="onInput">',
fxy060608's avatar
fxy060608 已提交
417
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"keydown":function($event){return $handleViewEvent($event,{"enter":true,"stop":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
418 419 420 421 422 423
    )
  })

  it('generate events with mouse event modifiers', () => {
    assertCodegen(
      '<input @click.ctrl="onClick">',
fxy060608's avatar
fxy060608 已提交
424
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"ctrl":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
425 426 427
    )
    assertCodegen(
      '<input @click.shift="onClick">',
fxy060608's avatar
fxy060608 已提交
428
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"shift":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
429 430 431
    )
    assertCodegen(
      '<input @click.alt="onClick">',
fxy060608's avatar
fxy060608 已提交
432
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"alt":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
433 434 435
    )
    assertCodegen(
      '<input @click.meta="onClick">',
fxy060608's avatar
fxy060608 已提交
436
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"meta":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
437 438 439
    )
    assertCodegen(
      '<input @click.exact="onClick">',
fxy060608's avatar
fxy060608 已提交
440
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"exact":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
441 442 443
    )
    assertCodegen(
      '<input @click.ctrl.exact="onClick">',
fxy060608's avatar
fxy060608 已提交
444
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"click":function($event){return $handleViewEvent($event,{"ctrl":true,"exact":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
445 446 447 448 449 450
    )
  })

  it('generate events with multiple modifiers', () => {
    assertCodegen(
      '<input @input.stop.prevent.self="onInput">',
fxy060608's avatar
fxy060608 已提交
451
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"stop":true,"prevent":true,"self":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
452 453 454 455 456 457
    )
  })

  it('generate events with capture modifier', () => {
    assertCodegen(
      '<input @input.capture="onInput">',
fxy060608's avatar
fxy060608 已提交
458
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"!input":function($event){return $handleViewEvent($event,{"capture":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
459 460 461 462 463 464
    )
  })

  it('generate events with once modifier', () => {
    assertCodegen(
      '<input @input.once="onInput">',
fxy060608's avatar
fxy060608 已提交
465
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"~input":function($event){return $handleViewEvent($event,{"once":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
466 467 468 469 470 471
    )
  })

  it('generate events with capture and once modifier', () => {
    assertCodegen(
      '<input @input.capture.once="onInput">',
fxy060608's avatar
fxy060608 已提交
472
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"~!input":function($event){return $handleViewEvent($event,{"once":true,"capture":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
473 474 475 476 477 478
    )
  })

  it('generate events with once and capture modifier', () => {
    assertCodegen(
      '<input @input.once.capture="onInput">',
fxy060608's avatar
fxy060608 已提交
479
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"~!input":function($event){return $handleViewEvent($event,{"once":true,"capture":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
480 481 482 483 484 485
    )
  })

  it('generate events with inline statement', () => {
    assertCodegen(
      '<input @input="current++">',
fxy060608's avatar
fxy060608 已提交
486
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
487 488 489 490 491 492 493
    )
  })

  it('generate events with inline function expression', () => {
    // normal function
    assertCodegen(
      '<input @input="function () { current++ }">',
fxy060608's avatar
fxy060608 已提交
494
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
495 496 497 498
    )
    // normal named function
    assertCodegen(
      '<input @input="function fn () { current++ }">',
fxy060608's avatar
fxy060608 已提交
499
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
500 501 502 503
    )
    // arrow with no args
    assertCodegen(
      '<input @input="()=>current++">',
fxy060608's avatar
fxy060608 已提交
504
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
505 506 507 508
    )
    // arrow with parens, single arg
    assertCodegen(
      '<input @input="(e) => current++">',
fxy060608's avatar
fxy060608 已提交
509
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
510 511 512 513
    )
    // arrow with parens, multi args
    assertCodegen(
      '<input @input="(a, b, c) => current++">',
fxy060608's avatar
fxy060608 已提交
514
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
515 516 517 518
    )
    // arrow with destructuring
    assertCodegen(
      '<input @input="({ a, b }) => current++">',
fxy060608's avatar
fxy060608 已提交
519
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
520 521 522 523
    )
    // arrow single arg no parens
    assertCodegen(
      '<input @input="e=>current++">',
fxy060608's avatar
fxy060608 已提交
524
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
525 526 527 528
    )
    // with modifiers
    assertCodegen(
      `<input @keyup.enter="e=>current++">`,
fxy060608's avatar
fxy060608 已提交
529
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"keyup":function($event){return $handleViewEvent($event,{"enter":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
530 531 532 533 534 535 536
    )
  })

  // #3893
  it('should not treat handler with unexpected whitespace as inline statement', () => {
    assertCodegen(
      '<input @input=" onInput ">',
fxy060608's avatar
fxy060608 已提交
537
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
538 539 540 541 542 543
    )
  })

  it('generate unhandled events', () => {
    assertCodegen(
      '<input @input="current++">',
fxy060608's avatar
fxy060608 已提交
544
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event)}}})}`,
fxy060608's avatar
init v3  
fxy060608 已提交
545 546 547 548 549 550 551 552 553
      ast => {
        ast.events.input = undefined
      }
    )
  })

  it('generate multiple event handlers', () => {
    assertCodegen(
      '<input @input="current++" @input.stop="onInput">',
fxy060608's avatar
fxy060608 已提交
554
      `with(this){return _c('v-uni-input',{attrs:{"_i":0},on:{"input":function($event){return $handleViewEvent($event,{"stop":true})}}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
555 556 557 558 559 560
    )
  })

  it('generate component', () => {
    assertCodegen(
      '<my-component name="mycomponent1" :msg="msg" @notify="onNotify"><div>hi</div></my-component>',
fxy060608's avatar
fxy060608 已提交
561
      `with(this){return _c('my-component',{attrs:{"_i":0},on:{"notify":function($event){return $handleViewEvent($event)}}},[_c('div',{attrs:{"_i":1}},[_v("hi")])],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
562 563 564 565 566 567
    )
  })

  it('generate svg component with children', () => {
    assertCodegen(
      '<svg><my-comp><circle :r="10"></circle></my-comp></svg>',
fxy060608's avatar
fxy060608 已提交
568
      `with(this){return _c('svg',{attrs:{"_i":0}},[_c('my-comp',{attrs:{"_i":1}},[_c('circle',{attrs:{"_i":2}})],1)],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
569 570 571 572 573 574
    )
  })

  it('generate is attribute', () => {
    assertCodegen(
      '<div is="component1"></div>',
fxy060608's avatar
fxy060608 已提交
575
      `with(this){return _c("component1",{tag:"div",attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
576 577 578
    )
    assertCodegen(
      '<div :is="component1"></div>',
fxy060608's avatar
fxy060608 已提交
579
      `with(this){return _c(_$g(0,'is'),{tag:"div",attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
580 581 582 583
    )
    // maybe a component and normalize type should be 1
    assertCodegen(
      '<div><div is="component1"></div></div>',
fxy060608's avatar
fxy060608 已提交
584
      `with(this){return _c('div',{attrs:{"_i":0}},[_c("component1",{tag:"div",attrs:{"_i":1}})],1)}`
fxy060608's avatar
init v3  
fxy060608 已提交
585 586 587 588 589 590 591
    )
  })

  it('generate component with inline-template', () => {
    // have "inline-template'"
    assertCodegen(
      '<my-component inline-template><p><span>hello world</span></p></my-component>',
fxy060608's avatar
fxy060608 已提交
592
      `with(this){return _c('my-component',{attrs:{"_i":0},inlineTemplate:{render:function(){with(this){return _c('p',{attrs:{"_i":1}},[_c('span',{attrs:{"_i":2}},[_v("hello world")])],1)}},staticRenderFns:[]}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
593 594 595 596
    )
    // "have inline-template attrs, but not having exactly one child element
    assertCodegen(
      '<my-component inline-template><hr><hr></my-component>',
fxy060608's avatar
fxy060608 已提交
597
      `with(this){return _c('my-component',{attrs:{"_i":0},inlineTemplate:{render:function(){with(this){return _c('hr',{attrs:{"_i":1}})}},staticRenderFns:[]}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
598 599 600 601 602 603 604 605
    )
    assertCodegen(
      '<my-component inline-template></my-component>',
      `with(this){return _c('my-component',{attrs:{"_i":0}})}`
    )
    // have "is" attribute
    assertCodegen(
      '<div is="myComponent" inline-template><div></div></div>',
fxy060608's avatar
fxy060608 已提交
606
      `with(this){return _c("myComponent",{tag:"div",attrs:{"_i":0},inlineTemplate:{render:function(){with(this){return _c('div',{attrs:{"_i":1}})}},staticRenderFns:[]}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
607 608 609
    )
    assertCodegen(
      '<div is="myComponent" inline-template></div>',
fxy060608's avatar
fxy060608 已提交
610
      `with(this){return _c("myComponent",{tag:"div",attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
611 612 613 614 615 616 617 618
    )
    // expect('Inline-template components must have exactly one child element.').toHaveBeenWarned()
    // expect(console.error.calls.count()).toBe(3)
  })

  it('generate static trees inside v-for', () => {
    assertCodegen(
      `<div><div v-for="i in 10"><p><span></span></p></div></div>`,
fxy060608's avatar
fxy060608 已提交
619 620
      `with(this){return _c('div',{attrs:{"_i":0}},_l((10),function(i,$10,$20,$30){return _c('div',{attrs:{"_i":("1-"+$30)}},[_c('p',{attrs:{"_i":("2-"+$30)}},[_c('span',{attrs:{"_i":("3-"+$30)}})],1)],1)}),1)}`
      // [`with(this){return _c('p',{attrs:{"_i":("2-"+$i)}},[_c('p',{attrs:{"_i":("3-"+$i)}})])}`]
fxy060608's avatar
init v3  
fxy060608 已提交
621 622 623 624 625 626 627
    )
  })

  it('generate component with v-for', () => {
    // normalize type: 2
    assertCodegen(
      '<div><child></child><template v-for="item in list">{{ item }}</template></div>',
fxy060608's avatar
fxy060608 已提交
628
      `with(this){return _c('div',{attrs:{"_i":0}},[_c('child',{attrs:{"_i":1}}),_l((_$g(2,'f')),function(item,$10,$20,$30){return [_v((_$g(("2-"+$30),'t0')))]})],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
629 630 631 632 633 634 635 636
    )
  })

  // it('generate component with comment', () => {
  //   const options = extend({
  //     comments: true
  //   }, baseOptions)
  //   const template = '<div><!--comment--></div>'
fxy060608's avatar
fxy060608 已提交
637
  //   const generatedCode = `with(this){return _c('p',{attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
638 639 640 641 642 643 644 645 646 647 648 649 650

  //   const ast = parse(template, options)
  //   optimize(ast, options)
  //   const res = generate(ast, options)
  //   expect(res.render).toBe(generatedCode)
  // })

  // #6150
  // it('generate comments with special characters', () => {
  //   const options = extend({
  //     comments: true
  //   }, baseOptions)
  //   const template = '<div><!--\n\'comment\'\n--></div>'
fxy060608's avatar
fxy060608 已提交
651
  //   const generatedCode = `with(this){return _c('p',{attrs:{"_i":0}})}`
fxy060608's avatar
init v3  
fxy060608 已提交
652 653 654 655 656 657 658 659 660 661 662

  //   const ast = parse(template, options)
  //   optimize(ast, options)
  //   const res = generate(ast, options)
  //   expect(res.render).toBe(generatedCode)
  // })

  // #8041
  it('does not squash templates inside v-pre', () => {
    assertCodegen(
      '<div v-pre><template><p>{{msg}}</p></template></div>',
fxy060608's avatar
fxy060608 已提交
663
      `with(this){return _c('div',{pre:true,attrs:{"_i":0}},[[_c('p',{pre:true,attrs:{"_i":2}},[_v("{{msg}}")])]],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
664 665 666
    )
    // const template = '<div v-pre><template><p>{{msg}}</p></template></div>'
    // const generatedCode = `with(this){return _m(0)}`
fxy060608's avatar
fxy060608 已提交
667
    // // const renderFn = `with(this){return _c('p',{pre:true},[_c('template',[_c('p',[_v("{{msg}}")])])],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
668 669 670 671 672 673 674 675 676 677 678 679 680
    // const ast = parse(template, baseOptions)
    // optimize(ast, baseOptions)
    // const res = generate(ast, baseOptions)
    // expect(res.render).toBe(generatedCode)
    // // expect(res.staticRenderFns).toEqual([renderFn])
  })

  it('not specified ast type', () => {
    assertCodegen(
      '',
      `with(this){return _c("div")}`
    )
    // const res = generate(null, baseOptions)
fxy060608's avatar
fxy060608 已提交
681
    // expect(res.render).toBe(`with(this){return _c("p")}`)
fxy060608's avatar
init v3  
fxy060608 已提交
682 683 684 685 686 687
    // expect(res.staticRenderFns).toEqual([])
  })

  it('not specified directives option', () => {
    assertCodegen(
      '<p v-if="show">hello world</p>',
fxy060608's avatar
fxy060608 已提交
688
      `with(this){return (_$g(0,'i'))?_c('p',{attrs:{"_i":0}},[_v("hello world")]):_e()}`, {
fxy060608's avatar
init v3  
fxy060608 已提交
689 690 691 692 693 694 695 696 697
        // isReservedTag
      }
    )
  })

  // #9142
  it('should compile single v-for component inside template', () => {
    assertCodegen(
      `<div><template v-if="ok"><foo v-for="i in 1" :key="i"></foo></template></div>`,
fxy060608's avatar
fxy060608 已提交
698
      `with(this){return _c('div',{attrs:{"_i":0}},[(_$g(1,'i'))?_l((1),function(i,$10,$20,$30){return _c('foo',{key:i,attrs:{"_i":("2-"+$30)}})}):_e()],2)}`
fxy060608's avatar
init v3  
fxy060608 已提交
699 700 701
    )
  })
})
fxy060608's avatar
fxy060608 已提交
702
/* eslint-enable quotes */