Dataview search e2e Tests

apps/web-mzima-client/src/app/feed/feed.component.html

@@ -212,7 +212,7 @@ <h3 class="menu-title">{{ 'app.mark_as' | translate }}</h3>
       [attr.data-qa]="'posts'"
     >
       <!-- No posts -->
-      <span *ngIf="!posts.length" class="posts-empty">
+      <span *ngIf="!posts.length" class="posts-empty" data-qa="posts-empty">
         <ng-container *ngIf="isDefaultFilters">
           <!-- No posts 1a: When there are no posts at all in the deployment or there no posts because none can be viewed by a user due to the permissions they have  -->
           <ng-container *ngIf="!userIsSearchingPostsByKeyword">

apps/web-mzima-client/src/app/shared/components/search-form/search-form.component.html

@@ -25,6 +25,7 @@
       class="search-form__form-control"
       [ngModelOptions]="{ standalone: true }"
       [placeholder]="'global_filter.search' | translate"
+      [data-qa]="'search-form-search-posts'"
     />
     <mzima-client-button
       matSuffix

apps/web-mzima-client/src/env.json

@@ -13,4 +13,4 @@
   "sentry_dsn": "",
   "sentry_environment": "",
   "sentry_debug_mode": false
-}
+}

e2e-testing/cypress.env.json

@@ -6,4 +6,4 @@
   "ush_user_email": "[email protected]",
   "ush_user_pwd": "1234567",
   "ush_user_name": "Automation User Member Role"
-}
+}

e2e-testing/cypress/e2e/12-data-view/data-view-search.cy.js

@@ -0,0 +1,34 @@
+import DataViewFunctions from '../../functions/DataViewFunctions/DataViewFunctions';
+import LoginFunctions from '../../functions/LoginFunctions';
+
+const dataViewFunctions = new DataViewFunctions();
+import PostFunctions from '../../functions/PostsFunctions/PostFunctions';
+
+describe('Search and Verify Posts', () => {
+  const loginFunctions = new LoginFunctions();
+  const postFunctions = new PostFunctions();
+
+  beforeEach(() => {
+    loginFunctions.login_as_admin();
+    cy.visit(Cypress.env('baseUrl'));
+  });
+
+  it('should display posts with the keyword in title or description', () => {
+    const searchKeyword = 'election';
+    dataViewFunctions.search_and_verify_results(searchKeyword);
+  });
+
+  it('should display an empty state when searching with special characters', () => {
+    const generateSpecialCharacterKeyword = () => {
+      const specialChars = '!@#$%^&*()_+-=[]{};\':"\\|,.<>/?`~';
+      let keyword = '';
+      const length = Math.floor(Math.random() * 10) + 1;
+      for (let i = 0; i < length; i++) {
+        keyword += specialChars[Math.floor(Math.random() * specialChars.length)];
+      }
+      return keyword;
+    };
+    const specialCharKeyword = generateSpecialCharacterKeyword();
+    dataViewFunctions.search_and_verify_results_with_special_characters(specialCharKeyword);
+  });
+});

e2e-testing/cypress/functions/DataViewFunctions/DataViewFunctions.js

@@ -1,29 +1,68 @@
+/// <reference types="Cypress" />
+
 import DataViewLocators from '../../locators/DataViewLocators';
 import LoginFunctions from '../LoginFunctions';
