|
|
@@ -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);
|
|
|
});
|
|
|
});
|
|
|
});
|