cbvirtua 1.0.106 → 1.0.107

package/better-scroll-dev/better-scroll-dev/tests/e2e/mousewheel/mousewheel.e2e.ts

@@ -0,0 +1,209 @@
+import { Page } from 'puppeteer'
+import extendMouseWheel from '../../util/extendMouseWheel'
+import getTranslate from '../../util/getTranslate'
+
+jest.setTimeout(1000000)
+
+describe('MouseWheel plugin', () => {
+  let page = (global as any).page as Page
+  extendMouseWheel(page)
+
+  beforeAll(async () => {
+    // emulate pc scene
+    await page.emulate({
+      viewport: {
+        isMobile: false,
+        width: 375,
+        height: 667,
+      },
+      // tslint:disable-next-line: max-line-length
+      userAgent:
+        'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.80 Safari/537.36',
+    })
+  })
+
+  describe('MouseWheel & Core', () => {
+    it('should scroll correctly in vertical direction when integrating with CoreScroll', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/vertical-scroll')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 100,
+        y: 100,
+        deltaX: 0,
+        deltaY: 50,
+      })
+
+      await page.waitFor(1000)
+
+      const transformText = await page.$eval('.mouse-wheel-content', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const y = getTranslate(transformText, 'y')
+      await expect(y).toBeLessThan(0)
+    })
+
+    it('should scroll correctly in horizontal direction when integrating with CoreScroll', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/horizontal-scroll')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 130,
+        y: 130,
+        deltaX: 0,
+        deltaY: 100,
+      })
+
+      await page.waitFor(1000)
+      const transformText = await page.$eval('.mouse-wheel-content', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const x = getTranslate(transformText, 'x')
+      await expect(x).toBeLessThan(0)
+    })
+  })
+
+  describe('MouseWheel & Slide', () => {
+    it('should scroll correctly in vertical direction when integrating with Slide', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/vertical-slide')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 100,
+        y: 100,
+        deltaX: 0,
+        deltaY: 200,
+      })
+
+      await page.waitFor(3000)
+
+      const transformText = await page.$eval('.slide-content', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const y = getTranslate(transformText, 'y')
+      await expect(y).toBeLessThan(-667)
+    })
+
+    it('should scroll correctly in horizontal direction when integrating with Slide', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/horizontal-slide')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 130,
+        y: 130,
+        deltaX: 0,
+        deltaY: 200,
+      })
+
+      await page.waitFor(1000)
+      const transformText = await page.$eval('.slide-content', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const x = getTranslate(transformText, 'x')
+
+      await expect(x).toBeLessThan(-600)
+    })
+  })
+
+  describe('MouseWheel & PullUp', () => {
+    it('should scroll correctly when integrating with PullUp', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/pullup')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 100,
+        y: 100,
+        deltaX: 0,
+        deltaY: 10000,
+      })
+
+      await page.waitFor(2000)
+
+      const transformText = await page.$eval('.pullup-content', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const y = getTranslate(transformText, 'y')
+      expect(y).toBeLessThan(0)
+
+      // wait for loading data
+      await page.waitFor(2000)
+
+      const itemsCounts = await page.$$eval(
+        '.pullup-list-item',
+        (element) => element.length
+      )
+
+      await expect(itemsCounts).toBeGreaterThanOrEqual(30)
+    })
+  })
+
+  describe('MouseWheel & PullDown', () => {
+    it('should scroll correctly when integrating with PullDown', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/pulldown')
+
+      await page.waitFor(300)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 100,
+        y: 100,
+        deltaX: 0,
+        deltaY: -1000,
+      })
+
+      // wait for loading data
+      await page.waitFor(2000)
+
+      const itemsCounts = await page.$$eval(
+        '.pulldown-list-item',
+        (element) => element.length
+      )
+
+      await expect(itemsCounts).toBeGreaterThanOrEqual(40)
+    })
+  })
+
+  describe('MouseWheel & Wheel', () => {
+    it('should scroll correctly when integrating with Wheel', async () => {
+      await page.goto('http://0.0.0.0:8932/#/mouse-wheel/picker')
+
+      await page.waitFor(300)
+
+      await page.click('.open')
+
+      await page.waitFor(500)
+
+      await page.dispatchMouseWheel({
+        type: 'mouseWheel',
+        x: 200,
+        y: 630,
+        deltaX: 0,
+        deltaY: 100,
+      })
+
+      await page.waitFor(1000)
+
+      const transformText = await page.$eval('.wheel-scroll', (node) => {
+        return window.getComputedStyle(node).transform
+      })
+
+      const y = getTranslate(transformText, 'y')
+      expect(y).toBeLessThan(-30)
+    })
+  })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/movable/default.e2e.ts

