Fix playwright tests

playwright/pages/components/search.py

@@ -9,7 +9,7 @@ def __init__(self, page: Page):
 
         # Page locators
         self.search_field = page.get_by_test_id('input-with-suggester')
-        self.search_button = self.get_button(text='Search')
+        self.search_button = page.get_by_test_id('searchbar-search-button')
 
     def fill_search_text(self, search_text: str) -> None:
         """Fill up search text"""

playwright/pages/js_scripts/map_functions.js

@@ -6,8 +6,14 @@ function getMap() {
   return getTestProps().getMap();
 }
 
-function getHeatmapLayer() {
-  return getTestProps().getHeatmapLayer();
+function getMapLayer() {
+  if (getTestProps().getClusterLayer) {
+    return getTestProps().getClusterLayer();
+  } else if (getTestProps().getHeatmapLayer) {
+    return getTestProps().getHeatmapLayer();
+  } else {
+    throw new Error("No Map layer found");
+  }
 }
 
 function centerMap(lng, lat, zoom) {
@@ -23,24 +29,32 @@ function isMapLoaded() {
 
 function getMapLayers() {
   const map = getMap();
-  const layer = getHeatmapLayer();
+  const layer = getMapLayer();
   return map.queryRenderedFeatures({ layers: [layer] }).length;
 }
 
 function getAUMarineParksLayer() {
-  return getTestProps().getAUMarineParksLayer
-    ? getTestProps().getAUMarineParksLayer()
-    : "";
+  if (getTestProps().getAUMarineParksLayer) {
+    return getTestProps().getAUMarineParksLayer();
+  } else {
+    throw new Error("AU Marine Parks layer not found");
+  }
 }
 
 function getWorldBoundariesLayer() {
-  return getTestProps().getWorldBoundariesLayer
-    ? getTestProps().getWorldBoundariesLayer()
-    : "";
+  if (getTestProps().getWorldBoundariesLayer) {
+    return getTestProps().getWorldBoundariesLayer();
+  } else {
+    throw new Error("World Boundaries layer not found");
+  }
 }
 
 function getSpiderLayer() {
-  return getTestProps().getSpiderLayer ? getTestProps().getSpiderLayer() : "";
+  if (getTestProps().getSpiderLayer) {
+    return getTestProps().getSpiderLayer();
+  } else {
+    throw new Error("Spider layer not found");
+  }
 }
 
 function isMapLayerVisible(layerId) {
@@ -59,7 +73,7 @@ function findAndClickCluster() {
       [0, 0],
       [width, height],
     ],
-    { layers: ["cluster-count"] }
+    { layers: [getMapLayer()] }
   );
 
   if (clusters.length > 0) {

playwright/tests/detail_page/test_detail_page.py

@@ -12,9 +12,11 @@
         ('Integrated Marine Observing System (IMOS) - Location of assets'),
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because sometimes there is no scroll button if enough space for displaying all tabs")
 def test_tab_panel_scroll(page_mock: Page, title: str) -> None:
+    # Precondition: Tab panel should have scroll buttons
+    # Set a smaller browser window size to make the tabs scrollable
+    page_mock.set_viewport_size({'width': 1000, 'height': 800})
+
     landing_page = LandingPage(page_mock)
     search_page = SearchPage(page_mock)
     detail_page = DetailPage(page_mock)

playwright/tests/search_page/test_map.py

@@ -12,6 +12,7 @@
 from pages.landing_page import LandingPage
 from pages.search_page import SearchPage
 
+
 def test_map_drag_updates_search_results(page_mock: Page) -> None:
     api_router = ApiRouter(page=page_mock)
     landing_page = LandingPage(page_mock)
@@ -69,8 +70,6 @@ def test_map_datapoint_hover_and_click(
         ('imos', 'plankton'),
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because default layer changed to cluster layer")
 def test_map_updates_on_search_change(
     page_mock: Page, search_text: str, updated_search_text: str
 ) -> None:
@@ -111,8 +110,6 @@ def test_map_updates_on_search_change(
         ),
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
 def test_map_base_layers(
     page_mock: Page, layer_text: str, layer_type: LayerType
 ) -> None:
@@ -147,8 +144,6 @@ def test_map_base_layers(
         ),
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because default layer changed to cluster layer")
 def test_map_spider(
     page_mock: Page,
     head_lng: str,

playwright/tests/search_page/test_search.py

@@ -40,8 +40,6 @@ def test_basic_search(
     'sort_type',
     [SearchSortType.TITLE, SearchSortType.MODIFIED],
 )
-
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
 def test_search_result_sort(page_mock: Page, sort_type: SearchSortType) -> None:
     api_router = ApiRouter(page=page_mock)
     landing_page = LandingPage(page_mock)

playwright/tests/search_page/test_search_page.py

@@ -4,7 +4,7 @@
 from pages.landing_page import LandingPage
 from pages.search_page import SearchPage
 
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
+
 def test_map_expand_toggle(page_mock: Page) -> None:
     landing_page = LandingPage(page_mock)
     search_page = SearchPage(page_mock)
@@ -26,8 +26,6 @@ def test_map_expand_toggle(page_mock: Page) -> None:
         'Grid and Map',
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
 def test_grid_and_map_view(page_mock: Page, view_type: str) -> None:
     landing_page = LandingPage(page_mock)
     search_page = SearchPage(page_mock)
@@ -47,8 +45,6 @@ def test_grid_and_map_view(page_mock: Page, view_type: str) -> None:
         'Full Map View',
     ],
 )
-
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
 def test_full_map_view(page_mock: Page, view_type: str) -> None:
     landing_page = LandingPage(page_mock)
     search_page = SearchPage(page_mock)
@@ -73,9 +69,6 @@ def test_full_map_view(page_mock: Page, view_type: str) -> None:
         ),
     ],
 )
-
-
-@pytest.mark.skip(reason="Skipping this test because of timeout issue")
 def test_show_more_results(
     page_mock: Page,
     chunk_1_first_data: str,

src/components/common/test/helper.tsx

@@ -4,6 +4,7 @@ import { mergeWithDefaults } from "../../../utils/ObjectUtils";
 
 interface TestProps {
   getMap?: () => Map;
+  getClusterLayer?: () => string;
   getHeatmapLayer?: () => string;
   getAUMarineParksLayer?: () => string;
   getWorldBoundariesLayer?: () => string;

src/components/map/mapbox/layers/ClusterLayer.tsx

@@ -18,6 +18,7 @@ import {
 } from "./Layers";
 import SpatialExtents from "../component/SpatialExtents";
 import SpiderDiagram from "../component/SpiderDiagram";
+import { TestHelper } from "../../../common/test/helper";
 import { FeatureCollection, Point } from "geojson";
 import { MapDefaultConfig } from "../constants";
 import { mergeWithDefaults } from "../../../../utils/ObjectUtils";
@@ -299,6 +300,7 @@ const ClusterLayer: FC<ClusterLayerProps> = ({
         showFullMap={showFullMap}
         tabNavigation={tabNavigation}
       />
+      <TestHelper getHeatmapLayer={() => clusterLayer} />
     </>
   );
 };

src/components/search/SearchbarExpandableButton.tsx

@@ -56,6 +56,7 @@ const SearchbarExpandableButton: FC<SearchbarExpandableButtonProps> = ({
         }}
         startIcon={icon}
         onClick={onClick}
+        data-testid={`searchbar-${text.toLowerCase()}-button`}
       >
         {showText && text}
       </Button>