test: Add cypress tests for file list filtering

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

2 files changed, 231 insertions, 90 deletions

diff --git a/cypress/e2e/files/files-filtering.cy.ts b/cypress/e2e/files/files-filtering.cy.ts
new file mode 100644
index 00000000000..c7b147d4a9c
--- /dev/null
+++ b/cypress/e2e/files/files-filtering.cy.ts
@@ -0,0 +1,231 @@
+/**
+ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import type { User } from '@nextcloud/cypress'
+import { getRowForFile, navigateToFolder } from './FilesUtils'
+import { FilesNavigationPage } from '../../pages/FilesNavigation'
+import { FilesFilterPage } from '../../pages/FilesFilters'
+
+describe('files: Filter in files list', { testIsolation: true }, () => {
+	const appNavigation = new FilesNavigationPage()
+	const filesFilters = new FilesFilterPage()
+	let user: User
+
+	beforeEach(() => cy.createRandomUser().then(($user) => {
+		user = $user
+
+		cy.mkdir(user, '/folder')
+		cy.uploadContent(user, new Blob([]), 'text/plain', '/file.txt')
+		cy.uploadContent(user, new Blob([]), 'text/csv', '/spreadsheet.csv')
+		cy.uploadContent(user, new Blob([]), 'text/plain', '/folder/text.txt')
+		cy.login(user)
+		cy.visit('/apps/files')
+	}))
+
+	it('filters current view by name', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		// Set up a search query
+		appNavigation.searchInput()
+			.type('folder')
+
+		// See that only the folder is visible
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+		getRowForFile('spreadsheet.csv').should('not.exist')
+	})
+
+	it('can reset name filter', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		// Set up a search query
+		appNavigation.searchInput()
+			.type('folder')
+
+		// See that only the folder is visible
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+
+		// reset the filter
+		appNavigation.searchInput().should('have.value', 'folder')
+		appNavigation.searchClearButton().should('exist').click()
+		appNavigation.searchInput().should('have.value', '')
+
+		// All are visible again
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+	})
+
+	it('filters current view by type', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+		getRowForFile('spreadsheet.csv').should('be.visible')
+
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+		cy.findByRole('menuitemcheckbox', { name: 'Spreadsheets' })
+			.should('be.visible')
+			.click()
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+
+		// See that only the spreadsheet is visible
+		getRowForFile('spreadsheet.csv').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+		getRowForFile('folder').should('not.exist')
+	})
+
+	it('can reset filter by type', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+		cy.findByRole('menuitemcheckbox', { name: 'Spreadsheets' })
+			.should('be.visible')
+			.click()
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+
+		// See folder is not visible
+		getRowForFile('folder').should('not.exist')
+
+		// clear filter
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+		cy.findByRole('menuitem', { name: /clear filter/i })
+			.should('be.visible')
+			.click()
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+
+		// See folder is visible again
+		getRowForFile('folder').should('be.visible')
+	})
+
+	it('can reset filter by clicking chip button', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+		cy.findByRole('menuitemcheckbox', { name: 'Spreadsheets' })
+			.should('be.visible')
+			.click()
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+
+		// See folder is not visible
+		getRowForFile('folder').should('not.exist')
+
+		// clear filter
+		filesFilters.removeFilter('Spreadsheets')
+
+		// See folder is visible again
+		getRowForFile('folder').should('be.visible')
+	})
+
+	it('keeps name filter when changing the directory', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		// Set up a search query
+		appNavigation.searchInput()
+			.type('folder')
+
+		// See that only the folder is visible
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+
+		// go to that folder
+		navigateToFolder('folder')
+
+		// see that the folder is also filtered
+		getRowForFile('text.txt').should('not.exist')
+	})
+
+	it('keeps type filter when changing the directory', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.should('be.visible')
+			.click()
+		cy.findByRole('menuitemcheckbox', { name: 'Folders' })
+			.should('be.visible')
+			.click()
+		filesFilters.filterContainter()
+			.findByRole('button', { name: 'Type' })
+			.click()
+
+		// See that only the folder is visible
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+
+		// see filter is active
+		filesFilters.activeFilters().contains(/Folder/).should('be.visible')
+
+		// go to that folder
+		navigateToFolder('folder')
+
+		// see filter is still active
+		filesFilters.activeFilters().contains(/Folder/).should('be.visible')
+
+		// see that the folder is filtered
+		getRowForFile('text.txt').should('not.exist')
+	})
+
+	it('resets filter when changing the view', () => {
+		// All are visible by default
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		// Set up a search query
+		appNavigation.searchInput()
+			.type('folder')
+
+		// See that only the folder is visible
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('not.exist')
+
+		// go to other view
+		appNavigation.views()
+			.findByRole('link', { name: /Personal Files/i })
+			.click()
+		// wait for view changed
+		cy.url().should('match', /apps\/files\/personal/)
+
+		// see that the folder is not filtered
+		getRowForFile('folder').should('be.visible')
+		getRowForFile('file.txt').should('be.visible')
+
+		// see the filter bar is gone
+		appNavigation.searchInput().should('have.value', '')
+	})
+})
diff --git a/cypress/e2e/files/files-searching.cy.ts b/cypress/e2e/files/files-searching.cy.ts
deleted file mode 100644
index 10ca1b44e2f..00000000000
--- a/cypress/e2e/files/files-searching.cy.ts
+++ /dev/null
@@ -1,90 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-
-import type { User } from '@nextcloud/cypress'
-import { getRowForFile, navigateToFolder } from './FilesUtils'
-import { UnifiedSearchPage } from '../../pages/UnifiedSearch.ts'
-
-describe('files: Search and filter in files list', { testIsolation: true }, () => {
-	const unifiedSearch = new UnifiedSearchPage()
-	let user: User
-
-	beforeEach(() => cy.createRandomUser().then(($user) => {
-		user = $user
-
-		cy.mkdir(user, '/a folder')
-		cy.uploadContent(user, new Blob([]), 'text/plain', '/b file')
-		cy.uploadContent(user, new Blob([]), 'text/plain', '/a folder/c file')
-		cy.login(user)
-		cy.visit('/apps/files')
-	}))
-
-	it('files app supports local search', () => {
-		unifiedSearch.openLocalSearch()
-		unifiedSearch.localSearchInput()
-			.should('not.have.css', 'display', 'none')
-			.and('not.be.disabled')
-	})
-
-	it('filters current view', () => {
-		// All are visible by default
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('be.visible')
-
-		// Set up a search query
-		unifiedSearch.openLocalSearch()
-		unifiedSearch.typeLocalSearch('a folder')
-
-		// See that only the folder is visible
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('not.exist')
-	})
-
-	it('resets filter when changeing the directory', () => {
-		// All are visible by default
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('be.visible')
-
-		// Set up a search query
-		unifiedSearch.openLocalSearch()
-		unifiedSearch.typeLocalSearch('a folder')
-
-		// See that only the folder is visible
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('not.exist')
-
-		// go to that folder
-		navigateToFolder('a folder')
-
-		// see that the folder is not filtered
-		getRowForFile('c file').should('be.visible')
-	})
-
-	it('resets filter when changeing the view', () => {
-		// All are visible by default
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('be.visible')
-
-		// Set up a search query
-		unifiedSearch.openLocalSearch()
-		unifiedSearch.typeLocalSearch('a folder')
-
-		// See that only the folder is visible
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('not.exist')
-
-		// go to other view
-		cy.get('[data-cy-files-navigation-item="personal"] a').click({ force: true })
-		// wait for view changed
-		cy.url().should('match', /apps\/files\/personal/)
-
-		// see that the folder is not filtered
-		getRowForFile('a folder').should('be.visible')
-		getRowForFile('b file').should('be.visible')
-
-		// see the filter bar is gone
-		unifiedSearch.localSearchInput().should('not.exist')
-	})
-})