From e8859544f70db6130d08d9c0cb4dbc8a279358bd Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Tue, 16 Nov 2021 13:06:53 +0100
Subject: [PATCH] feat: Raise Test Coverage Frontend

---
 .github/workflows/test.yml                    |  2 +-
 .../Pages/SendOverview/GddSend/QrCode.spec.js | 70 +++++++++++++++++++
 .../Pages/SendOverview/GddSend/QrCode.vue     |  5 ++
 3 files changed, 76 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/views/Pages/SendOverview/GddSend/QrCode.spec.js

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 9b10b7250..0e89057cf 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -344,7 +344,7 @@ jobs:
           report_name: Coverage Frontend
           type: lcov
           result_path: ./coverage/lcov.info
-          min_coverage: 85
+          min_coverage: 86
           token: ${{ github.token }}
   
   ##############################################################################
diff --git a/frontend/src/views/Pages/SendOverview/GddSend/QrCode.spec.js b/frontend/src/views/Pages/SendOverview/GddSend/QrCode.spec.js
new file mode 100644
index 000000000..66da5748d
--- /dev/null
+++ b/frontend/src/views/Pages/SendOverview/GddSend/QrCode.spec.js
@@ -0,0 +1,70 @@
+import { mount } from '@vue/test-utils'
+import QrCode from './QrCode'
+
+const localVue = global.localVue
+
+describe('QrCode', () => {
+  let wrapper
+
+  const mocks = {
+    $t: jest.fn((t) => t),
+  }
+
+  const stubs = {
+    QrcodeStream: true,
+    QrcodeCapture: true,
+  }
+
+  const Wrapper = () => {
+    return mount(QrCode, { localVue, mocks, stubs })
+  }
+
+  describe('mount', () => {
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    it('renders the component', () => {
+      expect(wrapper.find('div.alert').exists()).toBeTruthy()
+    })
+
+    describe('scanning', () => {
+      beforeEach(async () => {
+        wrapper.find('a').trigger('click')
+      })
+
+      it('has a scanning stream', () => {
+        expect(wrapper.findComponent({ name: 'QrcodeStream' }).exists()).toBeTruthy()
+      })
+
+      describe('decode', () => {
+        beforeEach(async () => {
+          await wrapper
+            .findComponent({ name: 'QrcodeStream' })
+            .vm.$emit('decode', '[{"email": "user@example.org", "amount": 10.0}]')
+        })
+
+        it('emits set transaction', () => {
+          expect(wrapper.emitted()['set-transaction']).toEqual([
+            [
+              {
+                email: 'user@example.org',
+                amount: 10,
+              },
+            ],
+          ])
+        })
+      })
+
+      describe('detect', () => {
+        beforeEach(async () => {
+          await wrapper.find('div.row > *').vm.$emit('detect')
+        })
+
+        it('calls onDetect', () => {
+          expect(wrapper.vm.detect).toBeTruthy()
+        })
+      })
+    })
+  })
+})
diff --git a/frontend/src/views/Pages/SendOverview/GddSend/QrCode.vue b/frontend/src/views/Pages/SendOverview/GddSend/QrCode.vue
index edf027aef..3927cdb72 100644
--- a/frontend/src/views/Pages/SendOverview/GddSend/QrCode.vue
+++ b/frontend/src/views/Pages/SendOverview/GddSend/QrCode.vue
@@ -44,6 +44,7 @@ export default {
   data() {
     return {
       scan: false,
+      detect: false,
     }
   },
   methods: {
@@ -55,6 +56,10 @@ export default {
       this.$emit('set-transaction', { email: arr[0].email, amount: arr[0].amount })
       this.scan = false
     },
+    async onDetect() {
+      // what is this for? I added the detect data to test that the method is called
+      this.detect = !this.detect
+    },
   },
 }
 </script>