@@ -0,0 +1,61 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+
+jest.setTimeout(10000000)
+
+describe('Movable Plugin', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+
+  beforeAll(async () => {
+    await page.goto('http://0.0.0.0:8932/#/movable/default')
+  })
+
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded',
+    })
+  })
+
+  it('should work well when specify "startX & startY"', async () => {
+    await page.waitFor(300)
+    const scaledElTransformText = await page.$eval(
+      '.scroll-content',
+      (node) => {
+        return window.getComputedStyle(node).transform
+      }
+    )
+    const x = getTranslate(scaledElTransformText, 'x')
+    const y = getTranslate(scaledElTransformText, 'y')
+
+    expect(x).toBe(20)
+    expect(y).toBe(20)
+  })
+
+  it('should work well when dispatchScroll', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 100,
+      y: 100,
+      xDistance: -70,
+      yDistance: -70,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(2000)
+
+    const scaledElTransformText = await page.$eval(
+      '.scroll-content',
+      (node) => {
+        return window.getComputedStyle(node).transform
+      }
+    )
+    const x = getTranslate(scaledElTransformText, 'x')
+    const y = getTranslate(scaledElTransformText, 'y')
+
+    expect(x).toBe(0)
+    expect(y).toBe(0)
+  })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/movable/multi-content-scale.e2e.ts

