index.vue 顶部tab切换 - MTTTM/vue-keyboard-cn GitHub Wiki

cn 类型

  • preset
     let data={
     allowEnter: false,
     canSwitchOtherBoard: true,
     inputId: "input-id-1622138235034-eeb5a538-14cd-0130-ca16-dcf78398f65c",
     isFocus: true,
     showZh: true,
     tmpValueNoFlash: "4w000000000102",
     type: "cn",
}
 this.$root.$on(EventKeys["vue-keyboard-cn-focus"],data)

test 1:(第一个tab是否高亮)

  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[0].classList.contains("active")
  • return

test 2:(表情tab是否可以点击，默认否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].classList.contains("active")

test 3:(表情键盘是否可以切换，否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".emoji-wrap").length==1
  • return false

test 3:(控制面板键盘是否可以切换，是)

  • preset
 await  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[2].trigger("click");
  • test
  document.querySelectorAll(".operation-wrap-left-pancel").length==1
  • return true

int 类型 （测试目的和测试结果和cn类型)

  • preset
     let data={
     allowEnter: false,
     canSwitchOtherBoard: true,
     inputId: "input-id-1622138235034-eeb5a538-14cd-0130-ca16-dcf78398f65c",
     isFocus: true,
     showZh: true,
     tmpValueNoFlash: "4w000000000102",
     type: "int",
}
 this.$root.$on(EventKeys["vue-keyboard-cn-focus"],data)

test 1:(第一个tab是否高亮)

  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[0].classList.contains("active")
  • return

test 2:(表情tab是否可以点击，默认否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].classList.contains("active")

test 3:(表情键盘是否可以切换，否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".emoji-wrap").length==1
  • return false

test 3:(控制面板键盘是否可以切换，是)

  • preset
 await  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[2].trigger("click");
  • test
  document.querySelectorAll(".operation-wrap-left-pancel").length==1
  • return true

float 类型 （测试目的和测试结果和cn类型)

  • preset
     let data={
     allowEnter: false,
     canSwitchOtherBoard: true,
     inputId: "input-id-1622138235034-eeb5a538-14cd-0130-ca16-dcf78398f65c",
     isFocus: true,
     showZh: true,
     tmpValueNoFlash: "4w000000000102",
     type: "float",
}
 this.$root.$on(EventKeys["vue-keyboard-cn-focus"],data)

test 1:(第一个tab是否高亮)

  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[0].classList.contains("active")
  • return

test 2:(表情tab是否可以点击，默认否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].classList.contains("active")

test 3:(表情键盘是否可以切换，否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".emoji-wrap").length==1
  • return false

test 3:(控制面板键盘是否可以切换，是)

  • preset
 await  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[2].trigger("click");
  • test
  document.querySelectorAll(".operation-wrap-left-pancel").length==1
  • return true

en 类型 （测试目的和测试结果和cn类型)

  • preset
     let data={
     allowEnter: false,
     canSwitchOtherBoard: true,
     inputId: "input-id-1622138235034-eeb5a538-14cd-0130-ca16-dcf78398f65c",
     isFocus: true,
     showZh: true,
     tmpValueNoFlash: "4w000000000102",
     type: "en",
}
 this.$root.$on(EventKeys["vue-keyboard-cn-focus"],data)

test 1:(第一个tab是否高亮)

  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[0].classList.contains("active")
  • return

test 2:(表情tab是否可以点击，默认否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].classList.contains("active")

test 3:(表情键盘是否可以切换，否)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".emoji-wrap").length==1
  • return false

test 3:(控制面板键盘是否可以切换，是)

  • preset
 await  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[2].trigger("click");
  • test
  document.querySelectorAll(".operation-wrap-left-pancel").length==1
  • return true

mix 类型 （测试目的和测试结果和cn类型)

  • preset
     let data={
     allowEnter: false,
     canSwitchOtherBoard: true,
     inputId: "input-id-1622138235034-eeb5a538-14cd-0130-ca16-dcf78398f65c",
     isFocus: true,
     showZh: true,
     tmpValueNoFlash: "4w000000000102",
     type: "mix",
}
 this.$root.$on(EventKeys["vue-keyboard-cn-focus"],data)

test 1:(第一个tab是否高亮)

  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[0].classList.contains("active")
  • return

test 2:(表情tab是否可以点击，可以)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].classList.contains("active")

test 3:(表情键盘是否可以切换，可以)

  • preset
  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[1].trigger("click");
  • test
  document.querySelectorAll(".emoji-wrap").length==1
  • return false

test 3:(控制面板键盘是否可以切换，是)

  • preset
 await  document.querySelectorAll(".key-board-box-head-op .head-op-icon")[2].trigger("click");
  • test
  document.querySelectorAll(".operation-wrap-left-pancel").length==1
  • return true