Add E2E for Custom Results Feature

10up · Jul 4, 2022 · 63b6d34 · 63b6d34
1 parent 73fb6fe
commit 63b6d34
Show file tree

Hide file tree

Showing 2 changed files with 124 additions and 0 deletions.
diff --git a/tests/cypress/integration/features/custom-results.spec.js b/tests/cypress/integration/features/custom-results.spec.js
@@ -0,0 +1,77 @@
+describe('Custom Results', () => {
+	after(() => {
+		cy.login();
+		cy.visitAdminPage('edit.php?post_type=ep-pointer');
+		cy.get('#cb-select-all-1').click();
+		cy.get('#bulk-action-selector-top').select('trash');
+		cy.get('#doaction').click();
+
+		cy.visitAdminPage('edit.php?post_status=trash&post_type=ep-pointer');
+		cy.get('.tablenav.top #delete_all').click();
+	});
+
+	it('Can change post position and verify the result on search', () => {
+		const searchResult = [];
+		const searchTerm = 'Feature';
+
+		cy.login();
+		cy.visitAdminPage('post-new.php?post_type=ep-pointer');
+		cy.intercept('GET', 'wp-json/elasticpress/v1/pointer_preview*').as('ajaxRequest');
+
+		cy.get('#titlewrap input').type(searchTerm);
+		cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);
+
+		cy.dragAndDrop(
+			'.pointers .pointer:first-of-type .dashicons-menu',
+			'.pointers .pointer:last-of-type .dashicons-menu',
+		).then(() => {
+			cy.get('.pointers .pointer .title').each((post) => {
+				cy.wrap(post)
+					.invoke('text')
+					.then((text) => searchResult.push(text));
+			});
+			cy.get('#publish').click();
+		});
+
+		cy.visit(`?s=${searchTerm}`);
+
+		cy.get('article .entry-title').each((post, index) => {
+			cy.wrap(post).invoke('text').should('eq', searchResult[index]);
+		});
+	});
+
+	it('Can add the post in result and verify the result on search', () => {
+		const searchResult = [];
+		const searchTerm = 'Fantastic';
+
+		cy.login();
+
+		cy.activatePlugin('woocommerce');
+		cy.maybeEnableFeature('woocommerce');
+
+		cy.visitAdminPage('post-new.php?post_type=ep-pointer');
+		cy.intercept('GET', 'wp-json/elasticpress/v1/pointer_preview*').as('ajaxRequest');
+
+		cy.get('#titlewrap input').type(searchTerm);
+		cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);
+
+		cy.intercept('GET', 'wp-json/elasticpress/v1/pointer_search*').as('ajaxRequest');
+		cy.get('.search-pointers').type('Small Aluminum Wallet');
+		cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);
+
+		cy.get('.dashicons-plus.add-pointer').click();
+		cy.get('.pointers .pointer .title').each((post) => {
+			cy.wrap(post)
+				.invoke('text')
+				.then((text) => searchResult.push(text));
+		});
+
+		cy.get('#publish').click();
+
+		cy.visit(`?s=${searchTerm}`);
+
+		cy.get('article .entry-title').each((post, index) => {
+			cy.wrap(post).invoke('text').should('eq', searchResult[index]);
+		});
+	});
+});
diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js
@@ -289,3 +289,50 @@ Cypress.Commands.add('deactivatePlugin', (slug, method = 'dashboard', mode = 'si
 	}
 	cy.wpCli(command);
 });
+
+// Command to drag and drop React DnD element. Original code from: https://github.com/cypress-io/cypress/issues/3942#issuecomment-485648100
+Cypress.Commands.add('dragAndDrop', (subject, target) => {
+	Cypress.log({
+		name: 'DRAGNDROP',
+		message: `Dragging element ${subject} to ${target}`,
+		consoleProps: () => {
+			return {
+				subject,
+				target,
+			};
+		},
+	});
+	const BUTTON_INDEX = 0;
+	const SLOPPY_CLICK_THRESHOLD = 10;
+	cy.get(target)
+		.first()
+		.then(($target) => {
+			const coordsDrop = $target[0].getBoundingClientRect();
+			cy.get(subject)
+				.first()
+				.then((subject) => {
+					const coordsDrag = subject[0].getBoundingClientRect();
+					cy.wrap(subject)
+						.trigger('mousedown', {
+							button: BUTTON_INDEX,
+							clientX: coordsDrag.x,
+							clientY: coordsDrag.y,
+							force: true,
+						})
+						.trigger('mousemove', {
+							button: BUTTON_INDEX,
+							clientX: coordsDrag.x + SLOPPY_CLICK_THRESHOLD,
+							clientY: coordsDrag.y,
+							force: true,
+						});
+					cy.get('body')
+						.trigger('mousemove', {
+							button: BUTTON_INDEX,
+							clientX: coordsDrop.x,
+							clientY: coordsDrop.y,
+							force: true,
+						})
+						.trigger('mouseup');
+				});
+		});
+});