✅ Adding e2e tests

n8n-io · Feb 17, 2025 · e2c4034 · e2c4034
1 parent 1792fb4
commit e2c4034
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 0 deletions.
diff --git a/cypress/e2e/1-workflows.cy.ts b/cypress/e2e/1-workflows.cy.ts
@@ -97,4 +97,45 @@ describe('Workflows', () => {
 
 		WorkflowsPage.getters.workflowCards().should('have.length', 1);
 	});
+
+	it('should preserve filters and pagination in URL', () => {
+		// Add a search query
+		WorkflowsPage.getters.searchBar().type('My');
+		// Add a tag filter
+		WorkflowsPage.getters.workflowFilterButton().click();
+		WorkflowsPage.getters.workflowTagsDropdown().click();
+		WorkflowsPage.getters.workflowTagItem('other-tag-1').click();
+		WorkflowsPage.getters.workflowsListContainer().click();
+		// Update sort order
+		WorkflowsPage.getters.workflowSortDropdown().click();
+		WorkflowsPage.getters.workflowSortItem('Sort by last created').click({ force: true });
+		// Update page size
+		WorkflowsPage.getters.workflowListPageSizeDropdown().click();
+		WorkflowsPage.getters.workflowListPageSizeItem('25').click();
+
+		// URL should contain all applied filters and pagination
+		cy.url().should('include', 'search=My');
+		// Cannot really know tag id, so just check if it contains 'tags='
+		cy.url().should('include', 'tags=');
+		cy.url().should('include', 'sort=lastCreated');
+		cy.url().should('include', 'pageSize=25');
+
+		// Reload the page
+		cy.reload();
+		// Check if filters and pagination are preserved
+		WorkflowsPage.getters.searchBar().should('have.value', 'My');
+		WorkflowsPage.getters.workflowFilterButton().click();
+		WorkflowsPage.getters.workflowTagsDropdown().should('contain.text', 'other-tag-1');
+		WorkflowsPage.getters
+			.workflowSortItem('Sort by last created')
+			.should('have.attr', 'aria-selected', 'true');
+		WorkflowsPage.getters
+			.workflowListPageSizeItem('25', false)
+			.should('have.attr', 'aria-selected', 'true');
+		// Aso, check if the URL is preserved
+		cy.url().should('include', 'search=My');
+		cy.url().should('include', 'tags=');
+		cy.url().should('include', 'sort=lastCreated');
+		cy.url().should('include', 'pageSize=25');
+	});
 });
diff --git a/cypress/pages/workflows.ts b/cypress/pages/workflows.ts
@@ -47,6 +47,18 @@ export class WorkflowsPage extends BasePage {
 		workflowOwnershipDropdown: () => cy.getByTestId('user-select-trigger'),
 		workflowOwner: (email: string) => cy.getByTestId('user-email').contains(email),
 		workflowResetFilters: () => cy.getByTestId('workflows-filter-reset'),
+		workflowSortDropdown: () => cy.getByTestId('resources-list-sort'),
+		workflowSortItem: (sort: string) =>
+			cy.getByTestId('resources-list-sort-item').contains(sort).parent(),
+		workflowPagination: () => cy.getByTestId('resources-list-pagination'),
+		workflowListPageSizeDropdown: () => this.getters.workflowPagination().find('.select-trigger'),
+		workflowListPageSizeItem: (pageSize: string, visible: boolean = true) => {
+			if (visible) {
+				return cy.get('[role=option]').filter(':visible').contains(`${pageSize}/page`);
+			}
+			return cy.get('[role=option]').contains(`${pageSize}/page`).parent();
+		},
+		workflowsListContainer: () => cy.getByTestId('resources-list-wrapper'),
 		// Not yet implemented
 		// myWorkflows: () => cy.getByTestId('my-workflows'),
 		// allWorkflows: () => cy.getByTestId('all-workflows'),

diff --git a/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue b/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue
@@ -557,6 +557,7 @@ const loadPaginationFromQueryString = async () => {
 				<div
 					v-else-if="filteredAndSortedResources.length > 0"
 					ref="listWrapperRef"
+					data-test-id="resources-list-wrapper"
 					:class="$style.listWrapper"
 				>
 					<!-- FULL SCROLLING LIST (Shows all resources, filtering and sorting is done in this component) -->
@@ -588,6 +589,7 @@ const loadPaginationFromQueryString = async () => {
 								:total="totalItems"
 								:page-sizes="availablePageSizeOptions"
 								layout="total, prev, pager, next, sizes"
+								data-test-id="resources-list-pagination"
 								@update:current-page="setCurrentPage"
 								@size-change="setRowsPerPage"
 							></el-pagination>