-
Notifications
You must be signed in to change notification settings - Fork 157
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
added details sidebar for multiple selection
- Loading branch information
Showing
4 changed files
with
199 additions
and
19 deletions.
There are no files selected for viewing
7 changes: 7 additions & 0 deletions
7
changelog/unreleased/enhancement-add-multiple-selection-sidebar
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| Enhancement: Add multiple selection Sidebar | ||
|
|
||
| We've changed the sidebar so if a user selects multiple files or folders | ||
| he sees a detailed view of his selection in the sidebar. | ||
|
|
||
| https://github.com/owncloud/web/issues/5164 | ||
| https://github.com/owncloud/web/pull/5630 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
93 changes: 93 additions & 0 deletions
93
packages/web-app-files/tests/unit/components/SideBar/Details/FileDetailsMultiple.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,93 @@ | ||
| import { createLocalVue, shallowMount } from '@vue/test-utils' | ||
| import Vuex from 'vuex' | ||
| import FileDetailsMultiple from 'packages/web-app-files/src/components/SideBar/Details/FileDetailsMultiple.vue' | ||
| import stubs from '../../../../../../../tests/unit/stubs' | ||
| import GetTextPlugin from 'vue-gettext' | ||
| import AsyncComputed from 'vue-async-computed' | ||
|
|
||
| const localVue = createLocalVue() | ||
| localVue.use(Vuex) | ||
| localVue.use(AsyncComputed) | ||
| localVue.use(GetTextPlugin, { | ||
| translations: 'does-not-matter.json', | ||
| silent: true | ||
| }) | ||
|
|
||
| const selectors = { | ||
| selectedFilesText: '[data-testid="selectedFilesText"]', | ||
| filesCount: '[data-testid="filesCount"]', | ||
| foldersCount: '[data-testid="foldersCount"]', | ||
| size: '[data-testid="size"]' | ||
| } | ||
|
|
||
| const folderA = { | ||
| type: 'folder', | ||
| ownerId: 'marie', | ||
| ownerDisplayName: 'Marie', | ||
| mdate: 'Wed, 21 Oct 2015 07:28:00 GMT', | ||
| size: '740' | ||
| } | ||
| const folderB = { | ||
| type: 'folder', | ||
| ownerId: 'marie', | ||
| ownerDisplayName: 'Marie', | ||
| mdate: 'Wed, 21 Oct 2015 07:28:00 GMT', | ||
| size: '740' | ||
| } | ||
| const fileA = { | ||
| type: 'file', | ||
| ownerId: 'marie', | ||
| ownerDisplayName: 'Marie', | ||
| mdate: 'Wed, 21 Oct 2015 07:28:00 GMT', | ||
| size: '740' | ||
| } | ||
| const fileB = { | ||
| type: 'file', | ||
| ownerId: 'marie', | ||
| ownerDisplayName: 'Marie', | ||
| mdate: 'Wed, 21 Oct 2015 07:28:00 GMT', | ||
| size: '740' | ||
| } | ||
|
|
||
| describe('Details Multiple Selection SideBar Item', () => { | ||
| it('should display information for two selected folders', () => { | ||
| const wrapper = createWrapper([folderA, folderB]) | ||
| expect(wrapper.find(selectors.selectedFilesText).text()).toBe('2 items selected') | ||
| expect(wrapper.find(selectors.filesCount).text()).toBe('Files 0') | ||
| expect(wrapper.find(selectors.foldersCount).text()).toBe('Folders 2') | ||
| expect(wrapper.find(selectors.size).text()).toBe('Size 1 KB') | ||
| }) | ||
| it('should display information for two selected files', () => { | ||
| const wrapper = createWrapper([fileA, fileB]) | ||
| expect(wrapper.find(selectors.selectedFilesText).text()).toBe('2 items selected') | ||
| expect(wrapper.find(selectors.filesCount).text()).toBe('Files 2') | ||
| expect(wrapper.find(selectors.foldersCount).text()).toBe('Folders 0') | ||
| expect(wrapper.find(selectors.size).text()).toBe('Size 1 KB') | ||
| }) | ||
| it('should display information for one selected file, one selected folder', () => { | ||
| const wrapper = createWrapper([fileA, folderA]) | ||
| expect(wrapper.find(selectors.selectedFilesText).text()).toBe('2 items selected') | ||
| expect(wrapper.find(selectors.filesCount).text()).toBe('Files 1') | ||
| expect(wrapper.find(selectors.foldersCount).text()).toBe('Folders 1') | ||
| expect(wrapper.find(selectors.size).text()).toBe('Size 1 KB') | ||
| }) | ||
| }) | ||
|
|
||
| function createWrapper(testResource) { | ||
| return shallowMount(FileDetailsMultiple, { | ||
| store: new Vuex.Store({ | ||
| modules: { | ||
| Files: { | ||
| namespaced: true, | ||
| getters: { | ||
| selectedFiles: function() { | ||
| return testResource | ||
| } | ||
| } | ||
| } | ||
| } | ||
| }), | ||
| localVue, | ||
| stubs: stubs | ||
| }) | ||
| } |