Merge branch 'master' into optin-valid-time

frontend/src/components/GddSend/TransactionForm.spec.js

@@ -1,6 +1,7 @@
 import { mount } from '@vue/test-utils'
 import TransactionForm from './TransactionForm'
 import flushPromises from 'flush-promises'
+import { SEND_TYPES } from '@/pages/Send.vue'
 import DashboardLayout from '@/layouts/DashboardLayout_gdd.vue'
 
 const localVue = global.localVue
@@ -40,7 +41,7 @@ describe('TransactionForm', () => {
     })
 
     it('renders the component', () => {
-      expect(wrapper.find('div.transaction-form').exists()).toBeTruthy()
+      expect(wrapper.find('div.transaction-form').exists()).toBe(true)
     })
 
     describe('transaction form disable because balance 0,0 GDD', () => {
@@ -57,7 +58,7 @@ describe('TransactionForm', () => {
         expect(wrapper.find('.text-danger').text()).toBe('form.no_gdd_available')
       })
       it('has no reset button and no submit button ', () => {
-        expect(wrapper.find('.test-buttons').exists()).toBeFalsy()
+        expect(wrapper.find('.test-buttons').exists()).toBe(false)
       })
     })
 
@@ -69,13 +70,17 @@ describe('TransactionForm', () => {
         await wrapper.findAll('input[type="radio"]').at(0).setChecked()
       })
 
+      it('has SEND_TYPES = send', () => {
+        expect(wrapper.vm.selected).toBe(SEND_TYPES.send)
+      })
+
       describe('transaction form', () => {
         beforeEach(() => {
           wrapper.setProps({ balance: 100.0 })
         })
         describe('transaction form show because balance 100,0 GDD', () => {
           it('has no warning message ', () => {
-            expect(wrapper.find('.errors').exists()).toBeFalsy()
+            expect(wrapper.find('.errors').exists()).toBe(false)
           })
           it('has a reset button', () => {
             expect(wrapper.find('.test-buttons').findAll('button').at(0).attributes('type')).toBe(
@@ -165,13 +170,13 @@ describe('TransactionForm', () => {
           it('flushes no errors when amount is valid', async () => {
             await wrapper.find('#input-group-2').find('input').setValue('87.34')
             await flushPromises()
-            expect(wrapper.find('span.errors').exists()).toBeFalsy()
+            expect(wrapper.find('span.errors').exists()).toBe(false)
           })
         })
 
         describe('message text box', () => {
           it('has an textarea field', () => {
-            expect(wrapper.find('#input-group-3').find('textarea').exists()).toBeTruthy()
+            expect(wrapper.find('#input-group-3').find('textarea').exists()).toBe(true)
           })
 
           it('has an chat-right-text icon', () => {
@@ -193,13 +198,13 @@ describe('TransactionForm', () => {
           it('flushes no error message when memo is valid', async () => {
             await wrapper.find('#input-group-3').find('textarea').setValue('Long enough')
             await flushPromises()
-            expect(wrapper.find('span.errors').exists()).toBeFalsy()
+            expect(wrapper.find('span.errors').exists()).toBe(false)
           })
         })
 
         describe('cancel button', () => {
           it('has a cancel button', () => {
-            expect(wrapper.find('button[type="reset"]').exists()).toBeTruthy()
+            expect(wrapper.find('button[type="reset"]').exists()).toBe(true)
           })
 
           it('has the text "form.cancel"', () => {
@@ -248,16 +253,17 @@ describe('TransactionForm', () => {
       })
     })
 
-    describe('is selected: "link"', () => {
+    describe('create transaction link', () => {
       beforeEach(async () => {
-        // await wrapper.setData({
-        //   selected: 'link',
-        // })
         await wrapper.findAll('input[type="radio"]').at(1).setChecked()
       })
 
+      it('has SEND_TYPES = link', () => {
+        expect(wrapper.vm.selected).toBe(SEND_TYPES.link)
+      })
+
       it('has no input field of id input-group-1', () => {
-        expect(wrapper.find('#input-group-1').isVisible()).toBeFalsy()
+        expect(wrapper.find('#input-group-1').exists()).toBe(false)
       })
     })
   })

frontend/src/components/GddSend/TransactionForm.vue

@@ -16,16 +16,15 @@
                 </b-form-radio>
               </b-col>
             </b-row>
-            <div class="mt-4" v-show="selected === sendTypes.link">
+            <div class="mt-4" v-if="selected === sendTypes.link">
               <h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
               <div>
                 {{ $t('gdd_per_link.choose-amount') }}
               </div>
             </div>
 
-            <div>
+            <div v-if="selected === sendTypes.send">
               <validation-provider
-                v-show="selected === sendTypes.send"
                 name="Email"
                 :rules="{
                   required: selected === sendTypes.send ? true : false,
@@ -62,9 +61,7 @@
               </validation-provider>
             </div>
 
-            <br />
-
-            <div>
+            <div class="mt-4 mb-4">
               <validation-provider
                 :name="$t('form.amount')"
                 :rules="{
@@ -97,7 +94,7 @@
               </validation-provider>
             </div>
 
-            <div class="mt-4">
+            <div class="mb-4">
               <validation-provider
                 :rules="{
                   required: true,
@@ -125,7 +122,7 @@
                 </b-col>
               </validation-provider>
             </div>
-            <br />
+
             <div v-if="!!isBalanceDisabled" class="text-danger">
               {{ $t('form.no_gdd_available') }}
             </div>
@@ -141,7 +138,6 @@
                 </b-button>
               </b-col>
             </b-row>
-
             <br />
           </b-form>
         </validation-observer>