Skip to content

Commit

Permalink
Refactor unit tests
Browse files Browse the repository at this point in the history 
Signed-off-by: Swikriti Tripathi <swikriti808@gmail.com>
  • Loading branch information
@SwikritiT
SwikritiT committed Apr 5, 2022
1 parent 610b685 commit 9a572c1
Show file tree
Hide file tree
Showing 3 changed files with 64 additions and 63 deletions.
15 changes: 11 additions & 4 deletions src/views/ProjectsTab.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,12 +38,12 @@
:workpackage="workpackage"
:class="{ 'workpackage-seperator': index !== workpackages.length-1 }" />
<Actions class="linked-workpackages--menu" menu-align="right">
<ActionButton icon="icon-openproject">
Open in OpenProject
<ActionButton class="linked-workpackages--menu--open" icon="icon-openproject">
{{ openLink }}
</ActionButton>
<ActionSeparator />
<ActionButton icon="icon-delete">
Delete link
<ActionButton class="linked-workpackages--menu--delete" icon="icon-delete">
{{ deleteLink }}
</ActionButton>
</Actions>
</div>
Expand All @@ -62,6 +62,7 @@ import Actions from '@nextcloud/vue/dist/Components/Actions'
import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
import ActionSeparator from '@nextcloud/vue/dist/Components/ActionSeparator'
import axios from '@nextcloud/axios'
import { translate as t } from '@nextcloud/l10n'
import { generateUrl } from '@nextcloud/router'
import SearchInput from '../components/tab/SearchInput'
import { loadState } from '@nextcloud/initial-state'
Expand All @@ -88,6 +89,12 @@ export default {
isLoading() {
return this.state === 'loading'
},
deleteLink() {
return t('integration_openproject', 'Delete Link')
},
openLink() {
return t('integration_openproject', 'Open in OpenProject')
},
},
methods: {
/**
Expand Down
30 changes: 18 additions & 12 deletions tests/jest/views/ProjectsTab.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@ describe('ProjectsTab.vue Test', () => {
const workPackagesSelector = '#openproject-linked-workpackages'
const existingRelationSelector = '.existing-relations'
const searchInputStubSelector = 'searchinput-stub'
const linkedWPActionMenuSelector = '.linked-workpackages--menu'
const toggleMenuSelector = '.action-item__menutoggle'
const toggleMenuOpenSelector = '.action-item--open'
const openWorkpackageSelector = '.linked-workpackages--menu--open'
const deleteWorkpackageSelector = '.linked-workpackages--menu--delete'

beforeEach(() => {
// eslint-disable-next-line no-import-assign
Expand Down Expand Up @@ -284,18 +287,23 @@ describe('ProjectsTab.vue Test', () => {
})

describe('action menu', () => {
it('should display the action menu in linked work packages', async () => {
wrapper = mountWrapper()
await wrapper.vm.onSaved(workPackagesSearchResponse[0])
const linkedWPActionMenu = wrapper.find(linkedWPActionMenuSelector)
await linkedWPActionMenu.trigger('click')
expect(linkedWPActionMenu.exists()).toBeTruthy()
expect(linkedWPActionMenu).toMatchSnapshot()
it('should display the action menu for linked work packages', async () => {
wrapper = mountWrapper(false)
await wrapper.setData({
workpackages: workPackagesSearchResponse,
})
await localVue.nextTick()
expect(wrapper.find(toggleMenuOpenSelector).exists()).toBeFalsy()
await wrapper.find(toggleMenuSelector).trigger('click')
const toggleMenuOpen = wrapper.find(toggleMenuOpenSelector)
expect(toggleMenuOpen.exists()).toBeTruthy()
expect(wrapper.find(openWorkpackageSelector).text()).toBe('Open in OpenProject')
expect(wrapper.find(deleteWorkpackageSelector).text()).toBe('Delete Link')
})
})
})

function mountWrapper() {
function mountWrapper(stub = true) {
return mount(ProjectsTab, {
localVue,
mocks: {
Expand All @@ -307,9 +315,7 @@ function mountWrapper() {
stubs: {
SearchInput: true,
Avatar: true,
Actions: true,
ActionButton: true,
ActionSeparator: true,
Actions: stub,
},
data: () => ({
error: '',
Expand Down
82 changes: 35 additions & 47 deletions tests/jest/views/__snapshots__/ProjectsTab.spec.js.snap
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`ProjectsTab.vue Test action menu should display the action menu in linked work packages 1`] = `
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
</actions-stub>
`;

exports[`ProjectsTab.vue Test fetchWorkpackages shows the linked workpackages 1`] = `
<div class="" id="openproject-linked-workpackages">
<div class="existing-relations">
Expand Down Expand Up @@ -48,13 +36,13 @@ exports[`ProjectsTab.vue Test fetchWorkpackages shows the linked workpackages 1`
</div>
</div>
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--open"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-openproject"></span> <span data-v-71ea20d2="" class="action-button__text">Open in OpenProject</span>
<!---->
</button></li>
<li data-v-5339ba06="" class="action action-separator action--disabled"></li>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--delete"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-delete"></span> <span data-v-71ea20d2="" class="action-button__text">Delete Link</span>
<!---->
</button></li>
</actions-stub>
</div>
<div class="linked-workpackages">
Expand Down Expand Up @@ -88,13 +76,13 @@ exports[`ProjectsTab.vue Test fetchWorkpackages shows the linked workpackages 1`
</div>
</div>
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--open"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-openproject"></span> <span data-v-71ea20d2="" class="action-button__text">Open in OpenProject</span>
<!---->
</button></li>
<li data-v-5339ba06="" class="action action-separator action--disabled"></li>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--delete"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-delete"></span> <span data-v-71ea20d2="" class="action-button__text">Delete Link</span>
<!---->
</button></li>
</actions-stub>
</div>
</div>
Expand Down Expand Up @@ -136,13 +124,13 @@ exports[`ProjectsTab.vue Test fetchWorkpackages shows the linked workpackages 2`
</div>
</div>
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--open"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-openproject"></span> <span data-v-71ea20d2="" class="action-button__text">Open in OpenProject</span>
<!---->
</button></li>
<li data-v-5339ba06="" class="action action-separator action--disabled"></li>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--delete"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-delete"></span> <span data-v-71ea20d2="" class="action-button__text">Delete Link</span>
<!---->
</button></li>
</actions-stub>
</div>
<div class="linked-workpackages">
Expand Down Expand Up @@ -176,13 +164,13 @@ exports[`ProjectsTab.vue Test fetchWorkpackages shows the linked workpackages 2`
</div>
</div>
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--open"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-openproject"></span> <span data-v-71ea20d2="" class="action-button__text">Open in OpenProject</span>
<!---->
</button></li>
<li data-v-5339ba06="" class="action action-separator action--disabled"></li>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--delete"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-delete"></span> <span data-v-71ea20d2="" class="action-button__text">Delete Link</span>
<!---->
</button></li>
</actions-stub>
</div>
</div>
Expand Down Expand Up @@ -224,13 +212,13 @@ exports[`ProjectsTab.vue Test onSave shows the just linked workpackage 1`] = `
</div>
</div>
<actions-stub defaulticon="" arialabel="Actions" placement="bottom" boundarieselement="[object HTMLBodyElement]" container="body" menu-align="right" class="linked-workpackages--menu">
<actionbutton-stub icon="icon-openproject" title="" arialabel="">
Open in OpenProject
</actionbutton-stub>
<actionseparator-stub></actionseparator-stub>
<actionbutton-stub icon="icon-delete" title="" arialabel="">
Delete link
</actionbutton-stub>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--open"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-openproject"></span> <span data-v-71ea20d2="" class="action-button__text">Open in OpenProject</span>
<!---->
</button></li>
<li data-v-5339ba06="" class="action action-separator action--disabled"></li>
<li data-v-71ea20d2="" class="action linked-workpackages--menu--delete"><button data-v-71ea20d2="" aria-label="" type="button" class="action-button focusable"><span data-v-71ea20d2="" class="action-button__icon icon-delete"></span> <span data-v-71ea20d2="" class="action-button__text">Delete Link</span>
<!---->
</button></li>
</actions-stub>
</div>
</div>
Expand Down

0 comments on commit 9a572c1

Please sign in to comment.