* [test] add Macaca test case for text
The test case mainly focus on the layout of text.


Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/47200259
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/47200259
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/47200259

Branch: refs/heads/0.12-dev
Commit: 47200259b356c88ddb8fe6925522fb66a5089139
Parents: 90c3583
Author: YorkShen <shenyua...@gmail.com>
Authored: Wed Apr 12 11:33:11 2017 +0800
Committer: YorkShen <shenyua...@gmail.com>
Committed: Tue Apr 18 19:48:52 2017 +0800

----------------------------------------------------------------------
 test/pages/components/text-layout.vue |  30 +++++++
 test/scripts/components/text.test.js  | 131 +++++++++++++++++++++++++++++
 2 files changed, 161 insertions(+)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/47200259/test/pages/components/text-layout.vue
----------------------------------------------------------------------
diff --git a/test/pages/components/text-layout.vue 
b/test/pages/components/text-layout.vue
new file mode 100644
index 0000000..e73e64c
--- /dev/null
+++ b/test/pages/components/text-layout.vue
@@ -0,0 +1,30 @@
+<template>
+  <scroller class="wrapper">
+    <text test-id ="text-only">Hello World</text>
+    <text test-id ="lines" 
style="lines:2;line-height:32px;font-size:36px;color:#0000FF">永和九年,岁在癸丑,暮春之初,会于会稽山阴之å
…
°äº­ã€‚\n\t群贤毕至,少长咸集。此地有崇山峻领,茂林脩竹;又有æ¸
…流激湍,暎带左右。引以为流觞曲水,列坐其次。\n\tLet us 
not seek to satisfy our thirst for freedom. \n\tAgain and again, we must rise 
to the majestic heights of meeting physical force with soul force.</text>
+    <text test-id ="font" style="lines:3;font-size:48px;color:#FF0000">å…
¶å½¢ä¹Ÿï¼Œç¿©è‹¥æƒŠé¸¿ï¼Œå©‰è‹¥æ¸¸é¾™ï¼Œè£æ›œç§‹èŠï¼ŒåŽèŒ‚春松。髣髴å…
®è‹¥è½»äº‘之蔽月,飘飖å…
®è‹¥æµé£Žä¹‹å›žé›ªã€‚远而望之,皎若太阳升朝霞。迫而察之,灼若芙蕖出渌波。秾纤得衷,修短合度。肩若削成,è
…°å¦‚约素。延颈秀项,皓质呈露,芳泽无加,铅
华弗御。云髻峨峨,修眉联娟,丹唇外朗,皓齿内
鲜。明眸善睐,靥辅承权,瓌姿艳逸,仪静体闲。柔情
绰态,媚于语言。奇服旷世,骨像应图。披罗衣之璀粲å…
®ï¼Œç¥ç‘¶ç¢§ä¹‹åŽçšã€‚戴金翠之首饰,缀明珠
以耀躯。践远游之文履,曳雾绡之轻裾。微幽兰之芳蔼å…
®ï¼Œæ­¥è¸Ÿè¹°äºŽå±±éš…
。于是忽焉纵体,以遨以嬉。左倚采旄,右荫桂旗。攘皓è…
•äºŽç¥žæµ’兮,采湍濑之玄芝。</text>
+    <text test-id ="fixed-size" style="width:300px; 
height:100px;color:#FF00FF">壬戌之秋,七月既望,苏子与客泛舟游于赤壁之下。æ¸
…风徐来,水波不兴。举酒属客,诵明月之诗,歌窈窕之章
。少焉,月出于东山之上,徘徊于斗牛之间。白露横江,水å…
‰æŽ¥å¤©ã€‚纵一苇之所如,凌万顷之茫然。浩浩乎如冯虚御风,而不知å
…¶æ‰€æ­¢ï¼›é£˜é£˜ä¹Žå¦‚遗世独立,羽化而登仙。</text>
+    <div 
style="flex-direction:row;width:500px;height:300px;background-color:red">
+      <text style="flex:1;line-height:36px;background-color:#AC34Ef" 
test-id="flexgrow-alignitems">Hello </text>
+    </div>
+
+    <div 
style="flex-direction:row;width:500px;height:300px;background-color:red;align-items:center">
+      <text style="flex:1;line-height:40px;background-color:#12CDEE" 
test-id="flexgrow">World</text>
+    </div>
+
+    <div style="width:500px;height:300px;background-color:red">
+      <text style="flex:1;line-height:36px;background-color:blue" 
test-id="flexgrow-alignitems-coloumn">Hello </text>
+    </div>
+
+    <div 
style="width:500px;height:300px;background-color:red;align-items:center">
+      <text style="flex:1;line-height:40px;background-color:blue" 
test-id="flexgrow-column">World</text>
+    </div>
+  </scroller>
+</template>
+
+<style>
+.wrapper{
+    width: 750px;
+    background-color: yellow;
+}
+</style>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/47200259/test/scripts/components/text.test.js
----------------------------------------------------------------------
diff --git a/test/scripts/components/text.test.js 
b/test/scripts/components/text.test.js
new file mode 100644
index 0000000..3c7c347
--- /dev/null
+++ b/test/scripts/components/text.test.js
@@ -0,0 +1,131 @@
+'use strict';
+
+var _ = require('macaca-utils');
+var assert = require('chai').assert
+var wd = require('weex-wd')
+var path = require('path');
+var os = require('os');
+var util = require("../util.js");
+
+describe('weex text', function () {
+  this.timeout(util.getTimeoutMills());
+  var driver = util.createDriver(wd);
+
+  before(function () {
+    return util.init(driver)
+      .get(util.getPage('/components/text-layout.js'))
+      .waitForElementById("lines", util.getGETActionWaitTimeMills(),1000)
+  });
+
+  after(function () {
+      // return util.quit(driver);
+  })
+
+
+  let scaleFactor = 0 
+  let screenWidth = 0
+  it ('#1 Window size', () =>{
+    return driver
+    .getWindowSize()
+    .then(size=>{
+      screenWidth =  size.width
+      scaleFactor = screenWidth/ 750
+    })
+  })
+
+  it('#2 Text Content', () => {
+    return driver
+    .elementById('text-only')
+    .text()
+    .then((text)=>{
+      assert.equal(text,'Hello World')
+    })
+  })
+
+  it ('#3 Line Height', () =>{
+    return driver
+    .elementById('lines')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, screenWidth)
+       assert.equal(rect.height, Math.floor(2 * 32 * scaleFactor))
+       scroll(rect.height)
+    })
+  })
+
+   it ('#4 Font Size', () =>{
+    return driver
+    .elementById('font')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, screenWidth)
+       assert.isAtLeast(rect.height, Math.floor(2 * 48 * scaleFactor))
+       scroll(rect.height)
+    })
+  })
+
+   it ('#5 Fixed-Size', () =>{
+    return driver
+    .elementById('fixed-size')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, Math.floor(300 * scaleFactor))
+       assert.equal(rect.height, Math.floor(100 * scaleFactor))
+       scroll(rect.height)
+    })
+  })
+
+   it ('#6 flex:1; align-Items: stretch; flex-direction:row', () =>{
+    return driver
+    .elementById('flexgrow-alignitems')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, Math.floor(500 * scaleFactor))
+       assert.equal(rect.height, Math.floor(300 * scaleFactor))
+       scroll(rect.height)
+    })
+   })
+  
+   it ('#7 flex:1; align-Items: center; flex-direction:row', () =>{
+    return driver
+    .elementById('flexgrow')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, Math.floor(500 * scaleFactor))
+       assert.equal(rect.height, Math.floor(40 * scaleFactor))
+       scroll(rect.height)
+    })
+   })
+
+   it ('#8 flex:1; align-Items: stretch; flex-direction:column', () =>{
+    return driver
+    .elementById('flexgrow-alignitems-coloumn')
+    .getRect()
+    .then(rect => {
+       assert.equal(rect.width, Math.floor(500 * scaleFactor))
+       assert.equal(rect.height, Math.floor(300 * scaleFactor))
+       scroll(rect.height)
+    })
+   })
+  
+   it ('#9 flex:1; align-Items: auto; flex-direction:column', () =>{
+    return driver
+    .elementById('flexgrow-column')
+    .getRect()
+    .then(rect => {
+       assert.isBelow(rect.width, 500 * scaleFactor/2)
+       assert.equal(rect.height, Math.floor(300 * scaleFactor))
+       scroll(rect.height)
+    })
+   })
+
+   function scroll(height){
+      driver.touch('drag', {
+        fromX:100,
+        fromY:300+height,
+        toX:  100,
+        toY: 300,
+        duration: 0.5
+       })
+   }
+});

Reply via email to