diff --git a/src/grid/test/__snapshots__/index.legacy.js.snap b/src/grid/test/__snapshots__/index.legacy.js.snap
deleted file mode 100644
index 1387be1b9..000000000
--- a/src/grid/test/__snapshots__/index.legacy.js.snap
+++ /dev/null
@@ -1,37 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`icon-size prop 1`] = `
-<div class="van-grid van-hairline--top">
-  <div class="van-grid-item" style="flex-basis: 25%;">
-    <div class="van-grid-item__content van-grid-item__content--center van-hairline"><i class="van-icon van-icon-success van-grid-item__icon" style="font-size: 10px;">
-        <!----></i></div>
-  </div>
-</div>
-`;
-
-exports[`render icon-slot 1`] = `
-<div class="van-grid van-hairline--top">
-  <div class="van-grid-item" style="flex-basis: 25%;">
-    <div class="van-grid-item__content van-grid-item__content--center van-hairline">
-      <div class="van-grid-item__icon-wrapper">
-        <div>Custom Icon</div>
-        <div class="van-badge">1</div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`sqaure and set gutter 1`] = `
-<div class="van-grid" style="padding-left: 10rem;">
-  <div class="van-grid-item van-grid-item--square" style="flex-basis: 50%; padding-top: 50%;">
-    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline" style="right: 10rem; bottom: 10rem; height: auto;"></div>
-  </div>
-  <div class="van-grid-item van-grid-item--square" style="flex-basis: 50%; padding-top: 50%;">
-    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline" style="right: 10rem; bottom: 10rem; height: auto;"></div>
-  </div>
-  <div class="van-grid-item van-grid-item--square" style="flex-basis: 50%; padding-top: 50%;">
-    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline" style="right: 10rem; bottom: 10rem; height: auto;"></div>
-  </div>
-</div>
-`;
diff --git a/src/grid/test/__snapshots__/index.spec.js.snap b/src/grid/test/__snapshots__/index.spec.js.snap
new file mode 100644
index 000000000..e24978336
--- /dev/null
+++ b/src/grid/test/__snapshots__/index.spec.js.snap
@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render icon-slot correctly 1`] = `
+<div class="van-grid van-hairline--top">
+  <div class="van-grid-item"
+       style="flex-basis: 25%;"
+  >
+    <div class="van-grid-item__content van-grid-item__content--center van-hairline">
+      <div class="van-badge__wrapper">
+        Custom Icon
+        <div class="van-badge van-badge--fixed">
+          1
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`should render square grid with gutter correctly 1`] = `
+<div style="padding-left: 10rem;"
+     class="van-grid"
+>
+  <div class="van-grid-item van-grid-item--square"
+       style="flex-basis: 50%; padding-top: 50%;"
+  >
+    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline"
+         style="right: 10rem; bottom: 10rem; height: auto;"
+    >
+    </div>
+  </div>
+  <div class="van-grid-item van-grid-item--square"
+       style="flex-basis: 50%; padding-top: 50%;"
+  >
+    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline"
+         style="right: 10rem; bottom: 10rem; height: auto;"
+    >
+    </div>
+  </div>
+  <div class="van-grid-item van-grid-item--square"
+       style="flex-basis: 50%; padding-top: 50%;"
+  >
+    <div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--square van-grid-item__content--surround van-hairline"
+         style="right: 10rem; bottom: 10rem; height: auto;"
+    >
+    </div>
+  </div>
+</div>
+`;
diff --git a/src/grid/test/index.legacy.js b/src/grid/test/index.legacy.js
deleted file mode 100644
index 79eb1b7d2..000000000
--- a/src/grid/test/index.legacy.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import { mount } from '@vue/test-utils';
-
-test('click grid item', () => {
-  const onClick = jest.fn();
-  const wrapper = mount({
-    template: `
-      <van-grid>
-        <van-grid-item @click="onClick" />
-      </van-grid>
-    `,
-    methods: {
-      onClick,
-    },
-  });
-
-  const Item = wrapper.find('.van-grid-item__content');
-  Item.trigger('click');
-
-  expect(onClick).toHaveBeenCalledTimes(1);
-});
-
-test('sqaure and set gutter', () => {
-  const wrapper = mount({
-    template: `
-      <van-grid square :column-num="2" gutter="10rem">
-        <van-grid-item />
-        <van-grid-item />
-        <van-grid-item />
-      </van-grid>
-    `,
-  });
-
-  expect(wrapper.html()).toMatchSnapshot();
-});
-
-test('icon-size prop', () => {
-  const wrapper = mount({
-    template: `
-      <van-grid icon-size="10">
-        <van-grid-item icon="success" />
-      </van-grid>
-    `,
-  });
-
-  expect(wrapper.html()).toMatchSnapshot();
-});
-
-test('render icon-slot', () => {
-  const wrapper = mount({
-    template: `
-      <van-grid icon-size="10">
-        <van-grid-item badge="1">
-          <template #icon>
-            <div>Custom Icon</div>
-          </template>
-        </van-grid-item>
-      </van-grid>
-    `,
-  });
-
-  expect(wrapper.html()).toMatchSnapshot();
-});
diff --git a/src/grid/test/index.spec.js b/src/grid/test/index.spec.js
new file mode 100644
index 000000000..7506c3b78
--- /dev/null
+++ b/src/grid/test/index.spec.js
@@ -0,0 +1,49 @@
+import { mount } from '@vue/test-utils';
+import Grid from '..';
+import GridItem from '../../grid-item';
+
+test('should render square grid with gutter correctly', () => {
+  const wrapper = mount({
+    render() {
+      return (
+        <Grid square columnNum="2" gutter="10rem">
+          <GridItem />
+          <GridItem />
+          <GridItem />
+        </Grid>
+      );
+    },
+  });
+
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('should change icon size when using icon-size prop', () => {
+  const wrapper = mount({
+    render() {
+      return (
+        <Grid icon-size="10">
+          <GridItem icon="success" />
+        </Grid>
+      );
+    },
+  });
+
+  expect(wrapper.find('.van-grid-item__icon').element.style.fontSize).toEqual(
+    '10px'
+  );
+});
+
+test('should render icon-slot correctly', () => {
+  const wrapper = mount({
+    render() {
+      return (
+        <Grid>
+          <GridItem badge="1" v-slots={{ icon: () => 'Custom Icon' }} />
+        </Grid>
+      );
+    },
+  });
+
+  expect(wrapper.html()).toMatchSnapshot();
+});
diff --git a/test/demo.ts b/test/demo.ts
index d65960621..98f545f9f 100644
--- a/test/demo.ts
+++ b/test/demo.ts
@@ -8,7 +8,7 @@ Locale.use('en-US', enUS);
 
 const EmptyComponent = {
   render() {
-    return h('div', [(this as any).$slots.default()]);
+    return h('div', [this.$slots.default()]);
   },
   inheritAttrs: false,
 };
@@ -28,7 +28,6 @@ export function snapshotDemo(Demo: any, option: any = {}) {
         mixins: [DemoLocaleMixin],
         components: {
           'demo-block': EmptyComponent,
-          'demo-section': EmptyComponent,
         },
         plugins: [(window as any).vant],
       },