fix codegen tests

test/unit/modules/compiler/codegen.spec.js

@@ -29,134 +29,139 @@ function assertCodegen (template, generatedCode, ...args) {
 }
 
 /* eslint-disable quotes */
-xdescribe('codegen', () => {
+describe('codegen', () => {
   it('generate directive', () => {
     assertCodegen(
       '<p v-custom1:arg1.modifier="value1" v-custom2></p>',
-      `with(this){return _h('p',{directives:[{name:"custom1",rawName:"v-custom1:arg1.modifier",value:(value1),expression:"value1",arg:"arg1",modifiers:{"modifier":true}},{name:"custom2",rawName:"v-custom2",arg:"arg1"}]})}`
+      `with(this){return _c('p',{directives:[{name:"custom1",rawName:"v-custom1:arg1.modifier",value:(value1),expression:"value1",arg:"arg1",modifiers:{"modifier":true}},{name:"custom2",rawName:"v-custom2",arg:"arg1"}]})}`
     )
   })
 
   it('generate filters', () => {
     assertCodegen(
       '<div :id="a | b | c">{{ d | e | f }}</div>',
-      `with(this){return _h('div',{attrs:{"id":_f("c")(_f("b")(a))}},[_s(_f("f")(_f("e")(d)))])}`
+      `with(this){return _c('div',{attrs:{"id":_f("c")(_f("b")(a))}},[_v(_s(_f("f")(_f("e")(d))))])}`
     )
   })
 
   it('generate v-for directive', () => {
     assertCodegen(
       '<div><li v-for="item in items" :key="item.uid"></li></div>',
-      `with(this){return _h('div',[_l((items),function(item){return _h('li',{key:item.uid})})])}`
+      `with(this){return _c('div',_l((items),function(item){return _c('li',{key:item.uid})}))}`
     )
     // iterator syntax
     assertCodegen(
       '<div><li v-for="(item, i) in items"></li></div>',
-      `with(this){return _h('div',[_l((items),function(item,i){return _h('li')})])}`
+      `with(this){return _c('div',_l((items),function(item,i){return _c('li')}))}`
     )
     assertCodegen(
       '<div><li v-for="(item, key, index) in items"></li></div>',
-      `with(this){return _h('div',[_l((items),function(item,key,index){return _h('li')})])}`
+      `with(this){return _c('div',_l((items),function(item,key,index){return _c('li')}))}`
     )
     // destructuring
     assertCodegen(
       '<div><li v-for="{ a, b } in items"></li></div>',
-      `with(this){return _h('div',[_l((items),function({ a, b }){return _h('li')})])}`
+      `with(this){return _c('div',_l((items),function({ a, b }){return _c('li')}))}`
     )
     assertCodegen(
       '<div><li v-for="({ a, b }, key, index) in items"></li></div>',
-      `with(this){return _h('div',[_l((items),function({ a, b },key,index){return _h('li')})])}`
+      `with(this){return _c('div',_l((items),function({ a, b },key,index){return _c('li')}))}`
+    )
+    // v-for with extra element
+    assertCodegen(
+      '<div><p></p><li v-for="item in items"></li></div>',
+      `with(this){return _c('div',[_c('p'),_l((items),function(item){return _c('li')})],true)}`
     )
   })
 
   it('generate v-if directive', () => {
     assertCodegen(
       '<p v-if="show">hello</p>',
-      `with(this){return (show)?_h('p',["hello"]):_e()}`
+      `with(this){return (show)?_c('p',[_v("hello")]):_e()}`
     )
   })
 
   it('generate v-else directive', () => {
     assertCodegen(
       '<div><p v-if="show">hello</p><p v-else>world</p></div>',
-      `with(this){return _h('div',[(show)?_h('p',["hello"]):_h('p',["world"])])}`
+      `with(this){return _c('div',[(show)?_c('p',[_v("hello")]):_c('p',[_v("world")])])}`
     )
   })
 
   it('generate v-else-if directive', () => {
     assertCodegen(
       '<div><p v-if="show">hello</p><p v-else-if="hide">world</p></div>',
-      `with(this){return _h('div',[(show)?_h('p',["hello"]):(hide)?_h('p',["world"]):_e()])}`
+      `with(this){return _c('div',[(show)?_c('p',[_v("hello")]):(hide)?_c('p',[_v("world")]):_e()])}`
     )
   })
 
   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>',
-      `with(this){return _h('div',[(show)?_h('p',["hello"]):(hide)?_h('p',["world"]):_h('p',["bye"])])}`
+      `with(this){return _c('div',[(show)?_c('p',[_v("hello")]):(hide)?_c('p',[_v("world")]):_c('p',[_v("bye")])])}`
     )
   })
 
   it('generate mutli 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>',
-        `with(this){return _h('div',[(show)?_h('p',["hello"]):(hide)?_h('p',["world"]):(3)?_h('p',["elseif"]):_h('p',["bye"])])}`
+        `with(this){return _c('div',[(show)?_c('p',[_v("hello")]):(hide)?_c('p',[_v("world")]):(3)?_c('p',[_v("elseif")]):_c('p',[_v("bye")])])}`
     )
   })
 
   it('generate ref', () => {
     assertCodegen(
       '<p ref="component1"></p>',
-      `with(this){return _h('p',{ref:"component1"})}`
+      `with(this){return _c('p',{ref:"component1"})}`
     )
   })
 
   it('generate ref on v-for', () => {
     assertCodegen(
       '<ul><li v-for="item in items" ref="component1"></li></ul>',
-      `with(this){return _h('ul',[_l((items),function(item){return _h('li',{ref:"component1",refInFor:true})})])}`
+      `with(this){return _c('ul',_l((items),function(item){return _c('li',{ref:"component1",refInFor:true})}))}`
     )
   })
 
   it('generate v-bind directive', () => {
     assertCodegen(
       '<p v-bind="test"></p>',
-      `with(this){return _h('p',_b({},'p',test))}`
+      `with(this){return _c('p',_b({},'p',test))}`
     )
   })
 
   it('generate template tag', () => {
     assertCodegen(
       '<div><template><p>{{hello}}</p></template></div>',
-      `with(this){return _h('div',[[_h('p',[_s(hello)])]])}`
+      `with(this){return _c('div',[[_c('p',[_v(_s(hello))])]],true)}`
     )
   })
 
   it('generate single slot', () => {
     assertCodegen(
       '<div><slot></slot></div>',
-      `with(this){return _h('div',[_t("default")])}`
+      `with(this){return _c('div',[_t("default")],true)}`
     )
   })
 
   it('generate named slot', () => {
     assertCodegen(
       '<div><slot name="one"></slot></div>',
-      `with(this){return _h('div',[_t("one")])}`
+      `with(this){return _c('div',[_t("one")],true)}`
     )
   })
 
   it('generate slot fallback content', () => {
     assertCodegen(
       '<div><slot><div>hi</div></slot></div>',
-      `with(this){return _h('div',[_t("default",[_h('div',["hi"])])])}`
+      `with(this){return _c('div',[_t("default",[_c('div',[_v("hi")])])],true)}`
     )
   })
 
   it('generate slot target', () => {
     assertCodegen(
       '<p slot="one">hello world</p>',
-      `with(this){return _h('p',{slot:"one"},["hello world"])}`
+      `with(this){return _c('p',{slot:"one"},[_v("hello world")])}`
     )
   })
 