+import PostLocators from '../../locators/PostsLocators/PostLocators';
 
 const loginFunctions = new LoginFunctions();
 
 class DataViewFunctions {
+  constructor() {
+    this.postTitle = `The elections`;
+    this.postDescription = 'This is a post about the ongoing elections';
+  }
+  open_post_creation_form() {
+    cy.get(PostLocators.addPostBtn).click();
+    cy.get(PostLocators.srvyItemBtn2).click();
+  }
+  type_post_title(title) {
+    cy.get(PostLocators.titleField).eq(0).type(title).should('have.value', title);
+  }
+
+  type_post_description(description) {
+    cy.get(PostLocators.descField).type(description).should('have.value', description);
+  }
+  fill_required_form_fields() {
+    this.type_post_title(this.postTitle);
+    this.type_post_description(this.postDescription);
+  }
+
+  complete_add_post_steps() {
+    cy.get(PostLocators.submitBtn).should('not.be.disabled');
+    cy.get(PostLocators.submitBtn).click();
+    cy.get(PostLocators.successButton).click();
+  }
+
   click_data_view_btn() {
-    cy.get(DataViewLocators.dataViewBtn).click();
+    cy.get(DataViewLocators.dataViewBtn).should('be.visible').click({ force: true });
     cy.url().should('include', '/feed');
   }
-
-  verify_post_appears_for_user() {
+  search_and_verify_results(keyword) {
+    this.open_post_creation_form();
+    this.fill_required_form_fields();
+    this.complete_add_post_steps();
     this.click_data_view_btn();
-    //check post appears for admin user
-    cy.get(DataViewLocators.postPreview)
-      .children(DataViewLocators.postItem)
-      .contains('Automated Title Response')
-      .click();
-    cy.get(DataViewLocators.postMenuDots).eq(0).click();
-    cy.get(DataViewLocators.publishPostBtn).click();
-    loginFunctions.logout();
-    //check post appears for non logged in user
+    cy.get(DataViewLocators.searchInput).clear({ force: true }).type(keyword, { force: true });
+    // Wait for the API request to fetch results
+    cy.intercept('GET', '**/api/v5/posts/stats*').as('searchResults');
+    cy.wait('@searchResults');
+    // Verify that results contain the keyword in the title or description
+    cy.get(DataViewLocators.postPreview).within(() => {
+      cy.get(DataViewLocators.postItem).each(($post) => {
+        cy.wrap($post)
+          .invoke('text')
+          .then((text) => {
+            expect(text.toLowerCase()).to.include(keyword.toLowerCase());
+          });
+      });
+    });
+  }
+  search_and_verify_results_with_special_characters(keyword) {
     this.click_data_view_btn();
-    cy.get(DataViewLocators.postPreview)
-      .children(DataViewLocators.postItem)
-      .contains('Automated Title Response');
+    cy.get(DataViewLocators.searchInput).clear({ force: true }).type(keyword, { force: true });
+    cy.get(DataViewLocators.postsEmptyMessage)
+      .should('be.visible')
+      .and('contain.text', 'No posts match your keyword search');
   }
 }
 

e2e-testing/cypress/locators/DataViewLocators.js

@@ -18,7 +18,8 @@ const DataViewLocators = {
   publishPostBtn: '[data-qa="btn-publish-post"]',
 
   postDetails: '[data-qa="post-details"]',
-
+  searchInput: '[data-qa="search-form-search-posts"]',
+  postsEmptyMessage: '[data-qa="posts-empty"]',
 };
 
 export default DataViewLocators;

e2e-testing/cypress/locators/PostsLocators/PostLocators.js

@@ -2,6 +2,7 @@ const PostLocators = {
   dataViewBtn: '[data-qa="btn-data"]',
   addPostBtn: '[data-qa="submit-post-button"]',
   srvyItemBtn: '[data-qa="add-post-modal-surveys-item125"]',
+  srvyItemBtn2: '[data-qa="add-post-modal-surveys-item766"]',
   successButton: '[data-qa="btn-confirm-success"]',
   submitBtn: '[data-qa="btn-post-item-submit"]',
   postPreview: '[data-qa="post-preview"]',
@@ -29,14 +30,14 @@ const PostLocators = {
   checkboxFieldOption3: '[data-qa="checkboxes-field-f3"]',
   relatedPostField: '[data-qa="related-post-field"]',
   embedVideoField: '[data-qa="embed-video field"]',
+  selectFieldForSearch: '[data-qa="nature-of-this-incident-bombings"]',
 
   //status items
   publishPostBtn: '[data-qa="btn-publish-post"]',
   postStatus: '[data-qa="status"]',
   underReviewPostBtn: '[data-qa="btn-underReview-post"]',
   archivePostBtn: '[data-qa="btn-archive-post"]',
 
-
   //field menu items
   postMenuDots: '[data-qa="post-menu"]',
   deletePostBtn: '[data-qa="btn-delete-post"]',