From 14b32db8eced54726aa9d2e7d947b506b0af724e Mon Sep 17 00:00:00 2001
From: dominik-zeglen <flesz3@o2.pl>
Date: Wed, 9 Sep 2020 13:15:18 +0200
Subject: [PATCH] Fix test selectors

---
 cypress/elements/account/left-menu/left-menu-selectors.js | 2 +-
 cypress/integration/warehouse.js                          | 2 +-
 src/components/SideBar/MenuItem.tsx                       | 8 +++++---
 src/configuration/ConfigurationPage.tsx                   | 2 +-
 src/warehouses/components/WarehouseList/WarehouseList.tsx | 2 +-
 5 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/cypress/elements/account/left-menu/left-menu-selectors.js b/cypress/elements/account/left-menu/left-menu-selectors.js
index 453e686ca..fb525ee06 100644
--- a/cypress/elements/account/left-menu/left-menu-selectors.js
+++ b/cypress/elements/account/left-menu/left-menu-selectors.js
@@ -1,4 +1,4 @@
 /* eslint-disable sort-keys */
 export const LEFT_MENU_SELECTORS = {
-  catalog: "[data-testid='catalogue']"
+  catalog: "[data-test-id='catalogue']"
 };
diff --git a/cypress/integration/warehouse.js b/cypress/integration/warehouse.js
index 7ed06c295..208321164 100644
--- a/cypress/integration/warehouse.js
+++ b/cypress/integration/warehouse.js
@@ -7,7 +7,7 @@ describe("Warehouse settings", () => {
   xit("Warehouse section visible in the configuration", () => {
     cy.visit("/configuration/")
       .loginUser()
-      .get("[data-testid=warehouses][data-test=settingsSubsection]")
+      .get("[data-test-id=warehouses][data-test=settingsSubsection]")
       .click();
     cy.location("pathname").should("eq", "/warehouses/");
   });
diff --git a/src/components/SideBar/MenuItem.tsx b/src/components/SideBar/MenuItem.tsx
index 897a87faf..77462c507 100644
--- a/src/components/SideBar/MenuItem.tsx
+++ b/src/components/SideBar/MenuItem.tsx
@@ -146,7 +146,11 @@ const MenuItem: React.FC<MenuItemProps> = ({
       ref={anchor}
       onClick={event => handleClick(event, menuItem)}
     >
-      <button className={classes.menuItemBtn}>
+      <button
+        className={classes.menuItemBtn}
+        data-test="menu-item-label"
+        data-test-id={menuItem.testingContextId}
+      >
         {menuItem.icon && <SVG className={classes.icon} src={menuItem.icon} />}
         <Typography
           aria-label={menuItem.ariaLabel}
@@ -154,8 +158,6 @@ const MenuItem: React.FC<MenuItemProps> = ({
             [classes.hideLabel]: isMenuShrunk
           })}
           variant="body2"
-          data-test="menu-item-label"
-          data-test-id={menuItem.testingContextId}
         >
           {menuItem.label}
         </Typography>
diff --git a/src/configuration/ConfigurationPage.tsx b/src/configuration/ConfigurationPage.tsx
index 502b9568c..271a08eca 100644
--- a/src/configuration/ConfigurationPage.tsx
+++ b/src/configuration/ConfigurationPage.tsx
@@ -127,7 +127,7 @@ export const ConfigurationPage: React.FC<ConfigurationPageProps> = props => {
                     onClick={() => onSectionClick(item.url)}
                     key={itemIndex}
                     data-test="settingsSubsection"
-                    data-testid={item.title.toLowerCase()}
+                    data-test-id={item.title.toLowerCase()}
                   >
                     <CardContent className={classes.cardContent}>
                       <div className={classes.icon}>{item.icon}</div>
diff --git a/src/warehouses/components/WarehouseList/WarehouseList.tsx b/src/warehouses/components/WarehouseList/WarehouseList.tsx
index 6e5f3ac88..bdf326ee7 100644
--- a/src/warehouses/components/WarehouseList/WarehouseList.tsx
+++ b/src/warehouses/components/WarehouseList/WarehouseList.tsx
@@ -131,7 +131,7 @@ const WarehouseList: React.FC<WarehouseListProps> = props => {
               onClick={warehouse ? onRowClick(warehouse.id) : undefined}
               key={warehouse ? warehouse.id : "skeleton"}
               data-test="warehouseEntry"
-              data-testid={warehouse?.name.toLowerCase().replace(" ", "")}
+              data-test-id={warehouse?.name.toLowerCase().replace(" ", "")}
             >
               <TableCell className={classes.colName} data-test="name">
                 {maybe<React.ReactNode>(() => warehouse.name, <Skeleton />)}