feat: Overlay component

src-next/overlay/test/demo.spec.js

@@ -0,0 +1,4 @@
+import Demo from '../demo';
+import { snapshotDemo } from '../../../test/demo';
+
+snapshotDemo(Demo);

src-next/overlay/test/index.spec.js

@@ -0,0 +1,98 @@
+import { mount } from '../../../test';
+import Overlay from '..';
+
+test('z-index prop', () => {
+  const wrapper = mount(Overlay, {
+    propsData: {
+      show: true,
+      zIndex: 99,
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('class-name prop', () => {
+  const wrapper = mount(Overlay, {
+    propsData: {
+      show: true,
+      className: 'my-overlay',
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('custom style prop', () => {
+  const wrapper = mount(Overlay, {
+    propsData: {
+      show: true,
+      customStyle: {
+        backgroundColor: 'red',
+      },
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('duration prop', () => {
+  const wrapper = mount(Overlay, {
+    propsData: {
+      show: true,
+      duration: 1,
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('click event', () => {
+  const onClick = jest.fn();
+  const wrapper = mount(Overlay, {
+    context: {
+      on: {
+        click: onClick,
+      },
+    },
+  });
+
+  wrapper.trigger('click');
+  expect(onClick).toHaveBeenCalledTimes(1);
+});
+
+test('default slot', () => {
+  const wrapper = mount(Overlay, {
+    scopedSlots: {
+      default: () => 'Custom Default',
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('lock-scroll prop', () => {
+  const onTouchMove = jest.fn();
+  const wrapper = mount({
+    template: `
+      <div @touchmove="onTouchMove">
+        <van-overlay :lock-scroll="lockScroll" />
+      </div>
+    `,
+    data() {
+      return {
+        lockScroll: true,
+      };
+    },
+    methods: {
+      onTouchMove,
+    },
+  });
+
+  wrapper.find('.van-overlay').trigger('touchmove');
+  expect(onTouchMove).toHaveBeenCalledTimes(0);
+
+  wrapper.setData({ lockScroll: false });
+  wrapper.find('.van-overlay').trigger('touchmove');
+  expect(onTouchMove).toHaveBeenCalledTimes(1);
+});