[fix] resolve eslint errors and migrate test-id to data-testid

kadena-community · Jan 4, 2024 · b6f59a7 · b6f59a7
1 parent 35c93bd
commit b6f59a7
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 18 deletions.
diff --git a/packages/apps/docs/src/components/Layout/components/TreeMenu/Item.tsx b/packages/apps/docs/src/components/Layout/components/TreeMenu/Item.tsx
@@ -25,9 +25,8 @@ export const Item: FC<IItem> = ({ item, level }) => {
   );
 
   return (
-    //TODO: Check with Steven for a good way to do this.
-    <li // eslint-disable-next-line react/no-unknown-property
-      test-id={`menuItem-${level}`}
+    <li
+      data-testid={`menuItem-${level}`}
       className={classNames(listItemClass, listItemVariants[`l${level}`])}
     >
       <Link className={classes} href={item.root} data-active={item.isActive}>

diff --git a/packages/apps/docs/src/components/Layout/components/TreeMenu/MainTreeItem.tsx b/packages/apps/docs/src/components/Layout/components/TreeMenu/MainTreeItem.tsx
@@ -66,9 +66,7 @@ export const MainTreeItem: FC<IProps> = ({ item, root = false, level = 1 }) => {
         </>
       )}
       {!root && hasSubmenu ? (
-        //TODO: Check with Steven for a good way to do this.
-        // eslint-disable-next-line react/no-unknown-property
-        <li test-id={`menuItem-${level}`} key={item.root} ref={ref}>
+        <li data-testid={`menuItem-${level}`} key={item.root} ref={ref}>
           <TreeButton
             onClick={() => setMenuOpen((v) => !v)}
             level={`l${level}`}

diff --git a/packages/tools/e2e-tests/README.MD b/packages/tools/e2e-tests/README.MD
@@ -56,7 +56,7 @@ pnpm --filter @kadena-dev/e2e-tests run install:chromium
    has it's own config file.
 
 ```sh
- pnpm --filter @kadena-dev/e2e-tests run test:e2e -c playwright.tools.config.ts
+pnpm run test:e2e -- -c playwright.tools.config.ts
 ```
 
 [1]: #table-of-contents

diff --git a/packages/tools/e2e-tests/src/helpers/menu.helper.ts b/packages/tools/e2e-tests/src/helpers/menu.helper.ts
@@ -9,10 +9,10 @@ export default class MenuHelper {
   public constructor(page: Page) {
     this._page = page;
     this._levelOne = this._page.locator(
-      '[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button',
+      '[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button',
     );
     this._levelTwo = this._page.locator(
-      '[data-cy="sidemenu-submenu"] [test-id="menuItem-2"] > button',
+      '[data-cy="sidemenu-submenu"] [data-testid="menuItem-2"] > button',
     );
   }
 

diff --git a/packages/tools/e2e-tests/src/helpers/tree.helper.ts b/packages/tools/e2e-tests/src/helpers/tree.helper.ts
@@ -65,7 +65,7 @@ export default class TreeHelper {
   public async validateParent(label: string): Promise<void> {
     await expect(
       this._page.locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > a:text-is("${label}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > a:text-is("${label}")`,
       ),
       `Expected ${label} to be visible on level 1 in the menu.`,
     ).toBeVisible();
@@ -83,19 +83,19 @@ export default class TreeHelper {
     // open parent menu first
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}")`,
       )
       .click();
     await expect(
       this._page.locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}") + ul [test-id="menuItem-2"] > a:text-is("${childLabel}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}") + ul [data-testid="menuItem-2"] > a:text-is("${childLabel}")`,
       ),
       `Expected ${childLabel} to be visible on level 2 in the menu.`,
     ).toBeVisible();
     // then close parent menu again
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}")`,
       )
       .click();
   }
@@ -114,29 +114,29 @@ export default class TreeHelper {
     // open parent and child menu first
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}")`,
       )
       .click();
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}") + ul [test-id="menuItem-2"] > button:text-is("${childMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}") + ul [data-testid="menuItem-2"] > button:text-is("${childMenu}")`,
       )
       .click();
     await expect(
       this._page.locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}") + ul [test-id="menuItem-2"] > button:text-is("${childMenu}") + ul [test-id="menuItem-3"] > a:text-is("${grandChildLabel}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}") + ul [data-testid="menuItem-2"] > button:text-is("${childMenu}") + ul [data-testid="menuItem-3"] > a:text-is("${grandChildLabel}")`,
       ),
       `Expected ${grandChildLabel} to be visible on level 3 in the menu.`,
     ).toBeVisible();
     // Close parent and child menu
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}")`,
       )
       .click();
     await this._page
       .locator(
-        `[data-cy="sidemenu-submenu"] [test-id="menuItem-1"] > button:text-is("${parentMenu}") + ul [test-id="menuItem-2"] > button:text-is("${childMenu}")`,
+        `[data-cy="sidemenu-submenu"] [data-testid="menuItem-1"] > button:text-is("${parentMenu}") + ul [data-testid="menuItem-2"] > button:text-is("${childMenu}")`,
       )
       .click();
   }