From f5f59a841496387220ba906415a04b9c9349dfd9 Mon Sep 17 00:00:00 2001 From: skjnldsv Date: Thu, 7 Nov 2024 19:00:35 +0100 Subject: [PATCH] chore(files): add selection cypress tests Signed-off-by: skjnldsv --- .../FileEntry/FileEntryCheckbox.vue | 1 + .../src/components/FilesListTableHeader.vue | 2 +- cypress/e2e/files/FilesUtils.ts | 24 ++++++ ..._copy-move.cy.ts => files-copy-move.cy.ts} | 0 cypress/e2e/files/files-selection.cy.ts | 77 +++++++++++++++++++ ...iles_sorting.cy.ts => files-sorting.cy.ts} | 0 6 files changed, 103 insertions(+), 1 deletion(-) rename cypress/e2e/files/{files_copy-move.cy.ts => files-copy-move.cy.ts} (100%) create mode 100644 cypress/e2e/files/files-selection.cy.ts rename cypress/e2e/files/{files_sorting.cy.ts => files-sorting.cy.ts} (100%) diff --git a/apps/files/src/components/FileEntry/FileEntryCheckbox.vue b/apps/files/src/components/FileEntry/FileEntryCheckbox.vue index f2ab39d752515..9caa08cfe22c2 100644 --- a/apps/files/src/components/FileEntry/FileEntryCheckbox.vue +++ b/apps/files/src/components/FileEntry/FileEntryCheckbox.vue @@ -9,6 +9,7 @@ diff --git a/apps/files/src/components/FilesListTableHeader.vue b/apps/files/src/components/FilesListTableHeader.vue index e91cfa055c11f..c8334abda5e85 100644 --- a/apps/files/src/components/FilesListTableHeader.vue +++ b/apps/files/src/components/FilesListTableHeader.vue @@ -6,7 +6,7 @@ - + diff --git a/cypress/e2e/files/FilesUtils.ts b/cypress/e2e/files/FilesUtils.ts index 345b6402f1f04..7372d7366af4f 100644 --- a/cypress/e2e/files/FilesUtils.ts +++ b/cypress/e2e/files/FilesUtils.ts @@ -28,6 +28,30 @@ export const triggerInlineActionForFile = (filename: string, actionId: string) = getActionsForFile(filename).get(`button[data-cy-files-list-row-action="${CSS.escape(actionId)}"]`).should('exist').click() } +export const selectAllFiles = () => { + cy.get('[data-cy-files-list-selection-checkbox]') + .findByRole('checkbox', { checked: false }) + .click({ force: true }) +} +export const deselectAllFiles = () => { + cy.get('[data-cy-files-list-selection-checkbox]') + .findByRole('checkbox', { checked: true }) + .click({ force: true }) +} + +export const selectRowForFile = (filename: string, options: Partial = {}) => { + getRowForFile(filename) + .find('[data-cy-files-list-row-checkbox]') + .findByRole('checkbox') + // don't use click to avoid triggering side effects events + .trigger('change', { ...options, force: true }) + .should('be.checked') + cy.get('[data-cy-files-list-selection-checkbox]').findByRole('checkbox').should('satisfy', (elements) => { + return elements.length === 1 && (elements[0].checked === true || elements[0].indeterminate === true) + }) + +} + export const moveFile = (fileName: string, dirPath: string) => { getRowForFile(fileName).should('be.visible') triggerActionForFile(fileName, 'move-copy') diff --git a/cypress/e2e/files/files_copy-move.cy.ts b/cypress/e2e/files/files-copy-move.cy.ts similarity index 100% rename from cypress/e2e/files/files_copy-move.cy.ts rename to cypress/e2e/files/files-copy-move.cy.ts diff --git a/cypress/e2e/files/files-selection.cy.ts b/cypress/e2e/files/files-selection.cy.ts new file mode 100644 index 0000000000000..04991b74fb834 --- /dev/null +++ b/cypress/e2e/files/files-selection.cy.ts @@ -0,0 +1,77 @@ +/** + * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +import type { User } from '@nextcloud/cypress' +import { deselectAllFiles, selectAllFiles, selectRowForFile } from './FilesUtils' + +const files = { + 'image.jpg': 'image/jpeg', + 'document.pdf': 'application/pdf', + 'archive.zip': 'application/zip', + 'audio.mp3': 'audio/mpeg', + 'video.mp4': 'video/mp4', + 'readme.md': 'text/markdown', + 'welcome.txt': 'text/plain', +} +const filesCount = Object.keys(files).length + +describe('files: Select all files', { testIsolation: true }, () => { + let user: User + + before(() => { + cy.createRandomUser().then(($user) => { + user = $user + Object.keys(files).forEach((file) => { + cy.uploadContent(user, new Blob(), files[file], '/' + file) + }) + }) + }) + + beforeEach(() => { + cy.login(user) + cy.visit('/apps/files') + }) + + it('Can select and unselect all files', () => { + cy.get('[data-cy-files-list-row-fileid]').should('have.length', filesCount) + cy.get('[data-cy-files-list-row-checkbox]').should('have.length', filesCount) + + selectAllFiles() + + cy.get('.files-list__selected').should('have.text', '7 selected') + cy.get('[data-cy-files-list-row-checkbox]').findByRole('checkbox').should('be.checked') + + deselectAllFiles() + + cy.get('.files-list__selected').should('not.exist') + cy.get('[data-cy-files-list-row-checkbox]').findByRole('checkbox').should('not.be.checked') + }) + + it('Can select some files randomly', () => { + const randomFiles = Object.keys(files).reduce((acc, file) => { + if (Math.random() > 0.1) { + acc.push(file) + } + return acc + }, [] as string[]) + + randomFiles.forEach(name => selectRowForFile(name)) + + cy.get('.files-list__selected').should('have.text', `${randomFiles.length} selected`) + cy.get('[data-cy-files-list-row-checkbox] input[type="checkbox"]:checked').should('have.length', randomFiles.length) + }) + + it('Can select range of files with shift key', () => { + cy.get('[data-cy-files-list-row-checkbox]').should('have.length', filesCount) + selectRowForFile('audio.mp3') + cy.window().trigger('keydown', { shiftKey: true }) + selectRowForFile('readme.md', { shiftKey: true }) + cy.window().trigger('keyup', { shiftKey: false }) + + cy.get('.files-list__selected').should('have.text', '4 selected') + cy.get('[data-cy-files-list-row-checkbox] input[type="checkbox"]:checked').should('have.length', 4) + + }) +}) diff --git a/cypress/e2e/files/files_sorting.cy.ts b/cypress/e2e/files/files-sorting.cy.ts similarity index 100% rename from cypress/e2e/files/files_sorting.cy.ts rename to cypress/e2e/files/files-sorting.cy.ts