Skip to content

Commit

Permalink
Refactor favorites spec
Browse files Browse the repository at this point in the history
  • Loading branch information
@kiranparajuli589
kiranparajuli589 committed Aug 20, 2021
1 parent 781f375 commit bdbe852
Show file tree
Hide file tree
Showing 3 changed files with 111 additions and 174 deletions.
209 changes: 75 additions & 134 deletions packages/web-app-files/tests/unit/views/Favorites.spec.js
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,21 @@
import GetTextPlugin from 'vue-gettext'
import { mount } from '@vue/test-utils'
import Favorites from 'packages/web-app-files/src/views/Favorites.vue'
import { createStore } from 'vuex-extensions'
import { createFile, localVue, getStore } from './views.setup'
import Vuex from 'vuex'
import VueRouter from 'vue-router'

localVue.use(GetTextPlugin, {
translations: 'does-not-matter.json',
silent: true
})
localVue.use(VueRouter)

const router = new VueRouter()

jest.unmock('axios')

const selectors = {
favoritesTable: '#files-favorites-table'
favoritesTable: '#files-favorites-table',
spinnerStub: 'oc-spinner-stub',
filesTableStub: 'oc-table-files-stub',
emptyFavorites: '#files-favorites-empty',
paginationStub: 'oc-pagination-stub',
listInfoStub: 'list-info-stub'
}
const component = { ...Favorites, created: jest.fn(), mounted: jest.fn() }
const stubs = {
Expand All @@ -30,7 +28,7 @@ const stubs = {
}

const defaultWrapper = mount(component, {
store: getStore(),
store: getStore({ activeFiles: [createFile({ id: 1 }), createFile({ id: 2, status: 2 })] }),
localVue,
router,
stubs: stubs,
Expand All @@ -42,74 +40,39 @@ const defaultWrapper = mount(component, {
describe('Favorites component', () => {
describe('loading indicator', () => {
it('shows only the list-loader during loading', () => {
const wrapper = mount(component, {
store: getStore(),
localVue,
router,
stubs: stubs,
data: () => ({
loading: true
})
})
expect(wrapper.find('oc-spinner-stub').exists()).toBeTruthy()
expect(wrapper.find('oc-table-files-stub').exists()).toBeFalsy()
const wrapper = getMountedWrapper({ loading: true })
expect(wrapper.find(selectors.spinnerStub).exists()).toBeTruthy()
expect(wrapper.find(selectors.filesTableStub).exists()).toBeFalsy()
})
it('shows only the files table when loading is finished', () => {
expect(defaultWrapper.find('oc-spinner-stub').exists()).toBeFalsy()
expect(defaultWrapper.find('oc-table-files-stub').exists()).toBeTruthy()
expect(defaultWrapper.find(selectors.spinnerStub).exists()).toBeFalsy()
expect(defaultWrapper.find(selectors.filesTableStub).exists()).toBeTruthy()
})
})
describe('no content message', () => {
it('shows only the "no content" message if no resources are marked as favorite', () => {
const wrapper = mount(component, {
store: createStore(Vuex.Store, {
modules: {
Files: {
state: {
resource: null,
currentPage: 1
},
getters: {
activeFiles: () => [],
inProgress: () => [null]
},
mutations: {
UPDATE_CURRENT_PAGE: () => {},
SET_FILES_PAGE_LIMIT: () => {}
},
namespaced: true
}
}
}),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
const store = getStore({
currentPage: 1,
inProgress: [null]
})
expect(wrapper.find('#files-favorites-empty').exists()).toBeTruthy()
expect(wrapper.find('oc-table-files-stub').exists()).toBeFalsy()
const wrapper = getMountedWrapper({ store })

expect(wrapper.find(selectors.emptyFavorites).exists()).toBeTruthy()
expect(wrapper.find(selectors.filesTableStub).exists()).toBeFalsy()
})
it('does not show the no content message if resources are marked as favorite', () => {
expect(defaultWrapper.find('#files-favorites-empty').exists()).toBeFalsy()
expect(defaultWrapper.find('oc-table-files-stub').exists()).toBeTruthy()
expect(defaultWrapper.find(selectors.emptyFavorites).exists()).toBeFalsy()
expect(defaultWrapper.find(selectors.filesTableStub).exists()).toBeTruthy()
})
})
describe('files table', () => {
describe('no file is highlighted', () => {
it("don't squash the table", () => {
const wrapper = mount(component, {
store: getStore({
sidebarClosed: true
}),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
const store = getStore({
sidebarClosed: true,
activeFiles: [createFile({ id: 1 }), createFile({ id: 2, status: 2 })]
})
const wrapper = getMountedWrapper({ store: store, loading: false })
expect(wrapper.find(selectors.favoritesTable).attributes('class')).not.toContain(
'files-table-squashed'
)
Expand All @@ -120,15 +83,11 @@ describe('Favorites component', () => {
})
})
describe('a file is highlighted', () => {
const wrapper = mount(component, {
store: getStore({ highlightedFile: createFile({ id: 234 }) }),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
const store = getStore({
highlightedFile: createFile({ id: 234 }),
activeFiles: [createFile({ id: 1 }), createFile({ id: 2, status: 2 })]
})
const wrapper = getMountedWrapper({ store })
it('squash the table', () => {
expect(wrapper.find(selectors.favoritesTable).attributes('class')).toContain(
'files-table-squashed'
Expand All @@ -137,21 +96,15 @@ describe('Favorites component', () => {
})
describe('previews', () => {
it('displays previews when the "disablePreviews" config is disabled', () => {
const wrapper = mount(component, {
store: getStore({
configuration: {
options: {
disablePreviews: false
}
const store = getStore({
activeFiles: [createFile({ id: 1 }), createFile({ id: 2, status: 2 })],
configuration: {
options: {
disablePreviews: false
}
}),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
}
})
const wrapper = getMountedWrapper({ store })
expect(
wrapper.find(selectors.favoritesTable).attributes('arethumbnailsdisplayed')
).toBeTruthy()
Expand All @@ -167,30 +120,22 @@ describe('Favorites component', () => {
stubs['oc-table-files'] = false
})
it('sets the pages count & the current page', () => {
const wrapper = mount(component, {
store: getStore(),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
const store = getStore({
activeFiles: [createFile({ id: 1 }), createFile({ id: 2, status: 2 })],
currentPage: 3,
pages: 4
})
expect(wrapper.find('oc-pagination-stub').attributes('currentpage')).toEqual('3')
expect(wrapper.find('oc-pagination-stub').attributes('pages')).toEqual('4')
const wrapper = getMountedWrapper({ store })

expect(wrapper.find(selectors.paginationStub).attributes('currentpage')).toEqual('3')
expect(wrapper.find(selectors.paginationStub).attributes('pages')).toEqual('4')
})

it('does not show any pagination when there is only one page', () => {
const wrapper = mount(component, {
store: getStore({ pages: 1 }),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
})
expect(wrapper.find('oc-pagination-stub').exists()).toBeFalsy()
const store = getStore({ pages: 1 })
const wrapper = getMountedWrapper({ store })

expect(wrapper.find(selectors.paginationStub).exists()).toBeFalsy()
})
})
describe('list-info', () => {
Expand All @@ -199,44 +144,40 @@ describe('Favorites component', () => {
stubs['list-info'] = true
})
it('sets the counters and the size', () => {
const wrapper = mount(component, {
store: getStore(),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
})
expect(wrapper.find('list-info-stub').attributes('files')).toEqual('15')
expect(wrapper.find('list-info-stub').attributes('folders')).toEqual('20')
expect(wrapper.find('list-info-stub').attributes('size')).toEqual('1024')
const wrapper = getMountedWrapper()

expect(wrapper.find(selectors.listInfoStub).attributes('files')).toEqual('15')
expect(wrapper.find(selectors.listInfoStub).attributes('folders')).toEqual('20')
expect(wrapper.find(selectors.listInfoStub).attributes('size')).toEqual('1024')
})
it('shows the list info when there is only one active file', () => {
const wrapper = mount(component, {
store: getStore({ activeFiles: [createFile({ id: 3, status: 2, type: 'file' })] }),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
})
const wrapper = getMountedWrapper()

expect(wrapper.find('list-info-stub').exists()).toBeTruthy()
})

it('does not show the list info when there are no active files', () => {
const wrapper = mount(component, {
store: getStore({ activeFiles: [] }),
localVue,
router,
stubs: stubs,
data: () => ({
loading: false
})
})
expect(wrapper.find('list-info-stub').exists()).toBeFalsy()
const store = createStore({ activeFiles: [] })
const wrapper = getMountedWrapper({ store })

expect(wrapper.find(selectors.listInfoStub).exists()).toBeFalsy()
})
})
})

function createStore({ activeFiles = [createFile({ id: 3, status: 2, type: 'file' })] } = {}) {
return getStore({ activeFiles })
}

function getMountedWrapper({ store = createStore(), loading = false } = {}) {
return mount(component, {
store,
localVue,
router,
stubs: stubs,
data: () => ({
loading: loading
})
})
}
})
Loading

0 comments on commit bdbe852

Please sign in to comment.