diff --git a/src/radio-group/test/index.spec.tsx b/src/radio-group/test/index.spec.tsx
new file mode 100644
index 000000000..f8c73d010
--- /dev/null
+++ b/src/radio-group/test/index.spec.tsx
@@ -0,0 +1,115 @@
+import { ref } from 'vue';
+import { mount } from '../../../test';
+import RadioGroup from '../index';
+import Radio from '../../radio';
+
+test('should emit "update:modelValue" and "change" event when radio is clicked', async () => {
+  const wrapper = mount({
+    emits: ['change'],
+    setup(props, { emit }) {
+      return {
+        result: ref('a'),
+        list: ['a', 'b', 'c', 'd'],
+        emit,
+        change(value: string) {
+          emit('change', value);
+        },
+      };
+    },
+    render() {
+      return (
+        <RadioGroup
+          onChange={(value) => this.emit('change', value)}
+          v-model={this.result}
+        >
+          {this.list.map((item) => (
+            <Radio key={item} name={item} disabled={item === 'd'}>
+              {item}
+            </Radio>
+          ))}
+        </RadioGroup>
+      );
+    },
+  });
+
+  const icons = wrapper.findAll('.van-radio__icon');
+  const labels = wrapper.findAll('.van-radio__label');
+
+  await icons[2].trigger('click');
+  expect(wrapper.vm.result).toEqual('c');
+  expect(wrapper.emitted('change')[0]).toEqual(['c']);
+
+  await labels[1].trigger('click');
+  expect(wrapper.vm.result).toEqual('b');
+  expect(wrapper.emitted('change')[1]).toEqual(['b']);
+
+  await icons[3].trigger('click');
+  await labels[3].trigger('click');
+  expect(wrapper.vm.result).toEqual('b');
+});
+
+test('should not emit "change" event when radio group is disabled and radio is clicked', async () => {
+  const wrapper = mount({
+    emits: ['change'],
+    setup(props, { emit }) {
+      return {
+        result: ref('a'),
+        list: ['a', 'b', 'c', 'd'],
+        emit,
+      };
+    },
+    render() {
+      return (
+        <RadioGroup
+          v-model={this.result}
+          disabled
+          onChange={(value) => this.emit('change', value)}
+        >
+          {this.list.map((item) => (
+            <Radio key={item} name={item}>
+              label
+            </Radio>
+          ))}
+        </RadioGroup>
+      );
+    },
+  });
+
+  const icons = wrapper.findAll('.van-radio__icon');
+  await icons[2].trigger('click');
+  expect(wrapper.emitted('change')).toBeFalsy();
+});
+
+test('should change icon size when using icon-size prop', () => {
+  const wrapper = mount({
+    render() {
+      return (
+        <RadioGroup iconSize="10rem">
+          <Radio />
+          <Radio iconSize="5rem" />
+        </RadioGroup>
+      );
+    },
+  });
+
+  const icons = wrapper.findAll('.van-radio__icon');
+  expect(icons[0].style.fontSize).toEqual('10rem');
+  expect(icons[1].style.fontSize).toEqual('5rem');
+});
+
+test('should change checked color when using checked-color prop', () => {
+  const wrapper = mount({
+    render() {
+      return (
+        <RadioGroup checkedColor="black">
+          <Radio modelValue={true} />
+          <Radio modelValue={true} checkedColor="white" />
+        </RadioGroup>
+      );
+    },
+  });
+
+  const icons = wrapper.findAll('.van-icon');
+  expect(icons[0].style.backgroundColor).toEqual('black');
+  expect(icons[1].style.backgroundColor).toEqual('white');
+});
diff --git a/src/radio/test/__snapshots__/index.legacy.js.snap b/src/radio/test/__snapshots__/index.legacy.js.snap
deleted file mode 100644
index 1b989092a..000000000
--- a/src/radio/test/__snapshots__/index.legacy.js.snap
+++ /dev/null
@@ -1,27 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`checked-color prop 1`] = `
-<div role="radiogroup" class="van-radio-group">
-  <div role="radio" tabindex="0" aria-checked="true" class="van-radio">
-    <div class="van-radio__icon van-radio__icon--round van-radio__icon--checked"><i class="van-icon van-icon-success" style="border-color: black; background-color: black;">
-        <!----></i></div><span class="van-radio__label">label</span>
-  </div>
-  <div role="radio" tabindex="0" aria-checked="true" class="van-radio">
-    <div class="van-radio__icon van-radio__icon--round van-radio__icon--checked"><i class="van-icon van-icon-success" style="border-color: white; background-color: white;">
-        <!----></i></div><span class="van-radio__label">label</span>
-  </div>
-</div>
-`;
-
-exports[`icon-size prop 1`] = `
-<div role="radiogroup" class="van-radio-group">
-  <div role="radio" tabindex="0" aria-checked="true" class="van-radio">
-    <div class="van-radio__icon van-radio__icon--round van-radio__icon--checked" style="font-size: 10rem;"><i class="van-icon van-icon-success">
-        <!----></i></div><span class="van-radio__label">label</span>
-  </div>
-  <div role="radio" tabindex="0" aria-checked="true" class="van-radio">
-    <div class="van-radio__icon van-radio__icon--round van-radio__icon--checked" style="font-size: 5rem;"><i class="van-icon van-icon-success">
-        <!----></i></div><span class="van-radio__label">label</span>
-  </div>
-</div>
-`;
diff --git a/src/radio/test/index.legacy.js b/src/radio/test/index.legacy.js
deleted file mode 100644
index 05506f806..000000000
--- a/src/radio/test/index.legacy.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import { mount } from '../../../test';
-
-test('radio-group change', () => {
-  const wrapper = mount({
-    template: `
-      <van-radio-group v-model="result" @change="$emit('change', $event)">
-        <van-radio
-          v-for="item in list"
-          :key="item"
-          :name="item"
-          :disabled="item === 'd'"
-        >
-          label
-        </van-radio>
-      </van-radio-group>
-    `,
-    data() {
-      return {
-        result: 'a',
-        list: ['a', 'b', 'c', 'd'],
-      };
-    },
-  });
-
-  const icons = wrapper.findAll('.van-radio__icon');
-  const labels = wrapper.findAll('.van-radio__label');
-
-  icons[2].trigger('click');
-  expect(wrapper.vm.result).toEqual('c');
-  expect(wrapper.emitted('change')[0][0]).toEqual('c');
-
-  labels[1].trigger('click');
-  expect(wrapper.vm.result).toEqual('b');
-  expect(wrapper.emitted('change')[1][0]).toEqual('b');
-
-  icons[3].trigger('click');
-  labels[3].trigger('click');
-  expect(wrapper.vm.result).toEqual('b');
-});
-
-test('radio group disabled', () => {
-  const wrapper = mount({
-    template: `
-      <van-radio-group v-model="result" disabled @change="$emit('change', $event)">
-        <van-radio
-          v-for="item in list"
-          :key="item"
-          :name="item"
-        >
-          label
-        </van-radio>
-      </van-radio-group>
-    `,
-    data() {
-      return {
-        result: 'a',
-        list: ['a', 'b', 'c', 'd'],
-      };
-    },
-  });
-
-  const icons = wrapper.findAll('.van-radio__icon');
-  icons[2].trigger('click');
-
-  expect(wrapper.emitted('change')).toBeFalsy();
-});
-
-test('icon-size prop', () => {
-  const wrapper = mount({
-    template: `
-      <van-radio-group icon-size="10rem">
-        <van-radio>label</van-radio>
-        <van-radio icon-size="5rem">label</van-radio>
-      </van-radio-group>
-    `,
-  });
-
-  expect(wrapper.html()).toMatchSnapshot();
-});
-
-test('checked-color prop', () => {
-  const wrapper = mount({
-    template: `
-      <van-radio-group checked-color="black">
-        <van-radio :value="true">label</van-radio>
-        <van-radio :value="true" checked-color="white">label</van-radio>
-      </van-radio-group>
-    `,
-  });
-
-  expect(wrapper.html()).toMatchSnapshot();
-});
diff --git a/src/radio/test/index.spec.ts b/src/radio/test/index.spec.ts
new file mode 100644
index 000000000..4331d527f
--- /dev/null
+++ b/src/radio/test/index.spec.ts
@@ -0,0 +1,89 @@
+import Radio from '..';
+import { mount } from '../../../test';
+
+test('should emit "update:modelValue" event when radio icon or label is clicked', async () => {
+  const props = { name: 'a' };
+  const wrapper = mount(Radio, {
+    props,
+    slots: {
+      default: () => 'Label',
+    },
+  });
+
+  const icon = wrapper.find('.van-radio__icon');
+  const label = wrapper.find('.van-radio__label');
+  icon.trigger('click');
+  expect(wrapper.emitted('update:modelValue')[0]).toEqual([props.name]);
+
+  label.trigger('click');
+  expect(wrapper.emitted('update:modelValue')[0]).toEqual([props.name]);
+});
+
+test('should not emit "update:modelValue" event when radio icon is disabled and clicked', () => {
+  const wrapper = mount(Radio, {
+    props: {
+      disabled: true,
+    },
+  });
+
+  wrapper.find('.van-radio__icon').trigger('click');
+  expect(wrapper.emitted('update:modelValue')).toBeFalsy();
+});
+
+test('should render "van-radio--label-disabled" class when using label-disabled prop', () => {
+  const wrapper = mount(Radio, {
+    props: {
+      labelDisabled: true,
+    },
+    slots: {
+      default: () => 'Label',
+    },
+  });
+
+  expect(wrapper.classes()).toContain('van-radio--label-disabled');
+});
+
+test('should not emit "update:modelValue" event when label is disabled and clicked', () => {
+  const wrapper = mount(Radio, {
+    props: {
+      labelDisabled: true,
+    },
+    slots: {
+      default: () => 'Label',
+    },
+  });
+
+  const label = wrapper.find('.van-radio__label');
+  label.trigger('click');
+  expect(wrapper.emitted('update:modelValue')).toBeFalsy();
+});
+
+test('should adjust label position when using label-position prop', () => {
+  const wrapper = mount(Radio, {
+    props: {
+      labelPosition: 'left',
+    },
+    slots: {
+      default: () => 'Label',
+    },
+  });
+
+  const label = wrapper.find('.van-radio__label');
+  expect(label.classes()).toContain('van-radio__label--left');
+});
+
+test('should emit click event when radio icon is clicked', async () => {
+  const onClick = jest.fn();
+  const wrapper = mount(Radio, {
+    props: {
+      onClick,
+    },
+  });
+
+  wrapper.trigger('click');
+  expect(onClick).toHaveBeenCalledTimes(1);
+
+  const icon = wrapper.find('.van-radio__icon');
+  icon.trigger('click');
+  expect(onClick).toHaveBeenCalledTimes(2);
+});