scroll-view补充测试例

pages/component/scroll-view/scroll-view-props.test.js

+// uni-app自动化测试教程: uni-app自动化测试教程: https://uniapp.dcloud.net.cn/worktile/auto/hbuilderx-extension/
+
+describe('component-native-scroll-view', () => {
+
+    let page;
+    beforeAll(async () => {
+        page = await program.reLaunch('/pages/component/scroll-view/scroll-view-props');
+        await page.waitFor(300);
+    });
+
+    //检测竖向可滚动区域
+    it('check_scroll_height', async () => {
+      await page.setData({
+          scrollX: false
+      })
+      await page.waitFor(300);
+      const value = await page.callMethod('checkScrollHeight')
+      expect(value).toBe(true)
+    })
+
+    //检测竖向scrolltop属性赋值
+    it('check_scroll_top', async () => {
+        await page.setData({
+            scrollTop: 600
+        })
+        await page.waitFor(600)
+        const element = await page.$('#scrollViewY')
+        const scrollTop = await element.attribute("scrollTop")
+        console.log("check_scroll_top---"+scrollTop)
+        expect(scrollTop-600).toBeGreaterThanOrEqual(0)
+    })
+
+    //检测竖向scroll_into_view属性赋值
+    it('check_scroll_into_view_top', async () => {
+        await page.setData({
+            scrollIntoView: "item3"
+        })
+        await page.waitFor(600)
+        const element = await page.$('#scrollViewY')
+        const scrollTop = await element.attribute("scrollTop")
+        console.log("check_scroll_into_view_top--"+scrollTop)
+        await page.setData({
+            scrollIntoView: ""
+        })
+        expect(scrollTop-690).toBeGreaterThanOrEqual(0)
+    })
+
+    //检测横向可滚动区域
+    it('check_scroll_width', async () => {
+      await page.setData({
+          scrollX: true
+      })
+      await page.waitFor(300);
+      const value = await page.callMethod('checkScrollWidth')
+      expect(value).toBe(true)
+    })
+    
+    //检测横向scrollLeft属性赋值
+    it('check_scroll_left', async () => {
+      await page.setData({
+          scrollLeft: 600
+      })
+      await page.waitFor(600)
+      const element = await page.$('#scrollViewX')
+      const scrollLeft = await element.attribute("scrollLeft")
+      console.log("check_scroll_left---"+scrollLeft)
+      expect(scrollLeft-600).toBeGreaterThanOrEqual(0)
+    })
+    
+    //检测横向scroll_into_view属性赋值
+    it('check_scroll_into_view_left', async () => {
+      await page.setData({
+          scrollIntoView: "horizontal_item3"
+      })
+      await page.waitFor(600)
+      const element = await page.$('#scrollViewX')
+      const scrollLeft = await element.attribute("scrollLeft")
+      console.log("check_scroll_into_view_left--"+scrollLeft)
+      await page.setData({
+          scrollIntoView: ""
+      })
+      expect(scrollLeft-1080).toBeGreaterThanOrEqual(0)
+    })
+
+});

pages/component/scroll-view/scroll-view-props.uvue

@@ -5,11 +5,11 @@
 		<page-head title="非下拉刷新的scroll-view属性示例"></page-head>
 		<view class="uni-margin-wrap">
 			<!-- 暂时分成两个方向不同的滚动视图，原因为：scroll-x或scroll-y属性一经设置不能动态改变。 -->
-			<scroll-view v-if="scrollX" :scroll-x="true" :scroll-top="scrollTop" :scroll-left="scrollLeft"
+			<scroll-view v-if="scrollX" :scroll-x="true" :scroll-y="false" :scroll-top="scrollTop" :scroll-left="scrollLeft"
 				:upper-threshold="upperThreshold" :lower-threshold="lowerThreshold" :scroll-into-view="scrollIntoView"
 				:enable-back-to-top="enableBackToTop" :scroll-with-animation="scrollWithAnimation"
 				:show-scrollbar="showScrollbar" :rebound="rebound" @scrolltoupper="scrolltoupper"
-				@scrolltolower="scrolltolower" @scroll="scroll" @scrollend="scrollend">
+				@scrolltolower="scrolltolower" @scroll="scroll" @scrollend="scrollend" ref="scrollViewX" id="scrollViewX">
 				<view class="item" :id="'horizontal_'+item.id" v-for="(item,_) in items">
 					<text class="uni-text">{{item.label}}</text>
 				</view>
@@ -18,7 +18,7 @@
 				:upper-threshold="upperThreshold" :lower-threshold="lowerThreshold" :scroll-into-view="scrollIntoView"
 				:enable-back-to-top="enableBackToTop" :scroll-with-animation="scrollWithAnimation"
 				:show-scrollbar="showScrollbar" :rebound="rebound" @scrolltoupper="scrolltoupper"
-				@scrolltolower="scrolltolower" @scroll="scroll" @scrollend="scrollend">
+				@scrolltolower="scrolltolower" @scroll="scroll" @scrollend="scrollend" ref="scrollViewY" id="scrollViewY">
 				<view class="item" :id="item.id" v-for="(item,_) in items">
 					<text class="uni-text">{{item.label}}</text>
 				</view>
@@ -161,7 +161,31 @@
 			},
 			scrollend() {
 				console.log("滚动停止");
-			}
+			},
+      //自动化测试专用
+      checkScrollHeight(): Boolean {
+        var element = this.$refs["scrollViewY"]
+        if(element != null) {
+           var scrollHeight = (element as Element).scrollHeight
+           console.log("checkScrollHeight"+scrollHeight)
+           if(scrollHeight > 1900) {
+             return true
+           }
+        }
+        return false
+      },
+      //自动化测试专用
+      checkScrollWidth(): Boolean {
+        var element = this.$refs["scrollViewX"]
+        if(element != null) {
+           var scrollWidth = (element as Element).scrollWidth
+           console.log("checkScrollWidth---"+scrollWidth)
+           if(scrollWidth > 1900) {
+             return true
+           }
+        }
+        return false
+      }
 		}
 	}
 </script>
@@ -206,4 +230,4 @@
 		padding: 30rpx;
 		justify-content: center;
 	}
-</style>
\ No newline at end of file
+</style>