@@ -164,26 +169,26 @@ xdescribe('codegen', () => {
     // static
     assertCodegen(
       '<p class="class1">hello world</p>',
-      `with(this){return _h('p',{staticClass:"class1"},["hello world"])}`,
+      `with(this){return _c('p',{staticClass:"class1"},[_v("hello world")])}`,
     )
     // dynamic
     assertCodegen(
       '<p :class="class1">hello world</p>',
-      `with(this){return _h('p',{class:class1},["hello world"])}`
+      `with(this){return _c('p',{class:class1},[_v("hello world")])}`
     )
   })
 
   it('generate style binding', () => {
     assertCodegen(
       '<p :style="error">hello world</p>',
-      `with(this){return _h('p',{style:(error)},["hello world"])}`
+      `with(this){return _c('p',{style:(error)},[_v("hello world")])}`
     )
   })
 
   it('generate v-show directive', () => {
     assertCodegen(
       '<p v-show="shown">hello world</p>',
-      `with(this){return _h('p',{directives:[{name:"show",rawName:"v-show",value:(shown),expression:"shown"}]},["hello world"])}`
+      `with(this){return _c('p',{directives:[{name:"show",rawName:"v-show",value:(shown),expression:"shown"}]},[_v("hello world")])}`
     )
   })
 
