提交 fe0aa991 编写于 作者: 辛宝Otto's avatar 辛宝Otto 🥊

test: 补充 props-emits 返回值测试

上级 b0bf1462
const PAGE_PATH = "/pages/component-instance/methods/call-method-easycom-uni-modules-composition"
let page
beforeAll(async () => {
page = await program.reLaunch(PAGE_PATH)
await page.waitFor('view')
})
it('callMethodTest', async () => {
// a[[]] only issue 8582
if (process.env.uniTestPlatformInfo.toLowerCase().startsWith('web')) {
expect(1).toBe(1)
return
}
const delay = () =>
new Promise((resolve, _) => {
setTimeout(() => {
resolve('')
}, 1000)
})
await page.callMethod('onButtonClick')
await delay()
const resStr1 = await page.$("#isNumListValid")
const resStr2 = await page.$("#isObjListValid")
expect(await resStr1.text()).toBe(`true`)
expect(await resStr2.text()).toBe(`true`)
})
<template>
<view>
<call-easy-method-uni-modules ref="callEasyMethod1"></call-easy-method-uni-modules>
<!-- #ifdef APP -->
<view>---</view>
<test-props :numList="numList" :objList='objList' @buttonclick='onButtonClick' @numListChange='numListChange'
@objListChange='objListChange' style="width: 80px;height: 30px;background-color: lightblue"></test-props>
<test-props id="btn1" :numList="numList" :objList='objList' @buttonclick='onButtonClick'
@numListChange='numListChange' @objListChange='objListChange'
style="width: 80px;height: 30px;background-color: lightblue"></test-props>
<view style="flex-direction: row ;">
<text>isNumListValid: </text>
<text id='isNumListValid'>{{isNumListValid}}</text>
......@@ -12,12 +14,14 @@
<text>isObjListValid: </text>
<text id='isObjListValid'>{{isObjListValid}}</text>
</view>
<!-- #endif -->
</view>
</template>
<script setup lang="uts">
import { testInOtherFile } from './call-method-easycom-uni-modules'
import { ref, isProxy, isRef } from 'vue'
import { PropsChangeEvent } from '@/uni_modules/test-props'
const delay = () : Promise<string> =>
new Promise((resolve, _) => {
......@@ -28,12 +32,8 @@
const callEasyMethod1 = ref<CallEasyMethodUniModulesComponentPublicInstance | null>(null)
const isWatched = ref(false)
const changeTimes = ref(0)
const propsList = ref<number[]>([])
const numList = ref<number[]>([1]) // 传递 props
const objList = ref<Array<{ id : string }>>([])
const objList = ref<any[]>([])
const isNumListValid = ref(false)
const isObjListValid = ref(false)
......@@ -69,13 +69,48 @@
return testInOtherFile(callEasyMethod1.value!, text)
}
// #ifdef APP-ANDROID
const numListChange = (res : Map<string, Map<string, any>>) => {
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
isNumListValid.value = isArray && isLengthGt0
}
// #endif
// #ifdef APP-IOS
const numListChange = (res : any) => {
isNumListValid.value = res.detail as boolean
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
isNumListValid.value = isArray && isLengthGt0
}
// #endif
// #ifdef APP-ANDROID
const objListChange = (res : Map<string, Map<string, any>>) => {
const value = res['detail']!['value'] as any[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
isObjListValid.value = isArray && isLengthGt0
}
// #endif
// #ifdef APP-IOS
const objListChange = (res : any) => {
isObjListValid.value = res.detail as boolean
const value = res['detail']!['value'] as any[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
isObjListValid.value = isArray && isLengthGt0
}
// #endif
const onButtonClick = () => {
// 改变 props: 观察 props 返回值为非响应式值
numList.value = [3, 2, 1]
objList.value = [{ id: '3' }, { id: '4' }]
}
......@@ -89,10 +124,6 @@
callMethod4()
await delay()
callMethod5()
await delay()
// 改变 props: 观察 props 返回值为非响应式值
numList.value = [3, 2, 1]
objList.value = [{ id: '3' }, { id: '4' }]
}
onReady(() => {
......@@ -102,7 +133,6 @@
defineExpose({
callMethodTest,
callMethodInOtherFile,
isNumListValid,
isObjListValid
onButtonClick
})
</script>
const PAGE_PATH = "/pages/component-instance/methods/call-method-easycom-uni-modules-options"
let page
beforeAll(async () => {
page = await program.reLaunch(PAGE_PATH)
await page.waitFor('view')
})
it('callMethodTest', async () => {
// app only issue 8582
if (process.env.uniTestPlatformInfo.toLowerCase().startsWith('web')) {
expect(1).toBe(1)
return
}
const delay = () =>
new Promise((resolve, _) => {
setTimeout(() => {
resolve('')
}, 1000)
})
await page.callMethod('onButtonClick')
await delay()
const resStr1 = await page.$("#isNumListValid")
const resStr2 = await page.$("#isObjListValid")
expect(await resStr1.text()).toBe(`true`)
expect(await resStr2.text()).toBe(`true`)
})
<template>
<view>
<call-easy-method-uni-modules ref="callEasyMethod1"></call-easy-method-uni-modules>
<!-- #ifdef APP -->
<view>---</view>
<test-props :numList="numList" :objList='objList' @buttonclick='onButtonClick' @numListChange='numListChange'
@objListChange='objListChange' style="width: 80px;height: 30px;background-color: lightblue"></test-props>
<test-props id="btn1" :numList="numList" :objList='objList' @buttonclick='onButtonClick'
@numListChange='numListChange' @objListChange='objListChange'
style="width: 80px;height: 30px;background-color: lightblue"></test-props>
<view style="flex-direction: row ;">
<text>isNumListValid: </text>
<text id='isNumListValid'>{{isNumListValid}}</text>
......@@ -12,6 +15,7 @@
<text>isObjListValid: </text>
<text id='isObjListValid'>{{isObjListValid}}</text>
</view>
<!-- #endif -->
</view>
</template>
......@@ -33,7 +37,7 @@
isWatched: false,
changeTimes: 0,
numList: [1] as number[], // 传递 props
objList: [] as Array<{ id : string }>,
objList: [] as any[],
isNumListValid: false,
isObjListValid: false
}
......@@ -55,10 +59,7 @@
this.callMethod4()
await delay()
this.callMethod5()
await delay()
// 改变 props: 观察 props 返回值为非响应式值
this.numList = [3, 2, 1]
this.objList = [{ id: '3' }, { id: '4' }]
},
callMethod1() {
// 调用组件的 foo1 方法
......@@ -91,14 +92,45 @@
return testInOtherFile(this.callEasyMethod1!, text)
},
numListChange(res) {
this.isNumListValid = res.detail
},
objListChange(res) {
this.isObjListValid = res.detail
},
onButtonClick() {
}
// #ifdef APP-ANDROID
numListChange(res : Map<string, Map<string, any>>) {
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
this.isNumListValid = isArray && isLengthGt0
},
// #endif
// #ifdef APP-IOS
numListChange(res : any) {
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
this.isNumListValid = isArray && isLengthGt0
},
// #endif
// #ifdef APP-ANDROID
objListChange(res : Map<string, Map<string, any>>) {
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
this.isObjListValid = isArray && isLengthGt0
},
// #endif
// #ifdef APP-IOS
objListChange(res : any) {
const value = res['detail']!['value'] as number[]
const isArray = Array.isArray(value)
const isLengthGt0 = value.length > 0
this.isObjListValid = isArray && isLengthGt0
},
// #endif
onButtonClick() {
// 改变 props: 观察 props 返回值为非响应式值
console.log('button click');
this.numList = [3, 2, 1]
this.objList = [{ id: '3' }, { id: '4' }]
}
}
}
</script>
import { PropsChangeEvent, PropsChangeEventDetail } from './index.uts'
export class PropChangeEventImpl extends UniCustomEvent<PropsChangeEventDetail> implements PropsChangeEvent {
constructor(detail : PropsChangeEventDetail) {
super("propChange", detail);
}
}
import { IPropsChangeEvent,IPropsChangeEventDetail } from '../interface.uts'
export type PropsChangeEvent = IPropsChangeEvent
export type PropsChangeEventDetail = IPropsChangeEventDetail
......@@ -11,7 +11,8 @@
import TextUtils from 'android.text.TextUtils';
import Button from 'android.widget.Button';
import View from 'android.view.View';
import { IObjItem ,IPropsChangeEvent} from '../interface.uts'
import {PropChangeEventImpl} from './event.uts'
/**
* 引入三方库
* [可选实现,按需引入]
......@@ -33,11 +34,11 @@
/**
* 组件名称,也就是开发者使用的标签
*/
name: "uts-button",
name: "test-props",
/**
* 组件涉及的事件声明,只有声明过的事件,才能被正常发送
*/
emits: ['buttonclick'],
emits: ['buttonclick', 'numListChange', 'objListChange'],
/**
* 属性声明,组件的使用者会传递这些属性值到组件
*/
......@@ -45,6 +46,14 @@
"buttontext": {
type: String,
default: "点击触发"
},
numList: {
type: Array as PropType<number[]>,
default: () => [] as number[]
},
objList: {
type: Array as PropType<IObjItem[]>,
default: () => [] as IObjItem[]
}
},
/**
......@@ -68,6 +77,30 @@
},
immediate: false // 创建时是否通过此方法更新属性,默认值为false
},
numList: {
handler(newVal : number[], oldVal : number[]) {
let detail = new Map<string, number[]>()
detail.set("value", newVal)
let data = new Map<string, any>()
data.set("detail", detail)
// const event = new PropChangeEventImpl(newVal)
this.$emit('numListChange', data)
},
immediate: true
},
objList: {
handler(newVal : any[], oldVal : any[]) {
let detail = new Map<string, any>()
detail.set("value", newVal)
let data = new Map<string, any>()
data.set("detail", detail)
this.$emit('objListChange', data)
},
immediate: true
}
},
/**
* 规则:如果没有配置expose,则methods中的方法均对外暴露,如果配置了expose,则以expose的配置为准向外暴露
......@@ -192,4 +225,4 @@
<style>
</style>
\ No newline at end of file
</style>
......@@ -86,25 +86,20 @@
},
numList: {
handler(newVal : number[], oldVal : number[]) {
const isNumber = (val : number) : boolean => typeof val == 'number'
const isEveryNumber = (newVal as number[]).every(isNumber)
const isRawType = Array.isArray(newVal) && isEveryNumber
let detail = new Map<string, any>()
detail.set("value", newVal)
let data = new Map<string, any>()
data.set("detail", isRawType)
data.set("detail", detail)
this.$emit('numListChange', data)
},
immediate: true
},
objList: {
handler(newVal:any[], oldVal:any[]) {
const isObj = (item:any):boolean => item instanceof UTSJSONObject
const isEveryObj = (newVal as any[]).every(isObj)
const isRawType = Array.isArray(newVal) && isEveryObj
handler(newVal : any[], oldVal : any[]) {
let detail = new Map<string, any>()
detail.set("value", newVal)
let data = new Map<string, any>()
data.set("detail", isRawType)
console.log(111,newVal,isEveryObj,isRawType)
data.set("detail", detail)
this.$emit('objListChange', data)
},
immediate: true
......
export type IObjItem = {
id : string
}
export type IPropsChangeEventDetail = {
value : number
}
export interface IPropsChangeEvent extends UniVideoEvent {
detail : IPropsChangeEventDetail[]
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册