刮刮前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

94 lines
4.1 KiB

const {
transformTemplate
} = require('../lib/mp-weixin/transform/template-transformer')
function assertCodegen(wxmlCode, vueCode) {
expect(transformTemplate(wxmlCode)[0]).toBe(vueCode)
}
describe('wxml:compiler', () => {
it('generate event', () => {
assertCodegen(
`<view bindtouchstart="startDrag" catchtouchmove="{{ catchMove ? 'noop' : '' }}"/>`,
`<uni-shadow-root><view @touchstart="startDrag" @touchmove.stop.prevent="_$self[(catchMove ? 'noop' : '')||'_$noop']($event)"></view></uni-shadow-root>`
)
assertCodegen(
`<uni-transition bind:click="click" bindtouchstart="startDrag" catchtouchmove="{{ catchMove ? 'noop' : '' }}"/>`,
`<uni-shadow-root><uni-transition @click="click" @touchstart.native="startDrag" @touchmove.native.stop.prevent="_$self[(catchMove ? 'noop' : '')||'_$noop']($event)"></uni-transition></uni-shadow-root>`
)
assertCodegen(
'<template name="toolbar"><view bindtap="emit"></view></template>',
// `<view @click="_$self.$parent[(emit)||'_$noop']($event)"></view>`
`<uni-shadow-root><template v-if="wxTemplateName === 'toolbar'"><view @click="_$self.$parent[('emit')]($event)"></view></template></uni-shadow-root>`
)
})
it('generate class', () => {
assertCodegen(
`<view class="van-notice-bar__content {{ !scrollable && !wrapable ? 'van-ellipsis' : '' }}"></view>`,
`<uni-shadow-root><view :class="'van-notice-bar__content '+(!scrollable && !wrapable ? 'van-ellipsis' : '')"></view></uni-shadow-root>`
)
})
it('generate v-if', () => {
assertCodegen(
'<block wx:if="{{ !loading }}" loading loading-text="">{{ item.name }}</block>',
`<uni-shadow-root><block v-if="(!loading)" loading loading-text>{{ item.name }}</block></uni-shadow-root>`
)
})
it('generate v-for', () => {
assertCodegen(
'<view wx:for="{{ isSimple(columns) ? [columns] : columns }}" wx:for-item="item1" wx:key="{{ index }}"/>',
`<uni-shadow-root><view v-for="(item1,index) in (isSimple(columns) ? [columns] : columns)" :key="item1.index"></view></uni-shadow-root>`
)
assertCodegen(
'<view wx:for="{{ columns }}" wx:for-item="item1" wx:key="item1"/>',
`<uni-shadow-root><view v-for="(item1,index) in (columns)" :key="item1"></view></uni-shadow-root>`
)
assertCodegen(
'<view wx:for="{{ columns }}" wx:for-item="index" wx:key="*this"/>',
`<uni-shadow-root><view v-for="(index,___i___) in (columns)" :key="index"></view></uni-shadow-root>`
)
assertCodegen(
'<view wx:for="{{ columns }}" wx:for-item="item" wx:key="{{item.value}}"/>',
`<uni-shadow-root><view v-for="(item,index) in (columns)" :key="item.value"></view></uni-shadow-root>`
)
})
it('generate root element', () => {
assertCodegen(
'<view></view><view></view>',
`<uni-shadow-root><view></view><view></view></uni-shadow-root>`
)
assertCodegen(
`<view></view>
<wxs></wxs>`,
`<uni-shadow-root><view></view></uni-shadow-root>`
)
assertCodegen(
'<slot></slot>',
`<uni-shadow-root><slot></slot></uni-shadow-root>`
)
assertCodegen(
`<import src="./toolbar.wxml" /><view></view>
<wxs></wxs>`,
`<uni-shadow-root><view></view></uni-shadow-root>`
)
assertCodegen(
'<view><template is="toolbar" data="{{ showToolbar, cancelButtonText, title, confirmButtonText }}"></template></view>',
`<uni-shadow-root><view><toolbar v-bind="{showToolbar, cancelButtonText, title, confirmButtonText}" wx-template-name="toolbar"></toolbar></view></uni-shadow-root>`
)
assertCodegen(
'<template name="toolbar"><view></view></template>',
// `<view></view>`
`<uni-shadow-root><template v-if="wxTemplateName === 'toolbar'"><view></view></template></uni-shadow-root>`
)
assertCodegen(
'<template name="toolbar1"><view></view></template><template name="toolbar2"><view></view></template>',
`<uni-shadow-root><template v-if="wxTemplateName === 'toolbar1'"><view></view></template><template v-if="wxTemplateName === 'toolbar2'"><view></view></template></uni-shadow-root>`
)
})
})