@@ -191,136 +196,136 @@ xdescribe('codegen', () => {
     // input + value
     assertCodegen(
       '<input :value="msg">',
-      `with(this){return _h('input',{domProps:{"value":msg}})}`
+      `with(this){return _c('input',{domProps:{"value":msg}})}`
     )
     // non input
     assertCodegen(
       '<p :value="msg">',
-      `with(this){return _h('p',{attrs:{"value":msg}})}`
+      `with(this){return _c('p',{attrs:{"value":msg}})}`
     )
   })
 
   it('generate attrs with v-bind directive', () => {
     assertCodegen(
       '<input :name="field1">',
-      `with(this){return _h('input',{attrs:{"name":field1}})}`
+      `with(this){return _c('input',{attrs:{"name":field1}})}`
     )
   })
 
   it('generate static attrs', () => {
     assertCodegen(
       '<input name="field1">',
-      `with(this){return _h('input',{attrs:{"name":"field1"}})}`
+      `with(this){return _c('input',{attrs:{"name":"field1"}})}`
     )
   })
 
   it('generate events with v-on directive', () => {
     assertCodegen(
       '<input @input="onInput">',
-      `with(this){return _h('input',{on:{"input":onInput}})}`
+      `with(this){return _c('input',{on:{"input":onInput}})}`
     )
   })
 
   it('generate events with keycode', () => {
     assertCodegen(
       '<input @input.enter="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){if(_k($event.keyCode,"enter",13))return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){if(_k($event.keyCode,"enter",13))return;onInput($event)}}})}`
     )
     // multiple keycodes (delete)
     assertCodegen(
       '<input @input.delete="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){if(_k($event.keyCode,"delete",[8,46]))return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){if(_k($event.keyCode,"delete",[8,46]))return;onInput($event)}}})}`
     )
     // multiple keycodes (chained)
     assertCodegen(
       '<input @keydown.enter.delete="onInput">',
-      `with(this){return _h('input',{on:{"keydown":function($event){if(_k($event.keyCode,"enter",13)&&_k($event.keyCode,"delete",[8,46]))return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"keydown":function($event){if(_k($event.keyCode,"enter",13)&&_k($event.keyCode,"delete",[8,46]))return;onInput($event)}}})}`
     )
     // number keycode
     assertCodegen(
       '<input @input.13="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){if($event.keyCode!==13)return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){if($event.keyCode!==13)return;onInput($event)}}})}`
     )
     // custom keycode
     assertCodegen(
       '<input @input.custom="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){if(_k($event.keyCode,"custom"))return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){if(_k($event.keyCode,"custom"))return;onInput($event)}}})}`
     )
   })
 
   it('generate events with generic modifiers', () => {
     assertCodegen(
       '<input @input.stop="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){$event.stopPropagation();onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){$event.stopPropagation();onInput($event)}}})}`
     )
     assertCodegen(
       '<input @input.prevent="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){$event.preventDefault();onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){$event.preventDefault();onInput($event)}}})}`
     )
     assertCodegen(
       '<input @input.self="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){if($event.target !== $event.currentTarget)return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){if($event.target !== $event.currentTarget)return;onInput($event)}}})}`
     )
   })
 
   it('generate events with mouse event modifiers', () => {
     assertCodegen(
       '<input @click.ctrl="onClick">',
-      `with(this){return _h('input',{on:{"click":function($event){if(!$event.ctrlKey)return;onClick($event)}}})}`
+      `with(this){return _c('input',{on:{"click":function($event){if(!$event.ctrlKey)return;onClick($event)}}})}`
     )
     assertCodegen(
       '<input @click.shift="onClick">',
-      `with(this){return _h('input',{on:{"click":function($event){if(!$event.shiftKey)return;onClick($event)}}})}`
+      `with(this){return _c('input',{on:{"click":function($event){if(!$event.shiftKey)return;onClick($event)}}})}`
     )
     assertCodegen(
       '<input @click.alt="onClick">',
-      `with(this){return _h('input',{on:{"click":function($event){if(!$event.altKey)return;onClick($event)}}})}`
+      `with(this){return _c('input',{on:{"click":function($event){if(!$event.altKey)return;onClick($event)}}})}`
     )
     assertCodegen(
       '<input @click.meta="onClick">',
-      `with(this){return _h('input',{on:{"click":function($event){if(!$event.metaKey)return;onClick($event)}}})}`
+      `with(this){return _c('input',{on:{"click":function($event){if(!$event.metaKey)return;onClick($event)}}})}`
     )
   })
 
   it('generate events with multiple modifers', () => {
     assertCodegen(
       '<input @input.stop.prevent.self="onInput">',
-      `with(this){return _h('input',{on:{"input":function($event){$event.stopPropagation();$event.preventDefault();if($event.target !== $event.currentTarget)return;onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){$event.stopPropagation();$event.preventDefault();if($event.target !== $event.currentTarget)return;onInput($event)}}})}`
     )
   })
 
   it('generate events with capture modifier', () => {
     assertCodegen(
       '<input @input.capture="onInput">',
-      `with(this){return _h('input',{on:{"!input":function($event){onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"!input":function($event){onInput($event)}}})}`
     )
   })
 
   it('generate events with once modifier', () => {
     assertCodegen(
       '<input @input.once="onInput">',
-      `with(this){return _h('input',{on:{"~input":function($event){onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"~input":function($event){onInput($event)}}})}`
     )
   })
 
   it('generate events with capture and once modifier', () => {
     assertCodegen(
       '<input @input.capture.once="onInput">',
-      `with(this){return _h('input',{on:{"~!input":function($event){onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"~!input":function($event){onInput($event)}}})}`
     )
   })
 
   it('generate events with once and capture modifier', () => {
     assertCodegen(
       '<input @input.once.capture="onInput">',
-      `with(this){return _h('input',{on:{"~!input":function($event){onInput($event)}}})}`
+      `with(this){return _c('input',{on:{"~!input":function($event){onInput($event)}}})}`
     )
   })
 
   it('generate events with inline statement', () => {
     assertCodegen(
       '<input @input="curent++">',
-      `with(this){return _h('input',{on:{"input":function($event){curent++}}})}`
+      `with(this){return _c('input',{on:{"input":function($event){curent++}}})}`
     )
   })
 
