test(Sidebar): update test cases

src/sidebar/test/index.spec.js

@@ -0,0 +1,106 @@
+import { ref } from 'vue';
+import { mount } from '@vue/test-utils';
+import Sidebar from '..';
+import SidebarItem from '../../sidebar-item';
+
+test('should emit change event when active item changed', () => {
+  const onChange = jest.fn();
+  const wrapper = mount({
+    render() {
+      return (
+        <Sidebar onChange={onChange}>
+          <SidebarItem>Text</SidebarItem>
+          <SidebarItem>Text</SidebarItem>
+        </Sidebar>
+      );
+    },
+  });
+
+  const items = wrapper.findAll('.van-sidebar-item');
+
+  items[0].trigger('click');
+  expect(onChange).toHaveBeenCalledTimes(0);
+
+  items[1].trigger('click');
+  expect(onChange).toHaveBeenCalledWith(1);
+});
+
+test('should emit click event when SidebarItem is clicked', () => {
+  const onClick = jest.fn();
+  const wrapper = mount({
+    render() {
+      return (
+        <Sidebar>
+          <SidebarItem onClick={onClick}>Text</SidebarItem>
+        </Sidebar>
+      );
+    },
+  });
+
+  wrapper.find('.van-sidebar-item').trigger('click');
+  expect(onClick).toHaveBeenCalledWith(0);
+});
+
+test('should update v-model when active item changed', () => {
+  const onChange = jest.fn();
+  const wrapper = mount({
+    setup() {
+      return {
+        active: ref(0),
+      };
+    },
+    render() {
+      return (
+        <Sidebar v-model={this.active} onChange={onChange}>
+          <SidebarItem>Text</SidebarItem>
+          <SidebarItem>Text</SidebarItem>
+        </Sidebar>
+      );
+    },
+  });
+
+  wrapper.findAll('.van-sidebar-item')[1].trigger('click');
+  expect(wrapper.vm.active).toEqual(1);
+  expect(onChange).toHaveBeenCalledWith(1);
+  expect(onChange).toHaveBeenCalledTimes(1);
+});
+
+test('should not update v-model when disabled SidebarItem is clicked', () => {
+  const wrapper = mount({
+    setup() {
+      return {
+        active: ref(0),
+      };
+    },
+    render() {
+      return (
+        <Sidebar v-model={this.active}>
+          <SidebarItem>Text</SidebarItem>
+          <SidebarItem disabled>Text</SidebarItem>
+        </Sidebar>
+      );
+    },
+  });
+
+  wrapper.findAll('.van-sidebar-item')[1].trigger('click');
+  expect(wrapper.vm.active).toEqual(0);
+});
+
+test('should render title slot correctly', () => {
+  const wrapper = mount({
+    setup() {
+      return {
+        active: ref(0),
+      };
+    },
+    render() {
+      return (
+        <Sidebar v-model={this.active}>
+          <SidebarItem v-slots={{ title: () => 'Custom Title' }} />
+        </Sidebar>
+      );
+    },
+  });
+
+  expect(wrapper.html()).toMatchSnapshot();
+});