From a29ddf3fad28081949582e5dacce0c904cf24297 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Thu, 13 Feb 2020 20:11:57 +0800
Subject: [PATCH] test(Form): add test cases of methods

---
 .../test/__snapshots__/methods.spec.js.snap   | 17 +++++
 src/form/test/events.spec.js                  | 17 +----
 src/form/test/methods.spec.js                 | 74 +++++++++++++++++++
 src/form/test/props.spec.js                   | 19 ++---
 src/form/test/shared.js                       | 23 ++++++
 5 files changed, 124 insertions(+), 26 deletions(-)
 create mode 100644 src/form/test/__snapshots__/methods.spec.js.snap
 create mode 100644 src/form/test/methods.spec.js

diff --git a/src/form/test/__snapshots__/methods.spec.js.snap b/src/form/test/__snapshots__/methods.spec.js.snap
new file mode 100644
index 000000000..03deea7e9
--- /dev/null
+++ b/src/form/test/__snapshots__/methods.spec.js.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`resetValidation method - reset one field 1`] = `
+<form class="van-form">
+  <div class="van-cell van-field">
+    <div class="van-cell__value van-cell__value--alone van-field__value">
+      <div class="van-field__body"><input type="text" name="A" class="van-field__control"></div>
+    </div>
+  </div>
+  <div class="van-cell van-field van-field--error">
+    <div class="van-cell__value van-cell__value--alone van-field__value">
+      <div class="van-field__body"><input type="text" name="B" class="van-field__control"></div>
+      <div class="van-field__error-message">B failed</div>
+    </div>
+  </div> <button type="submit" class="van-button van-button--default van-button--normal"></button>
+</form>
+`;
diff --git a/src/form/test/events.spec.js b/src/form/test/events.spec.js
index 0058c062b..8d879385b 100644
--- a/src/form/test/events.spec.js
+++ b/src/form/test/events.spec.js
@@ -1,5 +1,5 @@
 import { later } from '../../../test';
-import { mountForm } from './shared';
+import { mountForm, mountSimpleRulesForm } from './shared';
 
 test('submit event', async () => {
   const onSubmit = jest.fn();
@@ -23,20 +23,7 @@ test('submit event', async () => {
 
 test('failed event', async () => {
   const onFailed = jest.fn();
-  const wrapper = mountForm({
-    template: `
-        <van-form @failed="onFailed">
-          <van-field name="A" :rules="rulesA" value="" />
-          <van-field name="B" :rules="rulesB" value="" />
-          <van-button native-type="submit" />
-        </van-form>
-      `,
-    data() {
-      return {
-        rulesA: [{ required: true, message: 'A failed' }],
-        rulesB: [{ required: true, message: 'B failed' }],
-      };
-    },
+  const wrapper = mountSimpleRulesForm({
     methods: {
       onFailed,
     },
diff --git a/src/form/test/methods.spec.js b/src/form/test/methods.spec.js
new file mode 100644
index 000000000..275be4eda
--- /dev/null
+++ b/src/form/test/methods.spec.js
@@ -0,0 +1,74 @@
+import { later } from '../../../test';
+import { mountForm, mountSimpleRulesForm } from './shared';
+
+test('submit method', async () => {
+  const onSubmit = jest.fn();
+
+  mountForm({
+    template: `
+        <van-form ref="form" @submit="onSubmit">
+          <van-field name="A" value="bar" />
+          <van-button native-type="submit" />
+        </van-form>
+      `,
+    mounted() {
+      this.$refs.form.submit();
+    },
+    methods: {
+      onSubmit,
+    },
+  });
+
+  await later();
+  expect(onSubmit).toHaveBeenCalledWith({ A: 'bar' });
+});
+
+test('validate method - validate all fields', done => {
+  mountSimpleRulesForm({
+    mounted() {
+      this.$refs.form.validate().catch(err => {
+        expect(err).toEqual([
+          { message: 'A failed', name: 'A' },
+          { message: 'B failed', name: 'B' },
+        ]);
+        done();
+      });
+    },
+  });
+});
+
+test('validate method - validate one field', done => {
+  mountSimpleRulesForm({
+    mounted() {
+      this.$refs.form.validate('A').catch(err => {
+        expect(err).toEqual({ message: 'A failed', name: 'A' });
+        done();
+      });
+    },
+  });
+});
+
+test('resetValidation method - reset all fields', done => {
+  const wrapper = mountSimpleRulesForm({
+    mounted() {
+      this.$refs.form.validate().catch(() => {
+        this.$refs.form.resetValidation();
+        const errors = wrapper.findAll('.van-field__error-message');
+        expect(errors.length).toEqual(0);
+        done();
+      });
+    },
+  });
+});
+
+test('resetValidation method - reset one field', done => {
+  const wrapper = mountSimpleRulesForm({
+    mounted() {
+      this.$refs.form.validate().catch(() => {
+        this.$refs.form.resetValidation('A');
+        expect(wrapper).toMatchSnapshot();
+        done();
+      });
+    },
+  });
+});
diff --git a/src/form/test/props.spec.js b/src/form/test/props.spec.js
index 323785836..007d23bbc 100644
--- a/src/form/test/props.spec.js
+++ b/src/form/test/props.spec.js
@@ -1,21 +1,18 @@
 import { mount, later } from '../../../test';
-import { mountForm } from './shared';
+import { mountForm, getSimpleRules } from './shared';
 
 test('validate-first prop', async () => {
   const onFailed = jest.fn();
   const wrapper = mountForm({
     template: `
-        <van-form validate-first @failed="onFailed">
-          <van-field name="A" :rules="rulesA" value="" />
-          <van-field name="B" :rules="rulesB" value="" />
-          <van-button native-type="submit" />
-        </van-form>
-      `,
+      <van-form validate-first @failed="onFailed">
+        <van-field name="A" :rules="rulesA" value="" />
+        <van-field name="B" :rules="rulesB" value="" />
+        <van-button native-type="submit" />
+      </van-form>
+    `,
     data() {
-      return {
-        rulesA: [{ required: true, message: 'A failed' }],
-        rulesB: [{ required: true, message: 'B failed' }],
-      };
+      return getSimpleRules();
     },
     methods: {
       onFailed,
diff --git a/src/form/test/shared.js b/src/form/test/shared.js
index 4a4f6f96c..dbca07c3b 100644
--- a/src/form/test/shared.js
+++ b/src/form/test/shared.js
@@ -3,3 +3,26 @@ import { mount } from '../../../test';
 export function mountForm(options) {
   return mount(options, { attachToDocument: true });
 }
+
+export function getSimpleRules() {
+  return {
+    rulesA: [{ required: true, message: 'A failed' }],
+    rulesB: [{ required: true, message: 'B failed' }],
+  };
+}
+
+export function mountSimpleRulesForm(options) {
+  return mountForm({
+    template: `
+      <van-form ref="form" @failed="onFailed">
+        <van-field name="A" :rules="rulesA" value="" />
+        <van-field name="B" :rules="rulesB" value="" />
+        <van-button native-type="submit" />
+      </van-form>
+    `,
+    data() {
+      return getSimpleRules();
+    },
+    ...options,
+  });
+}