feat: 调整部分测试例及实现适配web端

pages/CSS/transition/transition.uvue

@@ -86,29 +86,29 @@
     methods: {
       changeWidthOrHeight() {
         this.widthOrHeight?.style?.setProperty("width", this.isTranstionWidthOrHeight
-          ? '400rpx'
-          : '600rpx')
+          ? '60%'
+          : '100%')
         this.isTranstionWidthOrHeight = !this.isTranstionWidthOrHeight
       },
       changeMargin() {
         this.styleMargin?.style?.setProperty("margin-top", this.isTranstionChangeMargin
-          ? '0rpx'
-          : '100rpx'
+          ? '0px'
+          : '50px'
         )
         this.styleMargin?.style?.setProperty("margin-left", this.isTranstionChangeMargin
-          ? '0rpx'
-          : '100rpx'
+          ? '0px'
+          : '50px'
         )
         this.isTranstionChangeMargin = !this.isTranstionChangeMargin
       },
 
       changePadding() {
         this.stylePadding?.style?.setProperty("padding-top", this.isTransitionStylePadding
-          ? '0rpx'
-          : '100rpx')
+          ? '0px'
+          : '50px')
         this.stylePadding?.style?.setProperty("padding-left", this.isTransitionStylePadding
-          ? '0rpx'
-          : '100rpx')
+          ? '0px'
+          : '50px')
         this.isTransitionStylePadding = !this.isTransitionStylePadding
       },
       changeBackground() {
@@ -157,8 +157,8 @@
       },
       changestylePosition() {
         this.stylePosition?.style?.setProperty("left", this.isTransitionstylePosition
-          ? '0rpx'
-          : '150rpx'
+          ? '0px'
+          : '100px'
         )
         this.isTransitionstylePosition = !this.isTransitionstylePosition
       },
