Merge branch 'master' of https://github.com/sentsin/layui

merge

bower.json

@@ -1,4 +1,4 @@
-{
+{
   "name": "layui",
   "main": "src/layui.js",
   "version": "2.1.3",

test/lay/modules/laydate.js

@@ -0,0 +1,429 @@
+/**
+ * @file laydate - 测试
+ * @author xuexb <fe.xiaowu@gmail.com>
+ */
+
+/* global layui */
+/* eslint-disable max-nested-callbacks, fecs-indent */
+
+var $ = layui.$;
+var laydate = layui.laydate;
+
+/**
+ * 创建dom元素, 并返回 jquery 对象
+ *
+ * @param  {string} html 标签
+ *
+ * @return {jQuery}
+ */
+var createNode = function (html) {
+  return $(html).addClass('test-node').appendTo('body');
+};
+
+/**
+ * 日期格式化
+ *
+ * @param {string} str 格式
+ * @param {Date|number|string} date 时间对象或者时间缀
+ * @return {string}
+ *
+ * @example
+ * yyyy-MM-dd hh:mm:ss.S
+ * yyyy-MM-dd E HH:mm:ss
+ * yyyy-MM-dd EE hh:mm:ss
+ * yyyy-MM-dd EEE hh:mm:ss
+ * yyyy-M-d h:m:s.S
+ */
+var dateFormat = function (str, date) {
+  str = str || 'yyyy-MM-dd HH:mm';
+
+  if (date && !(date instanceof Date)) {
+      date = new Date(date);
+  }
+  else {
+    date = new Date();
+  }
+
+  var getTime = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'h+': date.getHours() % 12 === 0 ? 12 : date.getHours() % 12,
+    'H+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds(),
+    'S': date.getMilliseconds()
+  };
+
+  // 如果有年
+  if (/(y+)/i.test(str)) {
+    // RegExp.$1为上次正则匹配的第1个结果，那么length就不用说了吧
+    str = str.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
+  }
+
+  layui.each(getTime, function (key) {
+    if (new RegExp('(' + key + ')').test(str)) {
+      str = str.replace(RegExp.$1, (RegExp.$1.length === 1)
+        ? (getTime[key])
+        : (('00' + getTime[key]).substr(('' + getTime[key]).length)));
+    }
+  });
+
+  return str;
+};
+
+
+describe('laydate', function () {
+  // 输出测试节点
+  beforeEach(function () {
+    createNode('<div id="test-div"></div>');
+    createNode('<input id="test-input" type="text">');
+  });
+
+  // 删除节点
+  afterEach(function () {
+    $('.layui-laydate, .test-node').remove();
+  });
+
+  it('version', function () {
+    expect(laydate.v).to.be.a('string');
+    expect(laydate.v).to.not.be.empty;
+  });
+
+  describe('laydate.render()', function () {
+
+    it('check params and return value', function () {
+      expect(laydate.render()).to.be.a('object', 'render() 返回值必须是对象');
+      expect(laydate.render('str')).to.have.property('hint');
+      expect(laydate.render().hint).to.be.a('function', 'render() 返回值必须包含 hint()');
+      expect(laydate.render({})).to.have.property('config');
+    });
+
+    describe('options.ready', function () {
+      it('not elem', function (done) {
+        var flag = true;
+        laydate.render({
+          ready: function () {
+            flag = false;
+          }
+        });
+
+        setTimeout(function () {
+          expect(flag).to.be.true;
+          done();
+        }, 360);
+      });
+
+      it('trigger', function (done) {
+        laydate.render({
+          elem: '#test-div',
+          ready: function (data) {
+            expect(data).to.be.a('object');
+            done();
+          }
+        });
+
+        $('#test-div').click();
+      });
+
+      // 如果是div则自动切换成click
+      it('multiple trigger', function (done) {
+        var index = 0;
+
+        laydate.render({
+          elem: '#test-div',
+          ready: function () {
+            index += 1;
+          }
+        });
+        $('#test-div').click().click().click();
+
+        setTimeout(function () {
+          expect(index).to.equal(3);
+          done();
+        });
+      });
+    });
+
+    it('options.elem', function () {
+      expect(function () {
+        laydate.render({
+          elem: '#test-div'
+        });
+
+        laydate.render({
+          elem: '#test-div-layui'
+        });
+
+        laydate.render({
+          elem: '.ok-layui'
+        });
+      }).to.not.throw;
+
+      expect($('.layui-laydate').length).to.equal(0);
+    });
+
+    describe('options.type', function () {
+      it('default value', function () {
+        expect(laydate.render().config.type).to.equal('date');
+        expect(laydate.render({
+          elem: '#test-div'
+        }).config.type).to.equal('date', 'render 方法 options.type 默认值必须是 date');
+      });
+
+      it('error value', function () {
+        expect(function () {
+          laydate.render({
+            elem: '#test-div',
+            type: 'layui'
+          });
+        }).to.throw();
+      });
+
+      it('is year', function () {
+        var result = laydate.render({
+          elem: '#test-div',
+          type: 'year'
+        });
+
+        expect(result.config.type).to.equal('year');
+        expect($('.laydate-set-ym').length).to.equal(0);
+
+        $('#test-div').click();
+
+        expect($('.laydate-set-ym').length).to.equal(1);
+        expect($('.laydate-year-list .layui-this').text()).to.equal(dateFormat('yyyy年'), '默认高亮显示当前年');
+
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy'), '确认后输出选中的值');
+      });
+
+      it('is month', function () {
+        var result = laydate.render({
+          elem: '#test-div',
+          type: 'month'
+        });
+
+        expect(result.config.type).to.equal('month');
+        expect($('.laydate-set-ym').length).to.equal(0);
+
+        $('#test-div').click();
+
+        expect($('.laydate-set-ym').length).to.equal(1);
+        expect($('.laydate-month-list .layui-this').attr('lay-ym'))
+          .to.equal(dateFormat('M') - 1 + '', '默认高亮显示当前月');
+
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy-MM'), '确认后输出选中的值');
+      });
+
+      it('is date', function () {
+        var result = laydate.render({
+          elem: '#test-div',
+          type: 'date'
+        });
+        var now = new Date();
+
+        expect(result.config.type).to.equal('date');
+        expect($('.laydate-set-ym').length).to.equal(0);
+
+        $('#test-div').click();
+
+        expect($('.laydate-set-ym').text()).to.equal(dateFormat('yyyy年M月'), '标头内显示当前年+月');
+        expect($('.layui-laydate-content .layui-this').attr('lay-ymd'))
+          .to.equal(dateFormat('yyyy-M-d'), '默认高亮显示当前日');
+
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy-MM-dd'), '确认后输出选中的值');
+      });
+
+      it('is time', function () {
+        var result = laydate.render({
+          elem: '#test-div',
+          type: 'time'
+        });
+
+        expect(result.config.type).to.equal('time');
+        expect($('.laydate-time-text').length).to.equal(0);
+
+        $('#test-div').click();
+
+        expect($('.laydate-time-text').text()).to.equal('选择时间', '标头内显示当前年+月');
+        expect($('.laydate-time-list').length).to.equal(1);
+
+        expect($('#test-div').text()).to.equal('');
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal('00:00:00');
+      });
+
+      it('is datetime', function () {
+        var result = laydate.render({
+          elem: '#test-div',
+          type: 'datetime'
+        });
+        var now = new Date();
+
+        expect(result.config.type).to.equal('datetime');
+        expect($('.laydate-set-ym').length).to.equal(0);
+
+        $('#test-div').click();
+
+        expect($('.laydate-set-ym').text()).to.equal(
+          now.getFullYear() + '年' + (now.getMonth() + 1) + '月',
+          '标头内显示当前年+月'
+        );
+        expect($('.layui-laydate-content .layui-this').attr('lay-ymd')).to.equal(
+          now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate(),
+          '默认高亮显示当前日'
+        );
+        expect($('.laydate-btns-time').text()).to.equal('选择时间');
+        expect($('.laydate-time-text').text()).to.equal('');
+
+        // 断定选择时间的切换
+        $('.laydate-btns-time').click();
+        expect($('.laydate-time-text').text()).to.equal('选择时间');
+        expect($('.laydate-btns-time').text()).to.equal('返回日期');
+        $('.laydate-btns-time').click();
+        expect($('.laydate-time-text').text()).to.equal('');
+        expect($('.laydate-btns-time').text()).to.equal('选择时间');
+
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy-MM-dd 00:00:00'), '确认后输出选中的值');
+      });
+    });
+
+    describe('options.range', function () {
+      it('time type and range', function () {
+        laydate.render({
+          elem: '#test-div',
+          type: 'time',
+          range: true
+        });
+
+        $('#test-div').click();
+        expect($('.laydate-time-text').length).to.equal(2);
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal('00:00:00 - 00:00:00', '确认后输出范围值');
+      });
+
+      it('year type and range is split', function () {
+        laydate.render({
+          elem: '#test-div',
+          type: 'year',
+          range: '到'
+        });
+
+        $('#test-div').click();
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.match(/\d+\s到\s\d+/, '确认后输出范围值');
+      });
+    });
+
+    describe('options.format', function () {
+      it('default value', function () {
+        expect(laydate.render().config.format).to.equal('yyyy-MM-dd');
+        expect(laydate.render({
+          elem: '#test-div'
+        }).config.format).to.equal('yyyy-MM-dd', 'render 方法 options.format 默认值必须是 yyyy-MM-dd');
+      });
+
+      it('yyyy年MM月dd日 HH时mm分ss秒', function () {
+        var result = laydate.render({
+          format: 'yyyy年MM月dd日 HH时mm分ss秒',
+          elem: '#test-div'
+        });
+
+        expect(result.config.format).to.equal('yyyy年MM月dd日 HH时mm分ss秒', '设置 option.format 返回配置内必须相等');
+        $('#test-div').click();
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy年MM月dd日 00时00分00秒'), '确认后输出选中的值');
+      });
+
+      it('datetime type and yyyy年的M月某天晚上，大概H点', function () {
+        laydate.render({
+          format: 'yyyy年的M月某天晚上，大概H点',
+          elem: '#test-div',
+          type: 'datetime'
+        });
+
+        $('#test-div').click();
+        $('.laydate-btns-time').click();
+        $('.laydate-time-list li').eq(0).find('li').eq(5).click();
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy年的M月某天晚上，大概5点'), '确认后输出选中的值');
+      });
+    });
+
+    describe('options.value', function () {
+      it('yyyy-MM-dd', function () {
+        laydate.render({
+          elem: '#test-div',
+          value: '1990年11月27日',
+          format: 'yyyy年MM月dd日'
+        });
+
+        $('#test-div').click();
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal('1990年11月27日', '确认后输出选中的值');
+      });
+
+      it('yyyy-MM-dd not format value', function () {
+        laydate.render({
+          elem: '#test-div',
+          value: '1990-11月-日',
+          format: 'yyyy年MM月dd日'
+        });
+
+        $('#test-div').click();
+
+        // 错误提示
+        expect($('.layui-laydate-hint').text()).to.match(/日期格式不合法/);
+        expect($('.layui-laydate-hint').text()).to.match(/yyyy年MM月dd日/);
+
+        $('.laydate-btns-confirm').click();
+        expect($('#test-div').text()).to.equal(dateFormat('yyyy年MM月dd日'), '确认后输出选中的值');
+      });
+
+      it('number not format value', function () {
+        laydate.render({
+          elem: '#test-div',
+          value: Date.now()
+        });
+
+        $('#test-div').click();
+
+        // 错误提示
+        expect($('.layui-laydate-hint').text()).to.match(/日期格式不合法/);
+      });
+
+      it('div default html value format error', function () {
+        laydate.render({
+          elem: '#test-div',
+          value: Date.now()
+        });
+
+        $('#test-div').text('layui').click();
+
+        // 错误提示
+        expect($('.layui-laydate-hint').text()).to.match(/日期格式不合法/);
+      });
+
+      it('input default value format error', function (done) {
+        createNode('<input id="test-input-2" type="text" value="layui">');
+
+        laydate.render({
+          elem: '#test-input-2'
+        });
+
+        $('#test-input-2').focus();
+
+        // 错误提示
+        setTimeout(function () {
+          expect($('.layui-laydate-hint').text()).to.match(/日期格式不合法/);
+          done();
+        });
+      });
+    });
+  });
+});
+
+/* eslint-enable max-nested-callbacks, fecs-indent */

test/layui.js

@@ -8,6 +8,13 @@
 
 var $ = layui.$;
 
+/**
+ * 是否基于`phantomjs`测试, 因为有些特殊的case在ie中是不可用的, 比如: `window.event = {}`
+ *
+ * @type {boolean}
+ */
+var IS_PHANTOMJS = layui.device('phantomjs').phantomjs;
+
 describe('layui', function () {
   it('version', function () {
     expect(layui.v).to.be.a('string');
@@ -201,12 +208,13 @@ describe('layui', function () {
     //   });
     // });
 
-    it('http 404', function (done) {
+    // 由于没有超时配置, 在部分设备中, dns解析可能超时
-      layui.img('http://www.404.xx/logo.404.gif', function () {}, function (e) {
+    // it('http 404', function (done) {
-        expect(e).to.not.undefined;
+    //   layui.img('http://www.404.xx/logo.404.gif', function () {}, function (e) {
-        done();
+    //     expect(e).to.not.undefined;
-      });
+    //     done();
-    });
+    //   });
+    // });
 
     it('load complete', function (done) {
       layui.img(base64, function () {
@@ -240,14 +248,16 @@ describe('layui', function () {
       expect(event.cancelBubble).to.be.true;
     });
 
-    // ie中不支持
+    // ie中不支持, 只针对phantomjs测试
-    // it('window.event', function () {
+    if (IS_PHANTOMJS) {
-    //   var old = window.event;
+      it('window.event', function () {
-    //   var event = window.event = {};
+        var old = window.event;
-    //   layui.stope();
+        var event = window.event = {};
-    //   expect(event.cancelBubble).to.be.true;
+        layui.stope();
-    //   window.event = old;
+        expect(event.cancelBubble).to.be.true;
-    // });
+        window.event = old;
+      });
+    }
   });
 
   describe('layui.onevent', function () {
@@ -309,7 +319,17 @@ describe('layui', function () {
       expect(index).to.equal(3);
     });
 
-    // todo多个事件
+    it('return value', function () {
+      expect(layui.event('id', 'event')).to.be.null;
+
+      // 只有在返回 false 时, 结果才是 false
+      layui.onevent('test-return-value-1', 'click', function (data) {
+        return data;
+      });
+      expect(layui.event('test-return-value-1', 'click', false)).to.be.false;
+      expect(layui.event('test-return-value-1', 'click', true)).to.be.null;
+      expect(layui.event('test-return-value-1', 'click')).to.be.null;
+    });
   });
 
   describe('layui.sort', function () {
@@ -503,5 +523,81 @@ describe('layui', function () {
     expect(layui.modules[id]).to.equal(id);
     delete layui.modules[id];
   });
+
+  describe('layui.data', function () {
+    if (IS_PHANTOMJS) {
+      it('not support JSON', function () {
+        var old = window.JSON;
+        window.JSON = null;
+        expect(layui.data()).to.be.undefined;
+        window.JSON = {};
+        expect(layui.data()).to.be.undefined;
+        window.JSON = old;
+      });
+    }
+
+    // 在支持情况下才测试
+    if (window.localStorage) {
+      it('delete table data', function() {
+        var id = 'test-delete-data';
+        localStorage[id] = true;
+        expect(localStorage[id]).to.equal('true');
+        expect(layui.data(id, null)).to.be.true;
+        expect(localStorage[id]).to.be.undefined;
+      });
+
+      it('get table data', function () {
+        var table = 'test-get-table-data';
+        expect(layui.data(table)).to.deep.equal({});
+
+        layui.data(table, {
+          key: 'name',
+          value: 'layui'
+        });
+        expect(layui.data(table)).to.deep.equal({
+          name: 'layui'
+        });
+
+        // 删除数据
+        layui.data(table, null);
+      });
+
+      it('get data', function () {
+        var id = 'test-get-data';
+
+        // 直接获取肯定为空
+        expect(layui.data(null, id)).to.be.undefined;
+
+        // 写入数据
+        expect(layui.data(null, {
+          key: id,
+          value: true
+        })).to.be.true;
+
+        expect(layui.data(null, id)).to.be.true;
+
+        // 清除数据
+        layui.data(null, {
+          key: id,
+          remove: true
+        });
+      });
+
+      it('remove data', function () {
+        var id = 'test-remove-data';
+
+        layui.data(null, {
+          key: id,
+          value: true
+        });
+        expect(layui.data(null, id)).to.be.true;
+        layui.data(null, {
+          key: id,
+          remove: true
+        });
+        expect(layui.data(null, id)).to.be.undefined;
+      });
+    }
+  });
 });
 /* eslint-enable max-nested-callbacks, fecs-indent */