Add e2e test for Glofas stations

tests/e2e/Pages/MapComponent.ts

@@ -285,5 +285,30 @@ class MapComponent extends DashboardPage {
       await expect(layer.nth(nthSelector)).toBeVisible();
     }
   }
+
+  async gloFASMarkersAreVisibleByWarning({
+    glosfasStationStatus,
+    isVisible,
+  }: {
+    glosfasStationStatus: string;
+    isVisible: boolean;
+  }) {
+    // Select from: ""glofas-station-max-trigger", "glofas-station-med-trigger", "glofas-station-min-trigger"
+    // We don't have specyfic selectors for each of the markers, so we need have to use src as a selector which is not ideal
+    const glofasMarker = this.page.locator(
+      `img[src="assets/markers/${glosfasStationStatus}.svg"][alt="Glofas stations"]`,
+    );
+
+    if (isVisible) {
+      const markersCount = await glofasMarker.count();
+      const nthSelector = this.getRandomInt(0, markersCount - 1);
+
+      expect(markersCount).toBeGreaterThan(0);
+      await expect(glofasMarker.nth(nthSelector)).toBeVisible();
+    } else {
+      // Assert that no markers are visible
+      expect(await glofasMarker.count()).toBe(0);
+    }
+  }
 }
 export default MapComponent;

tests/e2e/tests/Map/AssertNoMaxWarningGlofasMarkersVisible.spec.ts

@@ -0,0 +1,64 @@
+import { test } from '@playwright/test';
+import DashboardPage from 'Pages/DashboardPage';
+import MapComponent from 'Pages/MapComponent';
+import UserStateComponent from 'Pages/UserStateComponent';
+import { qase } from 'playwright-qase-reporter';
+import { NoTriggerDataSet } from 'testData/testData.enum';
+
+import { FloodsScenario } from '../../../../services/API-service/src/scripts/enum/mock-scenario.enum';
+import {
+  getAccessToken,
+  mockFloods,
+  resetDB,
+} from '../../helpers/utility.helper';
+import LoginPage from '../../Pages/LoginPage';
+
+let accessToken: string;
+
+test.beforeEach(async ({ page }) => {
+  // Login
+  const loginPage = new LoginPage(page);
+  accessToken = await getAccessToken();
+  await resetDB(accessToken);
+
+  // We should maybe create one mock for all different disaster types for now we can just use floods
+  await mockFloods(
+    FloodsScenario.NoTrigger,
+    NoTriggerDataSet.CountryCode,
+    accessToken,
+  );
+
+  await page.goto('/');
+  await loginPage.login(
+    NoTriggerDataSet.UserMail,
+    NoTriggerDataSet.UserPassword,
+  );
+});
+
+test(
+  qase(
+    31,
+    '[No-trigger] ONLY No trigger, medium warning, and low warning GloFAS stations should be visible',
+  ),
+  async ({ page }) => {
+    const dashboard = new DashboardPage(page);
+    const userState = new UserStateComponent(page);
+    const map = new MapComponent(page);
+
+    // Navigate to disaster type the data was mocked for
+    await dashboard.navigateToFloodDisasterType();
+    // Assertions
+    await userState.headerComponentIsVisible({
+      countryName: NoTriggerDataSet.CountryName,
+    });
+    // Wait for the page to load
+    await dashboard.waitForLoaderToDisappear();
+    await map.mapComponentIsVisible();
+    await map.gloFASMarkersAreVisible();
+    // Assert that the max warning GloFAS markers are not visible
+    await map.gloFASMarkersAreVisibleByWarning({
+      glosfasStationStatus: 'glofas-station-max-trigger',
+      isVisible: false,
+    });
+  },
+);