@@ -185,27 +185,27 @@
 
   .transition-width {
     transition-property: width;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-margin {
     transition-property: margin-left, margin-top;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-padding {
     transition-property: padding-left, padding-top;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-background {
     transition-property: background-color, opacity;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-transform {
     transition-property: transform;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-border {
@@ -213,11 +213,11 @@
     border-color: brown;
     border-style: solid;
     transition-property: border-color;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 
   .transition-position {
     transition-property: left;
-    transition-duration: 1000;
+    transition-duration: 1000ms;
   }
 </style>

pages/component/checkbox/checkbox.test.js

-function getData(key = '') {
-  return new Promise(async (resolve, reject) => {
-    const data = await page.data()
-    resolve(key ? data[key] : data)
-  })
-}
-
-let page
-beforeAll(async () => {
-  page = await program.reLaunch('/pages/component/checkbox/checkbox')
-  await page.waitFor(2000);
-})
-
-describe('Checkbox.uvue', () => {
-  it('change', async () => {
-    expect(await getData('value')).toEqual([])
-    const cb1 = await page.$('.cb1')
-    await cb1.tap()
-    expect(await getData('value')).toEqual(['cb', 'cb1'])
-    const cb = await page.$('.cb')
-    await cb.tap()
-    expect(await getData('value')).toEqual(['cb1'])
-    const cb2 = await page.$('.cb2')
-    await cb2.tap()
-    expect(await getData('value')).toEqual(['cb1'])
-    await cb1.tap()
-    expect(await getData('value')).toEqual([])
-  })
-  it('length', async () => {
-    const checkboxGroupElements = await page.$$('.checkbox-group')
-    expect(checkboxGroupElements.length).toBe(3)
-    const checkboxElements = await page.$$('.checkbox')
-    expect(checkboxElements.length).toBe(12)
-  })
-  it('text', async () => {
-    const cb = await page.$('.cb1')
-    expect(await cb.text()).toEqual('未选中')
-    await page.setData({
-      text: 'not selected',
-    })
-    expect(await cb.text()).toEqual('not selected')
-  })
-  it('checked', async () => {
-    const cb = await page.$('.cb')
-    expect(await cb.attribute('checked')).toBe(true)
-    await page.setData({
-      checked: false,
-    })
-    expect(await cb.attribute('checked')).toBe(false)
-  })
-  it('color', async () => {
-    const cb = await page.$('.cb')
-    expect(await cb.attribute('color')).toBe('#007aff')
-    await page.setData({
-      color: '#63acfc',
-    })
-    expect(await cb.attribute('color')).toBe('#63acfc')
-  })
-  it('disabled', async () => {
-    const cb = await page.$('.cb2')
-    expect(await cb.attribute('disabled')).toBe(true)
-    await page.setData({
-      disabled: false,
-    })
-    expect(await cb.attribute('disabled')).toBe(false)
-  })
-})
+function getData(key = '') {
+  return new Promise(async (resolve, reject) => {
+    const data = await page.data()
+    resolve(key ? data[key] : data)
+  })
+}
+
+let page
+beforeAll(async () => {
+  page = await program.reLaunch('/pages/component/checkbox/checkbox')
+  await page.waitFor(2000);
+})
+
+describe('Checkbox.uvue', () => {
+  it('change', async () => {
+    expect(await getData('value')).toEqual([])
+    const cb1 = await page.$('.cb1')
+    await cb1.tap()
+    expect(await getData('value')).toEqual(['cb', 'cb1'])
+    const cb = await page.$('.cb')
+    await cb.tap()
+    expect(await getData('value')).toEqual(['cb1'])
+    const cb2 = await page.$('.cb2')
+    await cb2.tap()
+    expect(await getData('value')).toEqual(['cb1'])
+    await cb1.tap()
+    expect(await getData('value')).toEqual([])
+  })
+  it('length', async () => {
+    const checkboxGroupElements = await page.$$('.checkbox-group')
+    expect(checkboxGroupElements.length).toBe(3)
+    const checkboxElements = await page.$$('.checkbox')
+    expect(checkboxElements.length).toBe(12)
+  })
+  it('text', async () => {
+    const cb = await page.$('.cb1')
+    expect(await cb.text()).toEqual('未选中')
+    await page.setData({
+      text: 'not selected',
+    })
+    expect(await cb.text()).toEqual('not selected')
+  })
+  it('checked', async () => {
+    const cb = await page.$('.cb')
+    expect(await cb.property('checked')).toBe(true)
+    await page.setData({
+      checked: false,
+    })
+    expect(await cb.property('checked')).toBe(false)
+  })
+  it('color', async () => {
+    const cb = await page.$('.cb')
+    expect(await cb.attribute('color')).toBe('#007aff')
+    await page.setData({
+      color: '#63acfc',
+    })
+    expect(await cb.attribute('color')).toBe('#63acfc')
+  })
+  it('disabled', async () => {
+    const cb = await page.$('.cb2')
+    expect(await cb.attribute('disabled')).toBe(true + '')
+    await page.setData({
+      disabled: false,
+    })
+    expect(await cb.attribute('disabled')).toBe(false + '')
+  })
+})

pages/component/input/input.test.js

@@ -43,7 +43,7 @@ describe('component-native-input', () => {
   // 测试修改value属性
   it("value", async () => {
     const input = await page.$('#uni-input-default');
-    expect(await input.attribute('value')).toEqual("hello uni-app x")
+    expect(await input.property('value')).toEqual("hello uni-app x")
   })
 
   //测试input的类型

pages/component/picker-view/picker-view.test.js

@@ -16,14 +16,14 @@ describe('PickerView.uvue', () => {
     const el = await page.$('.picker-view')
     await page.callMethod('setValue')
     await page.waitFor(1000)
-    expect(await el.attribute('value')).toEqual([0, 0, 0])
+    expect(await el.property('value')).toEqual([0, 0, 0])
     if (process.env.UNI_PLATFORM === 'app-android') {
       expect(await getData('result')).toEqual([0, 0, 0])
     }
 
     await page.callMethod('setValue1')
     await page.waitFor(1000)
-    expect(await el.attribute('value')).toEqual([10, 10, 10])
+    expect(await el.property('value')).toEqual([10, 10, 10])
     if (process.env.UNI_PLATFORM === 'app-android') {
       expect(await getData('result')).toEqual([10, 10, 10])
     }

pages/component/progress/progress.test.js

@@ -16,22 +16,22 @@ describe('Progress.uvue', () => {
     await page.callMethod('setProgress')
     await page.waitFor(1000);
     const p = await page.$('.p')
-    expect(await p.attribute('percent')).toEqual(20)
+    expect(await p.attribute('percent')).toEqual(20 + '')
     const p1 = await page.$('.p1')
-    expect(await p1.attribute('percent')).toEqual(40)
+    expect(await p1.attribute('percent')).toEqual(40 + '')
     const p2 = await page.$('.p2')
-    expect(await p2.attribute('percent')).toEqual(60)
+    expect(await p2.attribute('percent')).toEqual(60 + '')
     const p3 = await page.$('.p3')
-    expect(await p3.attribute('percent')).toEqual(80)
+    expect(await p3.attribute('percent')).toEqual(80 + '')
     if (process.env.UNI_PLATFORM === 'app-android') {
       expect(await getData('curPercent')).toEqual(20)
     }
     await page.callMethod('clearProgress')
     await page.waitFor(1000)
-    expect(await p.attribute('percent')).toEqual(0)
-    expect(await p1.attribute('percent')).toEqual(0)
-    expect(await p2.attribute('percent')).toEqual(0)
-    expect(await p3.attribute('percent')).toEqual(0)
+    expect(await p.attribute('percent')).toEqual(0 + '')
+    expect(await p1.attribute('percent')).toEqual(0 + '')
+    expect(await p2.attribute('percent')).toEqual(0 + '')
+    expect(await p3.attribute('percent')).toEqual(0 + '')
     if (process.env.UNI_PLATFORM === 'app-android') {
       expect(await getData('curPercent')).toEqual(0)
     }
@@ -42,35 +42,35 @@ describe('Progress.uvue', () => {
   })
   it('show-info', async () => {
     const el = await page.$('.p')
-    expect(await el.attribute('show-info')).toEqual(true)
+    expect(await el.attribute('show-info')).toEqual(true + '')
     await page.setData({
       showInfo: false
     })
-    expect(await el.attribute('show-info')).toEqual(false)
+    expect(await el.attribute('show-info')).toEqual(false + '')
   })
   it('border-radius', async () => {
     const el = await page.$('.p')
-    expect(await el.attribute('border-radius')).toEqual(0)
+    expect(await el.attribute('border-radius')).toEqual(0 + '')
     await page.setData({
       borderRadius: 5
     })
-    expect(await el.attribute('border-radius')).toEqual(5)
+    expect(await el.attribute('border-radius')).toEqual(5 + '')
   })
   it('font-size', async () => {
     const el = await page.$('.p')
-    expect(await el.attribute('font-size')).toEqual(16)
+    expect(await el.attribute('font-size')).toEqual(16 + '')
     await page.setData({
       fontSize: 18
     })
-    expect(await el.attribute('font-size')).toEqual(18)
+    expect(await el.attribute('font-size')).toEqual(18 + '')
   })
   it('stroke-width', async () => {
     const el = await page.$('.p')
-    expect(await el.attribute('stroke-width')).toEqual(3)
+    expect(await el.attribute('stroke-width')).toEqual(3 + '')
     await page.setData({
       strokeWidth: 6
     })
-    expect(await el.attribute('stroke-width')).toEqual(6)
+    expect(await el.attribute('stroke-width')).toEqual(6 + '')
   })
   it('backgroundColor', async () => {
     const el = await page.$('.p')
@@ -80,4 +80,4 @@ describe('Progress.uvue', () => {
     })
     expect(await el.attribute('background-color')).toEqual('#007aff')
   })
-})
\ No newline at end of file
+})

pages/component/radio/radio.test.js

-function getData(key = '') {
-  return new Promise(async (resolve, reject) => {
-    const data = await page.data()
-    resolve(key ? data[key] : data)
-  })
-}
-
-let page
-beforeAll(async () => {
-  page = await program.reLaunch('/pages/component/radio/radio')
-  await page.waitFor(2000);
-})
-
-describe('Radio.uvue', () => {
-  it('change', async () => {
-    expect(await getData('value')).toEqual('')
-    const radio1 = await page.$('.r1')
-    await radio1.tap()
-    expect(await getData('value')).toEqual('r1')
-    const radio = await page.$('.r')
-    await radio.tap()
-    expect(await getData('value')).toEqual('r')
-    const radio2 = await page.$('.r2')
-    await radio2.tap()
-    expect(await getData('value')).toEqual('r')
-  })
-  it('length', async () => {
-    const radioGroupElements = await page.$$('.radio-group')
-    expect(radioGroupElements.length).toBe(3)
-    const radioElements = await page.$$('.radio')
-    expect(radioElements.length).toBe(12)
-  })
-  it('text', async () => {
-    const radio = await page.$('.r1')
-    expect(await radio.text()).toEqual('未选中')
-    await page.setData({
-      text: 'not selected',
-    })
-    expect(await radio.text()).toEqual('not selected')
-  })
-  it('checked', async () => {
-    const radio = await page.$('.r')
-    expect(await radio.attribute('checked')).toBe(true)
-    await page.setData({
-      checked: false,
-    })
-    expect(await radio.attribute('checked')).toBe(false)
-  })
-  it('color', async () => {
-    const radio = await page.$('.r')
-    expect(await radio.attribute('color')).toBe('#007aff')
-    await page.setData({
-      color: '#63acfc',
-    })
-    expect(await radio.attribute('color')).toBe('#63acfc')
-  })
-  it('disabled', async () => {
-    const radio = await page.$('.r2')
-    expect(await radio.attribute('disabled')).toBe(true)
-    await page.setData({
-      disabled: false,
-    })
-    expect(await radio.attribute('disabled')).toBe(false)
-  })
-})
+function getData(key = '') {
+  return new Promise(async (resolve, reject) => {
+    const data = await page.data()
+    resolve(key ? data[key] : data)
+  })
+}
+
+let page
+beforeAll(async () => {
+  page = await program.reLaunch('/pages/component/radio/radio')
+  await page.waitFor(2000);
+})
+
+describe('Radio.uvue', () => {
+  it('change', async () => {
+    expect(await getData('value')).toEqual('')
+    const radio1 = await page.$('.r1')
+    await radio1.tap()
+    expect(await getData('value')).toEqual('r1')
+    const radio = await page.$('.r')
+    await radio.tap()
+    expect(await getData('value')).toEqual('r')
+    const radio2 = await page.$('.r2')
+    await radio2.tap()
+    expect(await getData('value')).toEqual('r')
+  })
+  it('length', async () => {
+    const radioGroupElements = await page.$$('.radio-group')
+    expect(radioGroupElements.length).toBe(3)
+    const radioElements = await page.$$('.radio')
+    expect(radioElements.length).toBe(12)
+  })
+  it('text', async () => {
+    const radio = await page.$('.r1')
+    expect(await radio.text()).toEqual('未选中')
+    await page.setData({
+      text: 'not selected',
+    })
+    expect(await radio.text()).toEqual('not selected')
+  })
+  it('checked', async () => {
+    const radio = await page.$('.r')
+    expect(await radio.property('checked')).toBe(true)
+    await page.setData({
+      checked: false,
+    })
+    expect(await radio.property('checked')).toBe(false)
+  })
+  it('color', async () => {
+    const radio = await page.$('.r')
+    expect(await radio.attribute('color')).toBe('#007aff')
+    await page.setData({
+      color: '#63acfc',
+    })
+    expect(await radio.attribute('color')).toBe('#63acfc')
+  })
+  it('disabled', async () => {
+    const radio = await page.$('.r2')
+    expect(await radio.attribute('disabled')).toBe(true + '')
+    await page.setData({
+      disabled: false,
+    })
+    expect(await radio.attribute('disabled')).toBe(false + '')
+  })
+})

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

@@ -25,7 +25,7 @@ describe('component-native-scroll-view', () => {
         })
         await page.waitFor(600)
         const element = await page.$('#scrollViewY')
-        const scrollTop = await element.attribute("scrollTop")
+        const scrollTop = await element.property("scrollTop")
         console.log("check_scroll_top---"+scrollTop)
         expect(scrollTop-600).toBeGreaterThanOrEqual(0)
     })
@@ -37,7 +37,7 @@ describe('component-native-scroll-view', () => {
         })
         await page.waitFor(600)
         const element = await page.$('#scrollViewY')
-        const scrollTop = await element.attribute("scrollTop")
+        const scrollTop = await element.property("scrollTop")
         console.log("check_scroll_into_view_top--"+scrollTop)
         await page.setData({
             scrollIntoView: ""
@@ -54,7 +54,7 @@ describe('component-native-scroll-view', () => {
       const value = await page.callMethod('checkScrollWidth')
       expect(value).toBe(true)
     })
-    
+
     //检测横向scrollLeft属性赋值
     it('check_scroll_left', async () => {
       await page.setData({
@@ -62,11 +62,11 @@ describe('component-native-scroll-view', () => {
       })
       await page.waitFor(600)
       const element = await page.$('#scrollViewX')
-      const scrollLeft = await element.attribute("scrollLeft")
+      const scrollLeft = await element.property("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({
@@ -74,7 +74,7 @@ describe('component-native-scroll-view', () => {
       })
       await page.waitFor(600)
       const element = await page.$('#scrollViewX')
-      const scrollLeft = await element.attribute("scrollLeft")
+      const scrollLeft = await element.property("scrollLeft")
       console.log("check_scroll_into_view_left--"+scrollLeft)
       await page.setData({
           scrollIntoView: ""

pages/component/slider-100/slider-100.test.js

@@ -15,12 +15,12 @@ describe('slider', () => {
 
     // TODO 暂时仅获取第一个
     const slider1 = await page.$('.slider')
-    expect(await slider1.attribute('value')).toBe(sliderValue)
+    expect(await slider1.property('value')).toBe(sliderValue)
 
     // const slider100 = await page.$$('.slider')
     // for (let i = 0; i < slider100.length; i++) {
     //   const slider = slider100[i];
-    //   expect(await slider.attribute('value')).toBe(sliderValue)
+    //   expect(await slider.property('value')).toBe(sliderValue)
     // }
   })
 })

pages/component/slider/slider.test.js

@@ -15,7 +15,7 @@ describe('slider', () => {
       sliderValue: sliderValue,
     })
     await page.waitFor(100)
-    expect(await slider.attribute('value')).toBe(sliderValue)
+    expect(await slider.property('value')).toBe(sliderValue)
   })
   it('color', async () => {
     const slider = await page.$('.slider-custom-color-and-size')
@@ -39,13 +39,13 @@ describe('slider', () => {
   })
   it('block-size', async () => {
     const slider = await page.$('.slider-custom-color-and-size')
-    expect(await slider.attribute('blockSize')).toBe(20)
+    expect(await slider.attribute('blockSize')).toBe(20 + '')
 
     const blockSize = 18
     await page.setData({
       sliderBlockSize: blockSize,
     })
     await page.waitFor(100)
-    expect(await slider.attribute('blockSize')).toBe(blockSize)
+    expect(await slider.attribute('blockSize')).toBe(blockSize + '')
   })
-})
\ No newline at end of file
+})

pages/component/switch/switch.test.js

@@ -29,13 +29,13 @@ describe('switch', () => {
       checked: false,
     })
     await page.waitFor(100)
-    expect(await switch_element.attribute('checked')).toBe(false)
+    expect(await switch_element.property('checked')).toBe(false)
 
     await page.setData({
       checked: true,
     })
     await page.waitFor(100)
-    expect(await switch_element.attribute('checked')).toBe(true)
+    expect(await switch_element.property('checked')).toBe(true)
   })
   it('color', async () => {
     const switch_element = await page.$('.switch-color')
@@ -49,4 +49,4 @@ describe('switch', () => {
     await page.waitFor(100)
     expect(await switch_element.attribute('color')).toBe(color)
   })
-})
\ No newline at end of file
+})