mirror of
https://github.com/nextcloud/server.git
synced 2024-12-29 00:18:42 +00:00
141 lines
4.5 KiB
TypeScript
141 lines
4.5 KiB
TypeScript
/**
|
|
* SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
|
|
* SPDX-License-Identifier: AGPL-3.0-or-later
|
|
*/
|
|
import { getRowForFile } from './FilesUtils.ts'
|
|
|
|
describe('files: Drag and Drop', { testIsolation: true }, () => {
|
|
beforeEach(() => {
|
|
cy.createRandomUser().then((user) => {
|
|
cy.login(user)
|
|
})
|
|
cy.visit('/apps/files')
|
|
})
|
|
|
|
it('can drop a file', () => {
|
|
const dataTransfer = new DataTransfer()
|
|
dataTransfer.items.add(new File([], 'single-file.txt'))
|
|
|
|
cy.intercept('PUT', /\/remote.php\/dav\/files\//).as('uploadFile')
|
|
|
|
// Make sure the drop notice is not visible
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
|
|
// Trigger the drop notice
|
|
cy.get('main.app-content').trigger('dragover', { dataTransfer })
|
|
cy.get('[data-cy-files-drag-drop-area]').should('be.visible')
|
|
|
|
// Upload drop a file
|
|
cy.get('[data-cy-files-drag-drop-area]').selectFile({
|
|
fileName: 'single-file.txt',
|
|
contents: ['hello '.repeat(1024)],
|
|
}, { action: 'drag-drop' })
|
|
|
|
cy.wait('@uploadFile')
|
|
|
|
// Make sure the upload is finished
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
cy.get('[data-cy-upload-picker] progress').should('not.be.visible')
|
|
cy.get('@uploadFile.all').should('have.length', 1)
|
|
|
|
getRowForFile('single-file.txt').should('be.visible')
|
|
getRowForFile('single-file.txt').find('[data-cy-files-list-row-size]').should('contain', '6 KB')
|
|
})
|
|
|
|
it('can drop multiple files', () => {
|
|
const dataTransfer = new DataTransfer()
|
|
dataTransfer.items.add(new File([], 'first.txt'))
|
|
dataTransfer.items.add(new File([], 'second.txt'))
|
|
|
|
cy.intercept('PUT', /\/remote.php\/dav\/files\//).as('uploadFile')
|
|
|
|
// Make sure the drop notice is not visible
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
|
|
// Trigger the drop notice
|
|
cy.get('main.app-content').trigger('dragover', { dataTransfer })
|
|
cy.get('[data-cy-files-drag-drop-area]').should('be.visible')
|
|
|
|
// Upload drop a file
|
|
cy.get('[data-cy-files-drag-drop-area]').selectFile([
|
|
{
|
|
fileName: 'first.txt',
|
|
contents: ['Hello'],
|
|
},
|
|
{
|
|
fileName: 'second.txt',
|
|
contents: ['World'],
|
|
},
|
|
], { action: 'drag-drop' })
|
|
|
|
cy.wait('@uploadFile')
|
|
|
|
// Make sure the upload is finished
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
cy.get('[data-cy-upload-picker] progress').should('not.be.visible')
|
|
cy.get('@uploadFile.all').should('have.length', 2)
|
|
|
|
getRowForFile('first.txt').should('be.visible')
|
|
getRowForFile('second.txt').should('be.visible')
|
|
})
|
|
|
|
it('will ignore legacy Folders', () => {
|
|
cy.window().then((win) => {
|
|
// Remove the Filesystem API to force the legacy File API
|
|
// See how cypress mocks the Filesystem API in https://github.com/cypress-io/cypress/blob/74109094a92df3bef073dda15f17194f31850d7d/packages/driver/src/cy/commands/actions/selectFile.ts#L24-L37
|
|
Object.defineProperty(win.DataTransferItem.prototype, 'getAsEntry', { get: undefined })
|
|
Object.defineProperty(win.DataTransferItem.prototype, 'webkitGetAsEntry', { get: undefined })
|
|
})
|
|
|
|
const dataTransfer = new DataTransfer()
|
|
dataTransfer.items.add(new File([], 'first.txt'))
|
|
dataTransfer.items.add(new File([], 'second.txt'))
|
|
|
|
// Legacy File API (not FileSystem API), will treat Folders as Files
|
|
// with empty type and empty content
|
|
dataTransfer.items.add(new File([], 'Foo', { type: 'httpd/unix-directory' }))
|
|
dataTransfer.items.add(new File([], 'Bar'))
|
|
|
|
cy.intercept('PUT', /\/remote.php\/dav\/files\//).as('uploadFile')
|
|
|
|
// Make sure the drop notice is not visible
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
|
|
// Trigger the drop notice
|
|
cy.get('main.app-content').trigger('dragover', { dataTransfer })
|
|
cy.get('[data-cy-files-drag-drop-area]').should('be.visible')
|
|
|
|
// Upload drop a file
|
|
cy.get('[data-cy-files-drag-drop-area]').selectFile([
|
|
{
|
|
fileName: 'first.txt',
|
|
contents: ['Hello'],
|
|
},
|
|
{
|
|
fileName: 'second.txt',
|
|
contents: ['World'],
|
|
},
|
|
{
|
|
fileName: 'Foo',
|
|
contents: {},
|
|
},
|
|
{
|
|
fileName: 'Bar',
|
|
contents: { mimeType: 'httpd/unix-directory' },
|
|
},
|
|
], { action: 'drag-drop' })
|
|
|
|
cy.wait('@uploadFile')
|
|
|
|
// Make sure the upload is finished
|
|
cy.get('[data-cy-files-drag-drop-area]').should('not.be.visible')
|
|
cy.get('[data-cy-upload-picker] progress').should('not.be.visible')
|
|
cy.get('@uploadFile.all').should('have.length', 2)
|
|
|
|
getRowForFile('first.txt').should('be.visible')
|
|
getRowForFile('second.txt').should('be.visible')
|
|
getRowForFile('Foo').should('not.exist')
|
|
getRowForFile('Bar').should('not.exist')
|
|
})
|
|
})
|