Browse Source

Merge branch 'v2' of https://github.com/jdf2e/nutui into v2

yangxiaolu3 5 years ago
parent
commit
3eec9bd773
2 changed files with 163 additions and 97 deletions
  1. 5 2
      src/packages/tab/tab.vue
  2. 158 95
      src/packages/tabselect/__test__/tabselect.spec.js

+ 5 - 2
src/packages/tab/tab.vue

@@ -201,10 +201,13 @@ export default {
             
         },
         getStyle:function(obj,styleName){
+            if(!obj){
+                return ''
+            }
             if(obj.currentStyle){
-            return obj.currentStyle[styleName];
+                return obj.currentStyle[styleName];
             }else{
-            return getComputedStyle(obj,null)[styleName];
+                return getComputedStyle(obj,null)[styleName];
             }
         },
         getTabWidth:function(){

+ 158 - 95
src/packages/tabselect/__test__/tabselect.spec.js

@@ -3,127 +3,190 @@ import TabSelect from "../tabselect.vue";
 import Vue from "vue";
 
 describe("TabSelect.vue", () => {
-  const wrapper = mount(TabSelect);
+  const wrapper = mount(TabSelect, {
+    propsData: {
+      mainTitle: "配送测试",
+      subTitle: "送达时间测试",
+      defaultContent: [
+        "9:00——10:00",
+        "10:00——11:00",
+        "11:00——12:00",
+        "12:00——13:00",
+        "13:00——15:00",
+        "15:00——17:00",
+        "17:00——19:00"
+      ],
+      tabList: [
+        {
+          tabTitle: "京东快递测试",
+          children: [
+            {
+              tabTitle: "1月13日 (星期一)",
+              content: [
+                "11:00——12:00",
+                "12:00——13:00",
+                "13:00——15:00",
+                "15:00——17:00",
+                "17:00——19:00"
+              ]
+            },
+            {
+              tabTitle: "1月14日 (星期二)"
+            },
+            {
+              tabTitle: "1月15日 (星期三)"
+            },
+            {
+              tabTitle: "1月16日 (星期四)"
+            },
+            {
+              tabTitle: "1月17日 (星期五)"
+            },
+            {
+              tabTitle: "1月18日 (星期六)"
+            },
+            {
+              tabTitle: "1月19日 (星期天)"
+            }
+          ]
+        },
+        {
+          tabTitle: "上门自提",
+          children: [
+            {
+              tabTitle: "2月13日 (星期一)",
+              content: ["13:00——15:00", "15:00——17:00", "17:00——19:00"]
+            },
+            {
+              tabTitle: "2月14日 (星期二)"
+            },
+            {
+              tabTitle: "2月15日 (星期三)"
+            },
+            {
+              tabTitle: "2月16日 (星期四)"
+            },
+            {
+              tabTitle: "2月17日 (星期五)"
+            },
+            {
+              tabTitle: "2月18日 (星期六)"
+            },
+            {
+              tabTitle: "2月19日 (星期天)"
+            }
+          ]
+        }
+      ],
+      show: true,
+      multiple: false,
+      isDefaultSelected: false,
+      max: 2
+    }
+  });
 
   it("mainTitle标题", () => {
-    wrapper.setProps({ mainTitle: "配送" });
     return Vue.nextTick().then(function() {
-      setTimeout(() => {
-        expect(
-          wrapper
-            .findAll(".nut-tabselect-main-title")
-            .at(0)
-            .text()
-        ).toBe("配送");
-      }, 200);
+      expect(
+        wrapper
+          .findAll(".nut-tabselect-main-title")
+          .at(0)
+          .text()
+      ).toBe("配送测试");
     });
   });
 
   it("subTitle标题", () => {
-    wrapper.setProps({ subTitle: "送达时间" });
     return Vue.nextTick().then(function() {
-      setTimeout(() => {
-        expect(
-          wrapper
-            .findAll(".nut-tabselect-sub-title")
-            .at(0)
-            .text()
-        ).toBe("送达时间");
-      }, 200);
+      expect(
+        wrapper
+          .findAll(".nut-tabselect-sub-title")
+          .at(0)
+          .text()
+      ).toBe("送达时间测试");
+      //   expect(wrapper.html()).toContain(
+      //     '<div class="nut-tabselect-main-title">送达时间测试</div>'
+      //   );
     });
   });
 
-  it("是否支持多选", () => {
-    wrapper.setProps({ multiple: true });
+  it("defaultContent默认内容", () => {
     return Vue.nextTick().then(function() {
-      setTimeout(() => {
+      expect(
         wrapper
           .findAll(".nut-tab-panel-list")
-          .at(1)
-          .trigger("click");
-        wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(2)
-          .trigger("click");
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(1)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(true);
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(2)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(true);
-      }, 200);
+          .at(0)
+          .text()
+      ).toBe("11:00——12:00");
     });
   });
 
   it("是否支持单选", () => {
-    wrapper.setProps({ multiple: false });
+    wrapper
+      .findAll(".nut-tab-panel-list")
+      .at(1)
+      .trigger("click");
+    wrapper
+      .findAll(".nut-tab-panel-list")
+      .at(2)
+      .trigger("click");
     return Vue.nextTick().then(function() {
-      setTimeout(() => {
-        wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(1)
-          .trigger("click");
-        wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(2)
-          .trigger("click");
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(1)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(false);
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(2)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(true);
-      }, 200);
+      expect(wrapper.findAll(".nut-tab-panel-list-active").length).toBe(1);
+    });
+  });
+
+  it("是否支持多选", () => {
+    wrapper.setProps({ multiple: true });
+    wrapper
+      .findAll(".nut-tab-panel-list")
+      .at(1)
+      .trigger("click");
+    return Vue.nextTick().then(function() {
+      expect(wrapper.findAll(".nut-tab-panel-list-active").length).toBe(2);
     });
   });
 
   it("设置max", () => {
-    wrapper.setProps({ max: 2, multiple: true });
+    wrapper
+      .findAll(".nut-tab-panel-list")
+      .at(3)
+      .trigger("click");
+    wrapper
+      .findAll(".nut-tab-panel-list")
+      .at(4)
+      .trigger("click");
     return Vue.nextTick().then(function() {
-      setTimeout(() => {
-        wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(1)
-          .trigger("click");
+      expect(wrapper.findAll(".nut-tab-panel-list-active").length).toBe(2);
+    });
+  });
+
+  it("tabList整体数据", () => {
+    return Vue.nextTick().then(function() {
+      expect(
         wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(2)
-          .trigger("click");
+          .findAll(".nut-tab-link")
+          .at(0)
+          .text()
+      ).toBe("京东快递测试");
+    });
+  });
+
+  it("设置show", () => {
+    wrapper.setProps({ show: true });
+    return Vue.nextTick().then(function() {
+      expect(
         wrapper
-          .findAll(".nut-tab-panel-list")
-          .at(3)
-          .trigger("click");
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(1)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(true);
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(2)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(true);
-        expect(
-          wrapper
-            .findAll(".nut-tab-panel-list")
-            .at(3)
-            .is(".nut-tab-panel-list-active")
-        ).toBe(false);
-      }, 200);
+          .findAll(".popup-box")
+          .at(0)
+          .attributes("display")
+      ).toBe(undefined);
+    });
+  });
+
+  it("设置isDefaultSelected", () => {
+    wrapper.setProps({ isDefaultSelected: true });
+    return Vue.nextTick().then(function() {
+      expect(wrapper.contains(".nut-tab-panel-list-active")).toBe(true);
     });
   });
 });