You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by cx...@apache.org on 2017/03/27 16:41:39 UTC
[07/11] incubator-weex git commit: * [test] Add recycler tests.
* [test] Add recycler tests.
Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/20f0dc1d
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/20f0dc1d
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/20f0dc1d
Branch: refs/heads/0.11-dev
Commit: 20f0dc1d690f1bbf1d46d2f976194d6595e8e9aa
Parents: df10247
Author: \u9690\u98ce <cx...@apache.org>
Authored: Mon Mar 27 15:29:56 2017 +0800
Committer: \u9690\u98ce <cx...@apache.org>
Committed: Mon Mar 27 15:29:56 2017 +0800
----------------------------------------------------------------------
test/pages/components/recycler.vue | 28 ++-
test/scripts/components/recycler.test.js | 302 +++++++++++++++++++++++++-
2 files changed, 305 insertions(+), 25 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/20f0dc1d/test/pages/components/recycler.vue
----------------------------------------------------------------------
diff --git a/test/pages/components/recycler.vue b/test/pages/components/recycler.vue
index 3ad313e..12ca01c 100644
--- a/test/pages/components/recycler.vue
+++ b/test/pages/components/recycler.vue
@@ -49,11 +49,11 @@
<text v-if="item.behaviourName" class="itemClickBehaviour"> {{item.behaviourName}}</text>
</div>
</cell>
- <header class="footer">
+ <header class="footer" ref="footer">
<text class="stickyText">Footer</text>
</header>
- <div ref="fixed" class="fixedItem" @click="scrollToTop">
- <text class="fixedText">Top</text>
+ <div ref="fixed" class="fixedItem" @click="scrollToNext">
+ <text class="fixedText">bot</text>
</div>
</waterfall>
</template>
@@ -79,8 +79,6 @@
width: 40;
margin-right: 30;
}
- .header {
- }
.banner {
height: 377;
flex-direction: row;
@@ -223,9 +221,9 @@
justify-content: center;
}
.fixedText {
- font-size: 36;
+ font-size: 32;
color: white;
- line-height: 36;
+ line-height: 32;
}
</style>
@@ -238,8 +236,8 @@
src:'https://gw.alicdn.com/tps/TB1Jl1CPFXXXXcJXXXXXXXXXXXX-370-370.jpg',
name: 'Thomas Carlyle',
desc:'Genius only means hard-working all one\'s life',
- behaviourName: 'Change count',
- behaviour: 'changeColumnCount'
+ behaviourName: 'Change width',
+ behaviour: 'changeColumnWidth',
},
{
src:'https://gw.alicdn.com/tps/TB1Hv1JPFXXXXa3XXXXXXXXXXXX-370-370.jpg',
@@ -250,15 +248,15 @@
{
src:'https://gw.alicdn.com/tps/TB1eNKuPFXXXXc_XpXXXXXXXXXX-370-370.jpg',
desc:'There is no such thing as a great talent without great will - power',
- behaviourName: 'Show scrollbar',
- behaviour: 'showScrollbar',
+ behaviourName: 'Change count',
+ behaviour: 'changeColumnCount'
},
{
src:'https://gw.alicdn.com/tps/TB1DCh8PFXXXXX7aXXXXXXXXXXX-370-370.jpg',
name:'Addison',
desc:'Cease to struggle and you cease to live',
- behaviourName: 'Change width',
- behaviour: 'changeColumnWidth',
+ behaviourName: 'Show scrollbar',
+ behaviour: 'showScrollbar',
},
{
src:'https://gw.alicdn.com/tps/TB1ACygPFXXXXXwXVXXXXXXXXXX-370-370.jpg',
@@ -440,8 +438,8 @@
this.stickyHeaderType = (this.stickyHeaderType === 'scroll' ? 'none' : 'scroll')
},
- scrollToTop: function() {
- weex.requireModule('dom').scrollToElement(this.$refs.header)
+ scrollToNext: function() {
+ weex.requireModule('dom').scrollToElement(this.$refs.footer)
},
setRecyclerPadding: function() {
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/20f0dc1d/test/scripts/components/recycler.test.js
----------------------------------------------------------------------
diff --git a/test/scripts/components/recycler.test.js b/test/scripts/components/recycler.test.js
index f091e1f..19f0ad3 100644
--- a/test/scripts/components/recycler.test.js
+++ b/test/scripts/components/recycler.test.js
@@ -11,15 +11,26 @@ var util = require("../util.js");
const platform = process.env.platform.toLowerCase() || 'android';
const isAndroid = platform === 'android';
-let cell1Path = isAndroid ? '//recycler[1]/div[3]/' : '//recycler[1]/cell[1]/'
-let cell2Path = isAndroid ? '//recycler[1]/div[4]/' : '//recycler[1]/cell[2]/'
-let cell3Path = isAndroid ? '//recycler[1]/div[5]/' : '//recycler[1]/cell[3]/'
-let cell4Path = isAndroid ? '//recycler[1]/div[6]/' : '//recycler[1]/cell[4]/'
+const fixedPath = '//div[1]'
+const header1Path = '//recycler[1]/div[1]/'
+const header2Path = '//recycler[1]/div[2]/'
+const cell1Path = isAndroid ? '//recycler[1]/div[3]/' : '//recycler[1]/cell[1]/'
+const cell2Path = isAndroid ? '//recycler[1]/div[4]/' : '//recycler[1]/cell[2]/'
+const cell3Path = isAndroid ? '//recycler[1]/div[5]/' : '//recycler[1]/cell[3]/'
+const cell4Path = isAndroid ? '//recycler[1]/div[6]/' : '//recycler[1]/cell[4]/'
+const cell27Path = isAndroid ? '//recycler[1]/div[29]/' : '//recycler[1]/cell[27]/'
+const cell28Path = isAndroid ? '//recycler[1]/div[30]/' : '//recycler[1]/cell[28]/'
+const cell29Path = isAndroid ? '//recycler[1]/div[31]/' : '//recycler[1]/cell[29]/'
+const cell30Path = isAndroid ? '//recycler[1]/div[32]/' : '//recycler[1]/cell[30]/'
+const footerPath = '//recycler[1]/div[1]'
const isApproximate = (x, y) => {
return Math.abs(x - y) <= 1
}
+if (isAndroid) {
+ return;
+}
describe('recycler', function () {
this.timeout(util.getTimeoutMills())
@@ -33,7 +44,7 @@ describe('recycler', function () {
});
after(function () {
- // return util.quit(driver);
+ return util.quit(driver);
})
let scaleFactor = 0
@@ -62,7 +73,7 @@ describe('recycler', function () {
assert.isOk(isApproximate(rect.width, recyclerWidth))
assert.isOk(isApproximate(rect.height, screenHeight - navBarHeight))
})
- .elementByXPath('//recycler[1]/div[1]/')
+ .elementByXPath(header1Path)
.getRect()
.then((rect)=>{
console.log(`header 1 rect:${JSON.stringify(rect)}`)
@@ -71,7 +82,7 @@ describe('recycler', function () {
assert.isOk(isApproximate(rect.width, recyclerWidth))
assert.isOk(isApproximate(rect.height, 377 * scaleFactor))
})
- .elementByXPath('//recycler[1]/div[2]/')
+ .elementByXPath(header2Path)
.getRect()
.then((rect)=>{
console.log(`header 2 rect:${JSON.stringify(rect)}`)
@@ -94,8 +105,8 @@ describe('recycler', function () {
.then((rect)=>{
console.log(`cell 2 rect:${JSON.stringify(rect)}`)
cell2Height = rect.height
- assert.isOk(isApproximate(rect.x, 381 * scaleFactor), 'x not approximate:' + 381 * scaleFactor)
- assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor), 'y not approximate:' + (navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.x, 381 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
assert.isOk(isApproximate(rect.width, 369 * scaleFactor))
})
.elementByXPath(cell3Path)
@@ -114,7 +125,152 @@ describe('recycler', function () {
assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor + cell1Height))
assert.isOk(isApproximate(rect.width, 369 * scaleFactor))
})
- .elementByXPath('//div[1]')
+ })
+
+ it('#2 test column count', () => {
+ return driver
+ .elementByXPath(cell3Path)
+ .click()
+ .elementByXPath(cell1Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 1 rect after changing column count to 3:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 242 * scaleFactor))
+ })
+ .elementByXPath(cell2Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 2 rect after changing column count to 3:${JSON.stringify(rect)}`)
+ cell2Height = rect.height
+ assert.isOk(isApproximate(rect.x, 254 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 242 * scaleFactor))
+ })
+ .elementByXPath(cell3Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 3 rect after changing column count to 3:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 508 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 242 * scaleFactor))
+ })
+ .elementByXPath(cell4Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 4 rect after changing column count to 3:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 254 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor + cell2Height))
+ assert.isOk(isApproximate(rect.width, 242 * scaleFactor))
+ })
+ .elementByXPath(cell3Path)
+ .click()
+ })
+
+ it('#3 test column gap', () => {
+ return driver
+ .elementByXPath(cell2Path)
+ .click()
+ .elementByXPath(cell1Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 1 rect after changing column gap to normal:${JSON.stringify(rect)}`)
+ cell1Height = rect.height
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell2Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 2 rect after changing column gap to normal:${JSON.stringify(rect)}`)
+ cell2Height = rect.height
+ assert.isOk(isApproximate(rect.x, 393 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell3Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 3 rect after changing column gap to normal:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 393 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor + cell2Height))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell4Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 4 rect after changing column gap to normal:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor + cell1Height))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell2Path)
+ .click()
+ })
+
+ it('#4 test column width', () => {
+ return driver
+ .elementByXPath(cell1Path)
+ .click()
+ .elementByXPath(cell1Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 1 rect after changing column width to 600:${JSON.stringify(rect)}`)
+ cell1Height = rect.height
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, recyclerWidth))
+ })
+ .elementByXPath(cell2Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 2 rect after changing column width to 600:${JSON.stringify(rect)}`)
+ cell2Height = rect.height
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight + 471 * scaleFactor + cell1Height))
+ assert.isOk(isApproximate(rect.width, recyclerWidth))
+ })
+ .elementByXPath(cell1Path)
+ .click()
+ })
+
+ it('#5 test deleting header', () => {
+ return driver
+ .elementByXPath(header2Path)
+ .click()
+ .elementByXPath(header1Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`header 2 rect after deleting header 1:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight))
+ assert.isOk(isApproximate(rect.width, recyclerWidth))
+ })
+ .elementByXPath(header2Path)
+ .click()
+ })
+
+ it('#6 test footer', () => {
+ return driver
+ .elementByXPath(fixedPath)
+ .click()
+ .sleep(500)
+ .elementByXPath(footerPath)
+ .getRect()
+ .then((rect)=>{
+ console.log(`footer rect:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, screenHeight - 94 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, recyclerWidth))
+ assert.isOk(isApproximate(rect.height, 94 * scaleFactor))
+ })
+ })
+
+ it('#7 test sticky and fixed', () => {
+ return driver
+ .elementByXPath(fixedPath)
.getRect()
.then((rect)=>{
console.log(`fixed rect:${JSON.stringify(rect)}`)
@@ -123,8 +279,134 @@ describe('recycler', function () {
assert.isOk(isApproximate(rect.width, 78 * scaleFactor))
assert.isOk(isApproximate(rect.height, 78 * scaleFactor))
})
+ .elementByXPath(header2Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`sticky header rect:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, navBarHeight))
+ assert.isOk(isApproximate(rect.width, recyclerWidth))
+ assert.isOk(isApproximate(rect.height, 94 * scaleFactor))
+ })
+ })
+
+ it('#8 test removing cell', () => {
+ return driver
+ .elementByXPath(cell29Path)
+ .click()
+ .elementByXPath(cell28Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 28 rect after removing cell 29:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 0))
+ assert.isOk(isApproximate(rect.y, screenHeight - 94 * scaleFactor - rect.height))
+ assert.isOk(isApproximate(rect.width, 369 * scaleFactor))
+ })
+ })
+
+ it('#9 test moving cell', () => {
+ return driver
+ .elementByXPath(cell29Path)
+ .click()
+ .elementByXPath(fixedPath)
+ .click()
+ .elementByXPath(cell29Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 28 rect after moving cell 29 to 1:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 381 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, screenHeight - 94 * scaleFactor - rect.height))
+ assert.isOk(isApproximate(rect.width, 369 * scaleFactor))
+ })
+ })
+
+ it('#10 test recycler padding', () => {
+ return driver
+ .elementByXPath(cell28Path)
+ .click()
+ .elementByXPath(fixedPath)
+ .click()
+ .elementByXPath(header2Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`sticking header rect after setting padding to 12:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 12 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, navBarHeight))
+ assert.isOk(isApproximate(rect.width, recyclerWidth - 24 * scaleFactor))
+ assert.isOk(isApproximate(rect.height, 94 * scaleFactor))
+ })
+ .elementByXPath(footerPath)
+ .getRect()
+ .then((rect)=>{
+ console.log(`footer rect after setting padding to 12:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 12 * scaleFactor))
+ assert.isOk(isApproximate(rect.y, screenHeight - 106 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, recyclerWidth - 24 * scaleFactor))
+ assert.isOk(isApproximate(rect.height, 94 * scaleFactor))
+ })
+ .elementByXPath(cell28Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 28 rect after setting padding to 12:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 12 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell29Path)
+ .getRect()
+ .then((rect)=>{
+ console.log(`cell 29 rect after setting padding to 12:${JSON.stringify(rect)}`)
+ assert.isOk(isApproximate(rect.x, 381 * scaleFactor))
+ assert.isOk(isApproximate(rect.width, 357 * scaleFactor))
+ })
+ .elementByXPath(cell28Path)
+ .click()
})
+ it('#11 test onscroll', () => {
+ let originContentOffset = 0
+ return driver
+ .elementByXPath(cell29Path)
+ .click()
+ .elementByXPath(header2Path + '/div[1]/div[1]/text[1]')
+ .text()
+ .then(text => {
+ console.log(text)
+ originContentOffset = Number.parseInt(text.replace('Content Offset:-',''))
+ })
+ .touch('drag', {fromX:recyclerWidth / 2, fromY:screenHeight / 5, toX:recyclerWidth / 2, toY: screenHeight * 4 / 5})
+ .sleep(1000)
+ .touch('drag', {fromX:recyclerWidth / 2, fromY:screenHeight / 5, toX:recyclerWidth / 2, toY: screenHeight * 4 / 5})
+ .elementByXPath(header2Path + '/div[1]/div[1]/text[1]')
+ .text()
+ .then(text => {
+ console.log(text)
+ const contentOffset = Number.parseInt(text.replace('Content Offset:-',''))
+ assert.isOk(originContentOffset - contentOffset > screenHeight / scaleFactor)
+ })
+ .elementByXPath(fixedPath)
+ .click()
+ })
+
+ it('#12 test scrollable', () => {
+ let originContentOffset = 0
+ return driver
+ .elementByXPath(cell27Path)
+ .click()
+ .elementByXPath(header2Path + '/div[1]/div[1]/text[1]')
+ .text()
+ .then(text => {
+ console.log(text)
+ originContentOffset = Number.parseInt(text.replace('Content Offset:-',''))
+ })
+ .touch('drag', {fromX:recyclerWidth / 2, fromY:screenHeight / 5, toX:recyclerWidth / 2, toY: screenHeight * 4 / 5})
+ .elementByXPath(header2Path + '/div[1]/div[1]/text[1]')
+ .text()
+ .then(text => {
+ console.log(text)
+ const contentOffset = Number.parseInt(text.replace('Content Offset:-',''))
+ assert.equal(contentOffset, originContentOffset)
+ })
+ })
});