@@ -328,32 +333,32 @@ xdescribe('codegen', () => {
     // normal function
     assertCodegen(
       '<input @input="function () { current++ }">',
-      `with(this){return _h('input',{on:{"input":function () { current++ }}})}`
+      `with(this){return _c('input',{on:{"input":function () { current++ }}})}`
     )
     // arrow with no args
     assertCodegen(
       '<input @input="()=>current++">',
-      `with(this){return _h('input',{on:{"input":()=>current++}})}`
+      `with(this){return _c('input',{on:{"input":()=>current++}})}`
     )
     // arrow with parens, single arg
     assertCodegen(
       '<input @input="(e) => current++">',
-      `with(this){return _h('input',{on:{"input":(e) => current++}})}`
+      `with(this){return _c('input',{on:{"input":(e) => current++}})}`
     )
     // arrow with parens, multi args
     assertCodegen(
       '<input @input="(a, b, c) => current++">',
-      `with(this){return _h('input',{on:{"input":(a, b, c) => current++}})}`
+      `with(this){return _c('input',{on:{"input":(a, b, c) => current++}})}`
     )
     // arrow with destructuring
     assertCodegen(
       '<input @input="({ a, b }) => current++">',
-      `with(this){return _h('input',{on:{"input":({ a, b }) => current++}})}`
+      `with(this){return _c('input',{on:{"input":({ a, b }) => current++}})}`
     )
     // arrow single arg no parens
     assertCodegen(
       '<input @input="e=>current++">',
-      `with(this){return _h('input',{on:{"input":e=>current++}})}`
+      `with(this){return _c('input',{on:{"input":e=>current++}})}`
     )
   })
 
