test(lifecycle): onLoad 生命周期调用路由及弹框 API

pages.json

@@ -263,6 +263,12 @@
         "enablePullDownRefresh": true
       }
     },
+    {
+      "path": "pages/API/navigator/new-page/onLoad",
+      "style": {
+        "navigationBarTitleText": "onLoad 生命周期测试"
+      }
+    },
     {
       "path": "pages/API/pull-down-refresh/pull-down-refresh",
       "style": {
@@ -939,13 +945,13 @@
       "style": {
         "navigationBarTitleText": "自定义TabBar"
       }
-    }, {
+    },
+    {
       "path": "pages/API/facial-recognition-verify/facial-recognition-verify",
       "style": {
         "navigationBarTitleText": "",
         "enablePullDownRefresh": false
       }
-
     }
   ],
   "globalStyle": {

pages/API/navigator/new-page/new-page-1.uvue

@@ -39,6 +39,11 @@ export default {
         },
       })
     },
+    navigateToOnLoadWithType(type: string) {
+      uni.navigateTo({
+        url: `/pages/API/navigator/new-page/onLoad?type=${type}`,
+      })
+    }
   },
 }
 </script>

pages/API/navigator/new-page/onLoad.test.js

+jest.setTimeout(20000);
+const PAGE_PATH = "/pages/API/navigator/new-page/onLoad";
+const INTERMEDIATE_PAGE_PATH = "/pages/API/navigator/new-page/new-page-1";
+const TARGET_PAGE_PATH = "/pages/API/navigator/new-page/new-page-2";
+let page;
+
+describe("onLoad", () => {
+  it("adjustData", async () => {
+    page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+    await page.waitFor(500);
+    await page.callMethod("navigateToOnLoadWithType", "adjustData");
+    await page.waitFor(1000);
+    const image = await program.screenshot();
+    expect(image).toMatchImageSnapshot();
+  });
+  // 先出现 TARGET_PAGE_PATH 页面，再出现 onLoad 页面, 顺序异常
+  // it("navigateTo", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "navigateTo");
+  //   await page.waitFor(1000);
+  //   page = await program.currentPage();
+  //   expect(page.path).toBe(TARGET_PAGE_PATH.substring(1));
+  // });
+  // 页面白屏
+  // it("navigateBack", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "navigateBack");
+  //   await page.waitFor(1000);
+  //   page = await program.currentPage();
+  //   expect(page.path).toBe(TARGET_PAGE_PATH.substring(1));
+  // });
+  // 直接出现 TARGET_PAGE_PATH 页面，又动画了 TARGET_PAGE_PATH 页面
+  // it("redirectTo", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "redirectTo");
+  //   await page.waitFor(1000);
+  //   page = await program.currentPage();
+  //   expect(page.path).toBe(TARGET_PAGE_PATH.substring(1));
+  // });
+  // 直接出现 TARGET_PAGE_PATH 页面，又动画了 TARGET_PAGE_PATH 页面
+  // it("reLaunch", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "reLaunch");
+  //   await page.waitFor(1000);
+  //   page = await program.currentPage();
+  //   expect(page.path).toBe(TARGET_PAGE_PATH.substring(1));
+  // });
+  // 页面白屏
+  // it("switchTab", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "switchTab");
+  //   await page.waitFor(1000);
+  //   page = await program.currentPage();
+  //   expect(page.path).toBe("pages/tabBar/component");
+  // });
+  // toast 出现在 INTERMEDIATE_PAGE_PATH 页面（非 onLoad 生命周期所在页面）
+  // 当 navigateTo 到 onLoad 页面时，toast 会被关闭
+  // it("showToast", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "showToast");
+  //   await page.waitFor(1000);
+  //   const image = await program.screenshot();
+  //   expect(image).toMatchImageSnapshot();
+  // });
+  // 同 toast
+  // it("showLoading", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "showLoading");
+  //   await page.waitFor(1000);
+  //   const image = await program.screenshot();
+  //   expect(image).toMatchImageSnapshot();
+  // });
+  // 同 toast
+  // it("showModal", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "showModal");
+  //   await page.waitFor(1000);
+  //   const image = await program.screenshot();
+  //   expect(image).toMatchImageSnapshot();
+  // });
+  // 同 toast
+  // it("showActionSheet", async () => {
+  //   page = await program.reLaunch(INTERMEDIATE_PAGE_PATH);
+  //   await page.waitFor(500);
+  //   await page.callMethod("navigateToOnLoadWithType", "showActionSheet");
+  //   await page.waitFor(1000);
+  //   const image = await program.screenshot();
+  //   expect(image).toMatchImageSnapshot();
+  // });
+});

pages/API/navigator/new-page/onLoad.uvue

+<template>
+  <view class="uni-padding-wrap">
+    <page-head title="onLoad 生命周期调用 uni api 测试" />
+    <text v-if="isTrue">v-if with true</text>
+    <text v-if="isFalse">v-if with false</text>
+    <text v-show="isTrue">v-show with true</text>
+    <text v-show="isFalse">v-show with false</text>
+    <text>msg: {{ msg }}</text>
+  </view>
+</template>
+
+<script lang="uts">
+export default {
+  data() {
+    return {
+      isTrue: false,
+      isFalse: true,
+      msg: 'default msg'
+    }
+  },
+  onLoad(options: OnLoadOptions) {
+    const type = options.get('type')
+    switch (type) {
+      case 'adjustData':
+        this.adjustData()
+        break;
+      case 'navigateTo':
+        this.navigateTo()
+        break;
+      case 'navigateBack':
+        this.navigateBack()
+        break;
+      case 'redirectTo':
+        this.redirectTo()
+        break;
+      case 'reLaunch':
+        this.reLaunch()
+        break;
+      case 'switchTab':
+        this.switchTab()
+        break;
+      case 'showToast':
+        this.showToast()
+        break;
+      case 'showLoading':
+        this.showLoading()
+        break;
+      case 'showModal':
+        this.showModal()
+        break;
+      case 'showActionSheet':
+        this.showActionSheet()
+        break;
+    }
+  },
+  methods: {
+    adjustData(){
+      this.isTrue = true
+      this.isFalse = false
+      this.msg = 'new msg'
+    },
+    navigateTo(){
+      uni.navigateTo({
+        url: '/pages/API/navigator/new-page/new-page-2'
+      })
+    },
+    navigateBack(){
+      uni.navigateBack()
+    },
+    redirectTo(){
+      uni.redirectTo({
+        url: '/pages/API/navigator/new-page/new-page-2'
+      })
+    },
+    reLaunch(){
+      uni.reLaunch({
+        url: '/pages/API/navigator/new-page/new-page-2'
+      })
+    },
+    switchTab(){
+      uni.switchTab({
+        url: '/pages/tabBar/component'
+      })
+    },
+    showToast(){
+      uni.showToast({
+        title: 'test title',
+        icon: 'success',
+        duration: 2000
+      })
+    },
+    showLoading(){
+      uni.showLoading({
+        title: 'test title',
+      })
+    },
+    showModal(){
+      uni.showModal({
+        title: 'test title',
+        content: 'test content',
+      })
+    },
+    showActionSheet(){
+      uni.showActionSheet({
+        title: 'test title',
+        itemList: ['1', '2', '3']
+      })
+    }
+  }
+}
+</script>