@@ -0,0 +1,78 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+import getScale from '../../util/getScale'
+
+jest.setTimeout(10000000)
+
+describe('Movable & Zoom with multi content', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+
+  beforeAll(async () => {
+    await page.goto('http://0.0.0.0:8932/#/movable/multi-content-scale')
+  })
+
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded'
+    })
+  })
+
+  it('should work well', async () => {
+    await page.waitFor(300)
+    const transformText1 = await page.$eval('.content1', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x1 = getTranslate(transformText1, 'x')
+    const y1 = getTranslate(transformText1, 'y')
+    const scale1 = getScale(transformText1)
+
+    expect(x1).toBe(47.5)
+    expect(y1).toBe(89)
+    expect(scale1).toBe(1.2)
+
+    const transformText2 = await page.$eval('.content2', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x2 = getTranslate(transformText2, 'x')
+    const y2 = getTranslate(transformText2, 'y')
+
+    expect(x2).toBe(0)
+    expect(y2).toBe(150)
+  })
+
+  it('should work well when call putAt()', async () => {
+    await page.waitFor(300)
+
+    await page.click('.btn')
+
+    await page.waitFor(1000)
+    const transformText2 = await page.$eval('.content2', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x2 = getTranslate(transformText2, 'x')
+    const y2 = getTranslate(transformText2, 'y')
+
+    expect(x2).toBe(135)
+    expect(y2).toBe(215)
+  })
+
+  it('should work well when perform a zoom-out gesture', async () => {
+    await page.waitFor(300)
+
+    // zoom out
+    await page.dispatchPinch({
+      x: 265,
+      y: 165,
+      scaleFactor: 1.5,
+      gestureSourceType: 'touch'
+    })
+    const transformText1 = await page.$eval('.content1', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const scale1 = getScale(transformText1)
+
+    expect(scale1).toBeGreaterThan(1.2)
+  })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/movable/multi-content.e2e.ts

@@ -0,0 +1,57 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+
+jest.setTimeout(10000000)
+
+describe('Movable with multi content', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+
+  beforeAll(async () => {
+    await page.goto('http://0.0.0.0:8932/#/movable/multi-content')
+  })
+
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded'
+    })
+  })
+
+  it('should work well', async () => {
+    await page.waitFor(300)
+    const transformText1 = await page.$eval('.content1', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x1 = getTranslate(transformText1, 'x')
+    const y1 = getTranslate(transformText1, 'y')
+
+    expect(x1).toBe(10)
+    expect(y1).toBe(10)
+
+    const transformText2 = await page.$eval('.content2', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x2 = getTranslate(transformText2, 'x')
+    const y2 = getTranslate(transformText2, 'y')
+
+    expect(x2).toBe(0)
+    expect(y2).toBe(170)
+  })
+
+  it('should work well when call putAt()', async () => {
+    await page.waitFor(300)
+
+    await page.click('.btn')
+
+    await page.waitFor(1000)
+    const transformText2 = await page.$eval('.content2', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x2 = getTranslate(transformText2, 'x')
+    const y2 = getTranslate(transformText2, 'y')
+
+    expect(x2).toBe(67.5)
+    expect(y2).toBe(107.5)
+  })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/movable/scaled.e2e.ts

@@ -0,0 +1,91 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+import getScale from '../../util/getScale'
+
+jest.setTimeout(10000000)
+
+describe('Movable & Zoom Plugin', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+
+  beforeAll(async () => {
+    await page.goto('http://0.0.0.0:8932/#/movable/scale')
+  })
+
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded'
+    })
+  })
+
+  it('should support zoom in', async () => {
+    await page.waitFor(1000)
+
+    await page.waitFor(1000)
+    // zoom in
+    await page.dispatchPinch({
+      x: 180,
+      y: 180,
+      scaleFactor: 0.9,
+      gestureSourceType: 'touch'
+    })
+
+    const scaledElTransformText = await page.$eval('.scroll-content', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x = getTranslate(scaledElTransformText, 'x')
+    const y = getTranslate(scaledElTransformText, 'x')
+    const scale = getScale(scaledElTransformText)
+
+    expect(x).toBeGreaterThan(0)
+    expect(y).toBeGreaterThan(20)
+    expect(scale).toBeLessThan(1)
+  })
+
+  it('should support zoom out', async () => {
+    await page.waitFor(1000)
+    // zoom out
+    await page.dispatchPinch({
+      x: 180,
+      y: 180,
+      scaleFactor: 1.5,
+      gestureSourceType: 'touch'
+    })
+    await page.waitFor(1000)
+
+    const scaledElTransformText = await page.$eval('.scroll-content', node => {
+      return window.getComputedStyle(node).transform
+    })
+    const x = getTranslate(scaledElTransformText, 'x')
+    const y = getTranslate(scaledElTransformText, 'x')
+    const scale = getScale(scaledElTransformText)
+
+    expect(x).toBeLessThan(0)
+    expect(y).toBeLessThan(0)
+    expect(scale).toBeGreaterThan(1)
+  })
+
+  // it('should work well when dispatchScroll', async () => {
+  //   await page.waitFor(300)
+
+  //   await page.dispatchScroll({
+  //     x: 100,
+  //     y: 100,
+  //     xDistance: -70,
+  //     yDistance: -70,
+  //     gestureSourceType: 'touch'
+  //   })
+
+  //   await page.waitFor(2000)
+
+  //   const scaledElTransformText = await page.$eval('.scroll-content', node => {
+  //     return window.getComputedStyle(node).transform
+  //   })
+  //   const x = getTranslate(scaledElTransformText, 'x')
+  //   const y = getTranslate(scaledElTransformText, 'x')
+
+  //   expect(x).toBe(0)
+  //   expect(y).toBe(0)
+  // })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/nested-scroll/horizontal-in-vertical.e2e.ts

@@ -0,0 +1,70 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+
+jest.setTimeout(10000000)
+
+describe('Nested horizontal-in-vertical scroll', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+  beforeAll(async () => {
+    await page.goto(
+      'http://0.0.0.0:8932/#/nested-scroll/horizontal-in-vertical'
+    )
+  })
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded',
+    })
+  })
+
+  it('should make outer BScroll scroll when manipulating outerBScroll', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 100,
+      y: 60,
+      xDistance: 0,
+      yDistance: -70,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(1000)
+
+    const transformText = await page.$eval('.vertical-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+
+    const translateX = getTranslate(transformText!, 'y')
+    await expect(translateX).toBeLessThan(-30)
+  })
+
+  it('should only make innerBScroll scroll when manipulating innerBScroll', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 100,
+      y: 200,
+      xDistance: -300,
+      yDistance: 0,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(1000)
+
+    const outerTransformText = await page.$eval('.vertical-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+    const outerTranslateX = getTranslate(outerTransformText!, 'x')
+    await expect(outerTranslateX).toBe(0)
+
+    const innerTransformText = await page.$eval(
+      '.slide-banner-content',
+      (node) => {
+        return window.getComputedStyle(node).transform
+      }
+    )
+    const innerTranslateX = getTranslate(innerTransformText!, 'x')
+    await expect(innerTranslateX).toBeLessThan(-100)
+  })
+})

