feat: 增加switch单侧以及修复rate的bug

packages/mpx-cube-ui/__tests__/components/switch/__snapshots__/switch.spec.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component switch unit test correct render check matchSnapshot 1`] = `"<wx-view class=\\"main--cube-switch main--cube-switch\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test disabled check matchSnapshot 1`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test render check render 1`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test render check render 2`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test render check render 3`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test render check render 4`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test render check render 5`] = `"<wx-view class=\\"main--cube-switch main--cube-switch main--cube-switch-on\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view>"`;
+
+exports[`component switch unit test slot check render correct 1`] = `"<main class=\\"radio-modal\\"><wx-view class=\\"main--cube-switch main--cube-switch\\"><wx-view class=\\"main--cube-switch-handle\\"></wx-view></wx-view></main>"`;
+
+exports[`component switch unit test wx:model check matchSnapshot 1`] = `"<wx-view class=\\"main--switch-default-checked-demo\\"><wx-text>默认值：false</wx-text><cube-switch class=\\"main--cube-switch\\" data-eventconfigs=\\"[object Object]\\"><wx-view class=\\"cube-switch--cube-switch cube-switch--cube-switch\\"><wx-view class=\\"cube-switch--cube-switch-handle\\"></wx-view></wx-view></cube-switch></wx-view>"`;

packages/mpx-cube-ui/__tests__/components/switch/switch.spec.js

@@ -0,0 +1,78 @@
+const simulate = require('@mpxjs/miniprogram-simulate')
+
+describe('component switch unit test', function () {
+  function newComponent(componentId, props) {
+    const component = simulate.render(componentId, props)
+    const parent = document.createElement('parent')
+    component.attach(parent) // 会触发 attach 生命周期
+    return component
+  }
+  describe('wx:model check', () => {
+    const componentId = simulate.loadMpx(
+      'test/components/switch/template/wx-model.mpx'
+    )
+    const component = newComponent(componentId)
+    it('matchSnapshot', () => {
+      expect(component.dom.innerHTML).toMatchSnapshot() // 判断前后生成的dom是否一样
+    })
+    const switchComponent = component.querySelector('.cube-switch')
+    it('wx:model', async () => {
+      // 确保 switchValue 首次显示符合预期
+      expect(component.instance.switchValue).toBe(false)
+      expect(switchComponent.instance.value).toBe(false)
+
+      switchComponent.querySelector('.cube-switch').dispatchEvent('tap')
+      await simulate.sleep(10)
+
+      // 点击开关后，状态改变为打开
+      expect(switchComponent.instance.value).toBe(true)
+      expect(component.instance.switchValue).toBe(true)
+
+      // 改变父组件的值，switch的值也会改变
+      component.instance.switchValue = false
+      await simulate.sleep(10)
+      expect(component.instance.switchValue).toBe(false)
+      expect(switchComponent.instance.value).toBe(false)
+    })
+  })
+
+  const componentId1 = simulate.loadMpx('src/components/switch/index.mpx')
+  describe('correct render check', () => {
+    const component = newComponent(componentId1, {})
+
+    it('matchSnapshot', () => {
+      expect(component.dom.innerHTML).toMatchSnapshot() // 判断前后生成的dom是否一样
+    })
+
+    it('correct render  check', async () => {
+      // 正确渲染
+      const isCloseSwitch = component.querySelector('.cube-switch-on')
+
+      // eslint-disable-next-line eqeqeq
+      expect(component.instance.disabled).toBe(false)
+
+      // eslint-disable-next-line eqeqeq
+      expect(isCloseSwitch === undefined).toBe(true)
+    })
+  })
+
+  describe('disabled check', () => {
+    const component = newComponent(componentId1, {
+      disabled: true
+    })
+    it('matchSnapshot', () => {
+      expect(component.dom.innerHTML).toMatchSnapshot() // 判断前后生成的dom是否一样
+    })
+
+    it('disabled check', async () => {
+      // 正确渲染
+      const isCloseSwitchOne = component.querySelector('.cube-switch-on')
+      expect(isCloseSwitchOne === undefined).toBe(true)
+      component.querySelector('.cube-switch').dispatchEvent('tap')
+      await simulate.sleep(10)
+
+      const isCloseSwitchTwo = component.querySelector('.cube-switch-on')
+      expect(isCloseSwitchTwo === undefined).toBe(true)
+    })
+  })
+})

packages/mpx-cube-ui/__tests__/components/switch/template/wx-model.mpx

@@ -0,0 +1,25 @@
+
+<template>
+  <view class="switch-default-checked-demo">
+    <text>默认值：{{switchValue}}</text>
+    <cube-switch class="cube-switch" wx:model="{{switchValue}}"></cube-switch>
+  </view>
+</template>
+
+<script>
+import { createComponent } from '@mpxjs/core'
+
+createComponent({
+  data: {
+    switchValue: false
+  }
+})
+</script>【
+
+<script type="application/json">
+  {
+    "usingComponents": {
+      "cube-switch": "@mpxjs/mpx-cube-ui/src/components/switch/index.mpx"
+    }
+  }
+</script>