test mocha-phantom

wormsan · Feb 8, 2017 · 47befaa · 47befaa
1 parent ba72050
commit 47befaa
Show file tree

Hide file tree

Showing 5 changed files with 59 additions and 197 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+npm-debug.log
+node_modules/
+debug.log
diff --git a/README.md b/README.md
@@ -1,155 +1,6 @@
 # vue-lazyload-img
 
-## intro
-    a plugin of vue for image lazyload, especially optimized for mobile browser
 
-[demo](http://jalbaa.github.io/vue-lazyload-img/example/demo.html)
+适配vue2的更新
 
-* support require.js(AMD),sea.js(CMD),webpack(CommonJs)
-* detect image's visibility not only from vertical direction, but also horizontal
-* detect scrolling speed, when scrolling speed is faster than threshold, image will not be loaded
-
-## API
-
-### init
-
-Vue.use(Vue.lazyimg[,options])
-
-### options
-global options
-#### fade: all images will use fadein fx
-
-* true: all images will fadein if lazyload Complete
-* false **(default)**: no fadein fx of all
-
-#### nohori: disable lazyload from horizontal direction
-
-* true: all images will not detect horizontal direction
-* false **(default)**:  detect horizontal direction
-
-#### speed: threshold of loading lazyload iamge
-
-* 0 **(default)**: load lazy-image when the image is visible at the 1st time
-* >0 **(recommend 20)**: average changes of document y-pos and any scroller's x-pos from last 10 frames, awesome in mobile browsers
-
-```
-Vue.use(Vue.lazyimg,{
-    fade: true,
-    nohori: true,
-    speed: 20,
-})
-```
-
-### directive
-
-#### v-lazyload
-
-* v-lazyload="src"
-* v-lazyload:opt.nohri="src"
-* v-lazyload:opt.fadein="src"
-* v-lazyload:opt.nohri.fadein="src"
-
-## How to import?
-
-### In CommonJs
-
-#### 1st
-``` shell
-npm install vue-lazyload-img
-```
-
-#### 2nd
-es6
-
-``` javascript
-import "vue-lazyload-img"
-Vue.use(Vue.lazyimg)
-```
-es5
-
-``` javascript
-require("vue-lazyload-img")
-Vue.use(Vue.lazyimg)
-```
-### In browser
-
-because this plugins supports `umd`, so you can use it as a `<script>` or with JS module loader like `require.js`.
-
-## 介绍
-    vue图片懒加载插件，特别为移动端优化
-
-[demo](http://jalbaa.github.io/vue-lazyload-img/example/demo.html)
-
-* 符合umd规范，有效适配require.js，sea.js，webpack等各种模块加载器，普通引入也可以
-* 十字方向检测图片是否可显示，不仅能做到上下滚动懒加载，还能做到水平方向懒加载
-* 监测屏幕滚动速率，阈值可自定义，尤其适合移动端，比如屏幕快速向下滑动，其间的图片不会被加载
-* 可选的淡入特效
-
-## API
-
-### 初始化
-
-Vue.use(Vue.lazyimg[,options])
-
-### options（可选参数）
-
-全局选项
-
-#### fade: 全部图片使用淡入特效
-
-* true: 所有的图片都会使用淡入特效
-* false **(默认)**: 不使用淡入特效
-
-#### nohori: 禁用水平方向的检测
-
-* true: 禁用水平方向的检测
-* false **(默认)**:  不禁用水平方向的检测
-
-#### speed: 速度检测的临界值
-
-* 0 **(默认)**: 只要图片在屏幕里出现了，那么图片就开始懒加载
-* >0 **(推荐 20)**: 只有当屏幕滚动速度小于speed且图片在屏幕中出现了才开始懒加载
-
-```
-Vue.use(Vue.lazyimg,{
-    fade: true,
-    nohori: true,
-    speed: 20,
-})
-```
-
-### directive
-
-#### v-lazyload
-
-* v-lazyload="src"
-* v-lazyload:opt.nohri="src"
-* v-lazyload:opt.fadein="src"
-* v-lazyload:opt.nohri.fadein="src"
-
-
-## 如何引入?
-
-### 在CommonJs中
-
-#### 首先
-``` shell
-npm install vue-lazyload-img
-```
-
-#### 然后
-es6
-
-``` javascript
-import "vue-lazyload-img"
-Vue.use(Vue.lazyimg)
-```
-es5
-
-``` javascript
-require("vue-lazyload-img")
-Vue.use(Vue.lazyimg)
-```
-#### 在浏览器中
-
-由于使用了`umd`规范，所以可以用`<script>`标签引入，或使用其他的JS模块加载器，比如`require.js`
+作为vue-ui-kit体系的可搭配套件使用
diff --git a/package.json b/package.json
@@ -1,7 +1,5 @@
 {
-  "author": {
-    "name": "jalbaa"
-  },
+  "author": "jalbaa",
   "dependencies": {},
   "description": "",
   "devDependencies": {
@@ -10,10 +8,17 @@
     "babel-plugin-transform-runtime": "^6.15.0",
     "babel-preset-es2015": "^6.18.0",
     "babel-runtime": "^6.18.0",
-    "vue": "^2.1.4",
-    "webpack": "^1.13.3"
+    "chai": "^3.5.0",
+    "mocha": "^3.2.0",
+    "mocha-phantomjs": "^4.1.0",
+    "mocha-phantomjs-core": "^2.1.1",
+    "vue": "2.0.0",
+    "webpack": "^1.14.0"
+  },
+  "peerDependencies": {
+    "vue": "^2.0.0"
   },
-  "license": "ISC",
+  "license": "MIT",
   "main": "src/index.js",
   "name": "gome-ui-lazyload",
   "optionalDependencies": {},
@@ -31,8 +36,6 @@
     "vue",
     "lazyload"
   ],
-  "author": "jalbaa",
-  "license": "MIT",
   "bugs": {
     "url": "https://github.com/JALBAA/vue-lazyload-img/issues"
   },

diff --git a/test/index.html b/test/index.html
@@ -0,0 +1,21 @@
+<html>
+  <head>
+    <meta charset="utf-8">
+    <!-- encoding must be set for mocha's special characters to render properly -->
+    <link rel="stylesheet" href="../node_modules/mocha/mocha.css" />
+  </head>
+  <body style="background:white;">
+    <div id="mocha"></div>
+    <script src="../node_modules/mocha/mocha.js"></script>
+    <script src="../node_modules/chai/chai.js"></script>
+    <script>
+      mocha.ui('bdd')
+      expect = chai.expect
+      assert = chai.assert
+    </script>
+    <script src="test.js"></script>
+    <script>
+      mocha.run()
+    </script>
+  </body>
+</html>
diff --git a/test/test.js b/test/test.js
@@ -1,41 +1,25 @@
-import Vue from 'vue';
-import lazyload from '../src/index.js';
-console.log(lazyload)
-Vue.use(lazyload);
+function takeScreenshot() {
+    if (window.callPhantom) {
+        var date = new Date()
+        var filename = "screenshots/" + date.getTime()
+        console.log("Taking screenshot " + filename)
+        callPhantom({'screenshot': filename})
+    }
+}
 
-//let imgList = ["http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg"];
-let imgList = ["http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg"];
 
-const App = new Vue({
-    el: '#app',
-    template: `
-        <div style="height:1000px">
-            <img :src="'http://desk.fd.zol-img.com.cn/t_s960x600c5/g4/M00/0D/01/Cg-4y1ULoXCII6fEAAeQFx3fsKgAAXCmAPjugYAB5Av166.jpg'" 
-                v-lazyload = "item"
-                v-for = "item in imgList"></img>
-        </div>
-    `,
-    data () {
-        return {
-            imgList,
-            msg: 'not updated'
-        }
-    },
-    mounted () {
-        console.log('mounted')
-        this.$watch('img', (v) => {
-            console.log('aa',v)
-        })
-        setTimeout(() => {
-            this.msg = 'update'
-            this.imgList = ['http://gfs6.gomein.net.cn/T1HoxTB5E_1RCvBVdK'];
-            //this.$set('imgList','0','http://gfs6.gomein.net.cn/T1HoxTB5E_1RCvBVdK')
-            //this.imgList = ["http://gfs6.gomein.net.cn/T1HoxTB5E_1RCvBVdK","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg"];
-           // this.imgList = ["http://gfs6.gomein.net.cn/T1HoxTB5E_1RCvBVdK","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg","http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0E/ChMkJlbKwaOIN8zJAAs5DadIS-IAALGbQPo5ngACzkl365.jpg"];
-           // console.log(this.imgList)
-        }, 2000)
-    },
-    updated () {
-        console.log('update')
+afterEach(function () {
+    if (this.currentTest.state == 'failed') {
+        takeScreenshot();
     }
-});
+})
+
+var a = '1';
+describe('a', function () {
+    it('expect(a).to.equal(1)', function(done){
+        expect(a).to.equal('1');
+        done();
+    });
+})
+
+takeScreenshot();