package/better-scroll-dev/better-scroll-dev/tests/e2e/nested-scroll/horizontal.e2e.ts

@@ -0,0 +1,124 @@
+import { Page } from 'puppeteer'
+import extendTouch from '../../util/extendTouch'
+import getTranslate from '../../util/getTranslate'
+
+jest.setTimeout(10000000)
+
+describe('Nested horizontal scroll', () => {
+  let page = (global as any).page as Page
+  extendTouch(page)
+  beforeAll(async () => {
+    await page.goto('http://0.0.0.0:8932/#/nested-scroll/horizontal')
+  })
+  beforeEach(async () => {
+    await page.reload({
+      waitUntil: 'domcontentloaded',
+    })
+  })
+
+  it('should make outer BScroll scroll when manipulating outerBScroll', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 100,
+      y: 110,
+      xDistance: -70,
+      yDistance: 0,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(2500)
+
+    const transformText = await page.$eval('.outer-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+
+    const translateX = getTranslate(transformText!, 'x')
+    await expect(translateX).toBeLessThan(-30)
+  })
+
+  it('should only make innerBScroll scroll', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 270,
+      y: 110,
+      xDistance: -70,
+      yDistance: 0,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(2500)
+
+    const outerTransformText = await page.$eval('.outer-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+    const outerTranslateX = getTranslate(outerTransformText!, 'x')
+    await expect(outerTranslateX).toBe(0)
+
+    const innerTransformText = await page.$eval('.inner-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+    const innerTranslateY = getTranslate(innerTransformText!, 'x')
+    await expect(innerTranslateY).toBeLessThan(-30)
+  })
+
+  it('should make outer BScroll scroll when innerScroll reached boundary', async () => {
+    await page.waitFor(300)
+
+    await page.dispatchScroll({
+      x: 270,
+      y: 110,
+      xDistance: -600,
+      yDistance: 0,
+      speed: 1800,
+      gestureSourceType: 'touch',
+    })
+
+    await page.waitFor(2500)
+
+    const innerTransformText = await page.$eval('.inner-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+    const innerTranslateX = getTranslate(innerTransformText!, 'x')
+    await expect(innerTranslateX).toBeLessThan(-50)
+
+    await page.dispatchScroll({
+      x: 270,
+      y: 110,
+      xDistance: -50,
+      yDistance: 0,
+      gestureSourceType: 'touch',
+    })
+
+    const outerTransformText = await page.$eval('.outer-content', (node) => {
+      return window.getComputedStyle(node).transform
+    })
+    const outerTranslateX = getTranslate(outerTransformText!, 'x')
+    await expect(outerTranslateX).toBeLessThan(-20)
+  })
+
+  it('should support click handle when use nestedScroll plugin', async () => {
+    const mockOuterHandler = jest.fn()
+    const mockInnerHandler = jest.fn()
+    page.once('dialog', async (dialog) => {
+      mockOuterHandler()
+      await dialog.dismiss()
+    })
+
+    // outer click
+    await page.touchscreen.tap(150, 110)
+    expect(mockOuterHandler).toBeCalledTimes(1)
+
+    await page.waitFor(500)
+
+    page.once('dialog', async (dialog) => {
+      mockInnerHandler()
+      await dialog.dismiss()
+    })
+
+    // inner click
+    await page.touchscreen.tap(300, 110)
+    expect(mockInnerHandler).toBeCalledTimes(1)
+  })
+})