@@ -361,14 +366,14 @@ xdescribe('codegen', () => {
   it('should not treat handler with unexpected whitespace as inline statement', () => {
     assertCodegen(
       '<input @input=" onInput ">',
-      `with(this){return _h('input',{on:{"input": onInput }})}`
+      `with(this){return _c('input',{on:{"input": onInput }})}`
     )
   })
 
   it('generate unhandled events', () => {
     assertCodegen(
       '<input @input="curent++">',
-      `with(this){return _h('input',{on:{"input":function(){}}})}`,
+      `with(this){return _c('input',{on:{"input":function(){}}})}`,
       ast => {
         ast.events.input = undefined
       }
@@ -378,32 +383,32 @@ xdescribe('codegen', () => {
   it('generate multiple event handlers', () => {
     assertCodegen(
       '<input @input="curent++" @input.stop="onInput">',
-      `with(this){return _h('input',{on:{"input":[function($event){curent++},function($event){$event.stopPropagation();onInput($event)}]}})}`
+      `with(this){return _c('input',{on:{"input":[function($event){curent++},function($event){$event.stopPropagation();onInput($event)}]}})}`
     )
   })
 
   it('generate component', () => {
     assertCodegen(
       '<my-component name="mycomponent1" :msg="msg" @notify="onNotify"><div>hi</div></my-component>',
-      `with(this){return _h('my-component',{attrs:{"name":"mycomponent1","msg":msg},on:{"notify":onNotify}},[_h('div',["hi"])])}`
+      `with(this){return _c('my-component',{attrs:{"name":"mycomponent1","msg":msg},on:{"notify":onNotify}},[_c('div',[_v("hi")])])}`
     )
   })
 
   it('generate svg component with children', () => {
     assertCodegen(
       '<svg><my-comp><circle :r="10"></circle></my-comp></svg>',
-      `with(this){return _h('svg',[_h('my-comp',[_h('circle',{attrs:{"r":10}})])])}`
+      `with(this){return _c('svg',[_c('my-comp',[_c('circle',{attrs:{"r":10}})])])}`
     )
   })
 
   it('generate is attribute', () => {
     assertCodegen(
       '<div is="component1"></div>',
-      `with(this){return _h("component1",{tag:"div"})}`
+      `with(this){return _c("component1",{tag:"div"})}`
     )
     assertCodegen(
       '<div :is="component1"></div>',
-      `with(this){return _h(component1,{tag:"div"})}`
+      `with(this){return _c(component1,{tag:"div"})}`
     )
   })
 
@@ -411,12 +416,12 @@ xdescribe('codegen', () => {
     // have "inline-template'"
     assertCodegen(
       '<my-component inline-template><p><span>hello world</span></p></my-component>',
-      `with(this){return _h('my-component',{inlineTemplate:{render:function(){with(this){return _m(0)}},staticRenderFns:[function(){with(this){return _h('p',[_h('span',["hello world"])])}}]}})}`
+      `with(this){return _c('my-component',{inlineTemplate:{render:function(){with(this){return _m(0)}},staticRenderFns:[function(){with(this){return _c('p',[_c('span',[_v("hello world")])])}}]}})}`
     )
     // "have inline-template attrs, but not having extactly one child element
     assertCodegen(
       '<my-component inline-template><hr><hr></my-component>',
-      `with(this){return _h('my-component',{inlineTemplate:{render:function(){with(this){return _h('hr')}},staticRenderFns:[]}})}`
+      `with(this){return _c('my-component',{inlineTemplate:{render:function(){with(this){return _c('hr')}},staticRenderFns:[]}})}`
     )
     expect('Inline-template components must have exactly one child element.').toHaveBeenWarned()
   })
@@ -424,21 +429,21 @@ xdescribe('codegen', () => {
   it('generate static trees inside v-for', () => {
     assertCodegen(
       `<div><div v-for="i in 10"><p><span></span></p></div></div>`,
-      `with(this){return _h('div',[_l((10),function(i){return _h('div',[_m(0,true)])})])}`,
-      [`with(this){return _h('p',[_h('span')])}`]
+      `with(this){return _c('div',_l((10),function(i){return _c('div',[_m(0,true)])}))}`,
+      [`with(this){return _c('p',[_c('span')])}`]
     )
   })
 
   it('not specified ast type', () => {
     const res = generate(null, baseOptions)
-    expect(res.render).toBe(`with(this){return _h("div")}`)
+    expect(res.render).toBe(`with(this){return _c("div")}`)
     expect(res.staticRenderFns).toEqual([])
   })
 
   it('not specified directives option', () => {
     assertCodegen(
       '<p v-if="show">hello world</p>',
-      `with(this){return (show)?_h('p',["hello world"]):_e()}`,
+      `with(this){return (show)?_c('p',[_v("hello world")]):_e()}`,
       { isReservedTag }
     )
   })