From 09be17f42aaf9a0b0be1551e10688bcf5adc40f0 Mon Sep 17 00:00:00 2001
From: maymanaf <med.aymen.naf@gmail.com>
Date: Mon, 1 Jul 2024 13:36:59 +0200
Subject: [PATCH] fixup! front: add e2e tests search and filter rolling stock

---
 front/playwright.config.ts                    |  4 +-
 .../RollingStockEditorButtons.tsx             |  6 +-
 .../RollingStockEditorFormModal.tsx           |  4 +-
 .../SearchRollingStock.tsx                    |  2 +-
 front/tests/009-rollingstock-editor.spec.ts   | 79 +++++++++++++++++--
 .../pages/rollingstock-editor-page-model.ts   |  1 +
 6 files changed, 80 insertions(+), 16 deletions(-)

diff --git a/front/playwright.config.ts b/front/playwright.config.ts
index 3ae73e059e4..43f3703555f 100644
--- a/front/playwright.config.ts
+++ b/front/playwright.config.ts
@@ -12,7 +12,7 @@ export default defineConfig({
   testDir: './tests',
 
   /* Maximum time one test can run for. */
-  timeout: 50 * 1000,
+  timeout: 60 * 1000,
   expect: {
     /**
      * Maximum time expect() should wait for the condition to be met.
@@ -27,7 +27,7 @@ export default defineConfig({
   /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
   /* Retry on CI only */
-  retries: process.env.CI ? 2 : 0,
+  retries: process.env.CI ? 3 : 0,
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
diff --git a/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorButtons.tsx b/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorButtons.tsx
index 8c5ef0903ea..9795a41f7e3 100644
--- a/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorButtons.tsx
+++ b/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorButtons.tsx
@@ -111,7 +111,7 @@ const RollingStockEditorButtons = ({
       })}
     >
       <button
-        data-testId="rollingstock-edit-button"
+        data-testid="rollingstock-edit-button"
         type="button"
         className="btn btn-primary bg-orange px-1 py-0"
         aria-label={t('translation:common.edit')}
@@ -123,7 +123,7 @@ const RollingStockEditorButtons = ({
         <Pencil />
       </button>
       <button
-        data-testId="rollingstock-duplicate-button"
+        data-testid="rollingstock-duplicate-button"
         type="button"
         className="btn btn-primary px-1 py-0"
         aria-label={t('translation:common.duplicate')}
@@ -134,7 +134,7 @@ const RollingStockEditorButtons = ({
         <Duplicate />
       </button>
       <button
-        data-testId="rollingstock-delete-button"
+        data-testid="rollingstock-delete-button"
         type="button"
         className="btn btn-primary bg-red px-1 py-0"
         aria-label={t('translation:common.delete')}
diff --git a/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorFormModal.tsx b/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorFormModal.tsx
index 33f42add78b..c5ecd31d36a 100644
--- a/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorFormModal.tsx
+++ b/front/src/modules/rollingStock/components/RollingStockEditor/RollingStockEditorFormModal.tsx
@@ -58,7 +58,7 @@ const RollingStockEditorFormModal = ({
       )}
       <div className="d-flex justify-content-end w-100">
         <button
-          data-testId="confirm-modal-button-no"
+          data-testid="confirm-modal-button-no"
           type="button"
           className="btn btn-sm btn-primary-gray"
           onClick={() => closeModal()}
@@ -67,7 +67,7 @@ const RollingStockEditorFormModal = ({
         </button>
         {!errorObject && (
           <button
-            data-testId="confirm-modal-button-yes"
+            data-testid="confirm-modal-button-yes"
             type="button"
             className={`btn btn-sm ${deleteAction ? 'bg-red text-white' : 'btn-primary'} ml-3`}
             onClick={() => {
diff --git a/front/src/modules/rollingStock/components/RollingStockSelector/SearchRollingStock.tsx b/front/src/modules/rollingStock/components/RollingStockSelector/SearchRollingStock.tsx
index edc2d2e7d7a..2d60acadf51 100644
--- a/front/src/modules/rollingStock/components/RollingStockSelector/SearchRollingStock.tsx
+++ b/front/src/modules/rollingStock/components/RollingStockSelector/SearchRollingStock.tsx
@@ -114,7 +114,7 @@ const SearchRollingStock = ({
         </div>
       </div>
       <div className="col-md-2 mt-1 ml-auto">
-        <small data-testId="search-results-text">
+        <small data-testid="search-results-text">
           {filteredRollingStockList.length > 0
             ? `${filteredRollingStockList.length} ${t('resultsFound')}`
             : t('noResultFound')}
diff --git a/front/tests/009-rollingstock-editor.spec.ts b/front/tests/009-rollingstock-editor.spec.ts
index 7e299bb8824..0f94d68b0d5 100644
--- a/front/tests/009-rollingstock-editor.spec.ts
+++ b/front/tests/009-rollingstock-editor.spec.ts
@@ -198,12 +198,9 @@ test.describe('Rollingstock editor page', () => {
     ).toBeHidden();
   });
 
-  test('should correctly search and filter rolling stock', async ({ page }) => {
+  test('should correctly filter electric rolling stock', async ({ page }) => {
     const rollingStockEditorPage = new PlaywrightRollingstockEditorPage(page);
 
-    // Add a rolling stock via postAPI
-    await addRollingStock(thermalElectricRollingStockName, rollingStockJson);
-
     // Navigate to rolling stock editor page
     await rollingStockEditorPage.navigateToPage();
 
@@ -219,8 +216,26 @@ test.describe('Rollingstock editor page', () => {
       await rollingStockEditorPage.getRollingStockSearchNumber()
     );
 
-    // Perform a filtering action for thermal rolling stock
+    // Clear electric filter
     await rollingStockEditorPage.electricRollingStockFilter();
+
+    // Verify that the count of rolling stock is back to the initial number
+    expect(await rollingStockEditorPage.getRollingStockList.count()).toEqual(
+      initialRollingStockFoundNumber
+    );
+  });
+
+  test('should correctly filter thermal rolling stock', async ({ page }) => {
+    const rollingStockEditorPage = new PlaywrightRollingstockEditorPage(page);
+
+    // Navigate to rolling stock editor page
+    await rollingStockEditorPage.navigateToPage();
+
+    // Extract and check the initial count of rolling stock
+    const initialRollingStockFoundNumber =
+      await rollingStockEditorPage.getRollingStockSearchNumber();
+
+    // Perform a filtering action for thermal rolling stock
     await rollingStockEditorPage.themalRollingStockFilter();
 
     // Verify that filtering reduces the count and all the RS have thermal icons
@@ -228,14 +243,60 @@ test.describe('Rollingstock editor page', () => {
       await rollingStockEditorPage.getRollingStockSearchNumber()
     );
 
+    // Clear thermal filter
+    await rollingStockEditorPage.themalRollingStockFilter();
+
+    // Verify that the count of rolling stock is back to the initial number
+    expect(await rollingStockEditorPage.getRollingStockList.count()).toEqual(
+      initialRollingStockFoundNumber
+    );
+  });
+
+  test('should correctly filter thermal and electric rolling stock', async ({ page }) => {
+    const rollingStockEditorPage = new PlaywrightRollingstockEditorPage(page);
+
+    // Add a rolling stock via postAPI
+    await addRollingStock(thermalElectricRollingStockName, rollingStockJson);
+
+    // Navigate to rolling stock editor page
+    await rollingStockEditorPage.navigateToPage();
+
+    // Extract and check the initial count of rolling stock
+    const initialRollingStockFoundNumber =
+      await rollingStockEditorPage.getRollingStockSearchNumber();
+
     // Perform a filtering action for combined thermal-electric rolling stock
     await rollingStockEditorPage.electricRollingStockFilter();
+    await rollingStockEditorPage.themalRollingStockFilter();
 
     // Verify that filtering reduces the count and all the RS have thermal and electric icons
     expect(await rollingStockEditorPage.getThermalElectricRollingStockIcons.count()).toEqual(
       await rollingStockEditorPage.getRollingStockSearchNumber()
     );
 
+    // Clear filters
+    await rollingStockEditorPage.electricRollingStockFilter();
+    await rollingStockEditorPage.themalRollingStockFilter();
+
+    // Verify that the count of rolling stock is back to the initial number
+    expect(await rollingStockEditorPage.getRollingStockList.count()).toEqual(
+      initialRollingStockFoundNumber
+    );
+  });
+
+  test('should correctly search for a rolling stock', async ({ page }) => {
+    const rollingStockEditorPage = new PlaywrightRollingstockEditorPage(page);
+
+    // Add a rolling stock via postAPI
+    await addRollingStock(thermalElectricRollingStockName, rollingStockJson);
+
+    // Navigate to rolling stock editor page
+    await rollingStockEditorPage.navigateToPage();
+
+    // Extract and check the initial count of rolling stock
+    const initialRollingStockFoundNumber =
+      await rollingStockEditorPage.getRollingStockSearchNumber();
+
     // Search for the specific rolling stock
     await rollingStockEditorPage.searchRollingStock(thermalElectricRollingStockName);
     expect(
@@ -248,9 +309,7 @@ test.describe('Rollingstock editor page', () => {
     await expect(rollingStockEditorPage.getThermalRollingStockFirstIcon).toBeVisible();
     await expect(rollingStockEditorPage.getElectricRollingStockFirstIcon).toBeVisible();
 
-    // Clear filters and search
-    await rollingStockEditorPage.electricRollingStockFilter();
-    await rollingStockEditorPage.themalRollingStockFilter();
+    // Clear the search
     await rollingStockEditorPage.clearSearchRollingStock();
 
     // Verify that the count of rolling stock is back to the initial number
@@ -261,6 +320,10 @@ test.describe('Rollingstock editor page', () => {
     await rollingStockEditorPage.searchRollingStock(
       `${thermalElectricRollingStockName}-no-results`
     );
+
+    // Wait for the page to reach the network idle state
+    await rollingStockEditorPage.page.waitForLoadState('networkidle');
+
     // Verify that the count of rolling stock is 0 (No results Found)
     expect(await rollingStockEditorPage.getRollingStockSearchNumber()).toEqual(0);
   });
diff --git a/front/tests/pages/rollingstock-editor-page-model.ts b/front/tests/pages/rollingstock-editor-page-model.ts
index 4b4dea50716..6b7be2b9036 100644
--- a/front/tests/pages/rollingstock-editor-page-model.ts
+++ b/front/tests/pages/rollingstock-editor-page-model.ts
@@ -337,6 +337,7 @@ export default class PlaywrightRollingstockEditorPage extends PlaywrightCommonPa
     await this.getElectricRollingStockFilter.click();
   }
 
+  // Get the number of RS from the search result text
   async getRollingStockSearchNumber(): Promise<number> {
     return extractNumberFromString(await this.getRollingStockSearchResult.innerText());
   }