[bugfix] Switch: incorrect activeColor when use activeValue

packages/switch/index.tsx

@@ -21,14 +21,16 @@ function Switch(
 ) {
   const { value, loading, disabled, activeValue, inactiveValue } = props;
 
+  const checked = value === activeValue;
+
   const style = {
     fontSize: props.size,
-    backgroundColor: value ? props.activeColor : props.inactiveColor
+    backgroundColor: checked ? props.activeColor : props.inactiveColor
   };
 
   const onClick = () => {
     if (!disabled && !loading) {
-      const newValue = value === activeValue ? inactiveValue : activeValue;
+      const newValue = checked ? inactiveValue : activeValue;
       emit(ctx, 'input', newValue);
       emit(ctx, 'change', newValue);
     }
@@ -37,7 +39,7 @@ function Switch(
   return (
     <div
       class={bem({
-        on: value === activeValue,
+        on: checked,
         disabled
       })}
       style={style}

packages/switch/test/__snapshots__/index.spec.js.snap

@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`inactive-color prop 1`] = `
+<div class="van-switch" style="font-size: 30px; background-color: black;">
+  <div class="van-switch__node"></div>
+</div>
+`;

packages/switch/test/index.spec.js

@@ -37,3 +37,38 @@ test('disabled', () => {
   expect(input).toHaveBeenCalledTimes(0);
   expect(change).toHaveBeenCalledTimes(0);
 });
+
+test('active-value & inactive-value prop', () => {
+  const input = jest.fn();
+  const change = jest.fn();
+  const wrapper = mount(Switch, {
+    propsData: {
+      value: '1',
+      activeValue: '1',
+      inactiveValue: '2'
+    },
+    context: {
+      on: {
+        input,
+        change
+      }
+    }
+  });
+
+  wrapper.trigger('click');
+
+  expect(input).toHaveBeenCalledWith('2');
+  expect(change).toHaveBeenCalledWith('2');
+});
+
+test('inactive-color prop', () => {
+  const wrapper = mount(Switch, {
+    propsData: {
+      value: '2',
+      inactiveValue: '2',
+      inactiveColor: 'black'
+    }
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});