Change reset button to cancel and add tests

frontend/src/components/Contributions/ContributionForm.spec.js

@@ -45,8 +45,70 @@ describe('ContributionForm', () => {
       expect(wrapper.find('div.contribution-form').exists()).toBe(true)
     })
 
-    it('is submit button disable of true', () => {
+    describe('empty form data', () => {
-      expect(wrapper.find('button[type="submit"]').attributes('disabled')).toBe('disabled')
+      describe('has button', () => {
+        it('reset enabled', () => {
+          expect(wrapper.find('button[type="reset"]').attributes('disabled')).toBeFalsy()
+        })
+
+        it('submit disabled', () => {
+          expect(wrapper.find('button[type="submit"]').attributes('disabled')).toBe('disabled')
+        })
+      })
+    })
+
+    describe('set contrubtion', () => {
+      describe('fill in form data', () => {
+        const now = new Date().toISOString()
+
+        beforeEach(async () => {
+          await wrapper.setData({
+            form: {
+              id: null,
+              date: now,
+              memo: 'Mein Beitrag zur Gemeinschaft für diesen Monat ...',
+              amount: '200',
+            },
+          })
+        })
+
+        describe('has button', () => {
+          it('reset enabled', () => {
+            expect(wrapper.find('button[type="reset"]').attributes('disabled')).toBeFalsy()
+          })
+
+          it('submit enabled', () => {
+            expect(wrapper.find('button[type="submit"]').attributes('disabled')).toBeFalsy()
+          })
+        })
+      })
+    })
+
+    describe('update contrubtion', () => {
+      describe('fill in form data and "id"', () => {
+        const now = new Date().toISOString()
+
+        beforeEach(async () => {
+          await wrapper.setData({
+            form: {
+              id: 2,
+              date: now,
+              memo: 'Mein Beitrag zur Gemeinschaft für diesen Monat ...',
+              amount: '200',
+            },
+          })
+        })
+
+        describe('has button', () => {
+          it('reset enabled', () => {
+            expect(wrapper.find('button[type="reset"]').attributes('disabled')).toBeFalsy()
+          })
+
+          it('submit enabled', () => {
+            expect(wrapper.find('button[type="submit"]').attributes('disabled')).toBeFalsy()
+          })
+        })
+      })
     })
   })
 })

frontend/src/components/Contributions/ContributionForm.vue

@@ -71,8 +71,8 @@
       </div>
       <b-row class="mt-3">
         <b-col>
-          <b-button type="button" variant="light" @click.prevent="reset">
+          <b-button class="test-cancel" type="reset" variant="secondary" @click="reset">
-            {{ $t('form.reset') }}
+            {{ $t('form.cancel') }}
           </b-button>
         </b-col>
         <b-col class="text-right">