test new Search User Table

admin/src/components/Tables/SearchUserTable.spec.js

@@ -0,0 +1,129 @@
+import { mount } from '@vue/test-utils'
+import SearchUserTable from './SearchUserTable.vue'
+
+const date = new Date()
+
+const localVue = global.localVue
+
+const apolloMutateMock = jest.fn().mockResolvedValue({})
+const apolloQueryMock = jest.fn().mockResolvedValue({})
+
+const propsData = {
+  items: [
+    {
+      userId: 1,
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      email: 'bibi@bloxberg.de',
+      creation: [200, 400, 600],
+      emailChecked: true,
+    },
+    {
+      userId: 2,
+      firstName: 'Benjamin',
+      lastName: 'Blümchen',
+      email: 'benjamin@bluemchen.de',
+      creation: [1000, 1000, 1000],
+      emailChecked: true,
+    },
+    {
+      userId: 3,
+      firstName: 'Peter',
+      lastName: 'Lustig',
+      email: 'peter@lustig.de',
+      creation: [0, 0, 0],
+      emailChecked: true,
+    },
+    {
+      userId: 4,
+      firstName: 'New',
+      lastName: 'User',
+      email: 'new@user.ch',
+      creation: [1000, 1000, 1000],
+      emailChecked: false,
+    },
+  ],
+  fields: [
+    { key: 'email', label: 'e_mail' },
+    { key: 'firstName', label: 'firstname' },
+    { key: 'lastName', label: 'lastname' },
+    {
+      key: 'creation',
+      label: 'creationLabel',
+      formatter: (value, key, item) => {
+        return value.join(' | ')
+      },
+    },
+    { key: 'status', label: 'status' },
+  ],
+}
+
+const mocks = {
+  $t: jest.fn((t) => t),
+  $d: jest.fn((d) => d),
+  $apollo: {
+    mutate: apolloMutateMock,
+    query: apolloQueryMock,
+  },
+  $store: {
+    state: {
+      moderator: {
+        id: 0,
+        name: 'test moderator',
+      },
+    },
+  },
+  $toasted: {
+    error: jest.fn(),
+    success: jest.fn(),
+  },
+}
+
+describe('SearchUserTable', () => {
+  let wrapper
+
+  const Wrapper = () => {
+    return mount(SearchUserTable, { localVue, mocks, propsData })
+  }
+
+  describe('mount', () => {
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    it('has a table with four rows', () => {
+      expect(wrapper.findAll('tbody > tr')).toHaveLength(4)
+    })
+
+    describe('show row details', () => {
+      beforeEach(async () => {
+        await wrapper.findAll('tbody > tr').at(1).trigger('click')
+      })
+
+      describe('deleted at', () => {
+        beforeEach(async () => {
+          await wrapper.find('div.deleted-user-formular').vm.$emit('updateDeletedAt', {
+            userId: 1,
+            deletedAt: date,
+          })
+        })
+
+        it('emits updateDeletedAt', () => {
+          expect(wrapper.emitted('updateDeletedAt')).toEqual([[1, date]])
+        })
+      })
+
+      describe('updateUserData', () => {
+        beforeEach(async () => {
+          await wrapper
+            .find('div.component-creation-formular')
+            .vm.$emit('update-user-data', propsData.items[1], [250, 500, 750])
+        })
+
+        it('updates the item', () => {
+          expect(wrapper.vm.items[1].creation).toEqual([250, 500, 750])
+        })
+      })
+    })
+  })
+})