test: MET-2243 create automation test for pool

playwright/pages/pool.page.ts

@@ -0,0 +1,154 @@
+import { expect, Page } from "@playwright/test";
+
+export function poolOverviewPage(page: Page) {
+  const sidebarBlockchainButton = page.getByTestId("menu-button-blockchain");
+  const poolsTab = page.getByTestId("submenu-button-pools");
+  const searchBarPools = page.getByTestId("all-filters-dropdown");
+  const epochCardPools = page.getByTestId("delegationOverview.epochCard");
+  const poolName = page.getByTestId("poolList.poolNameValue").first();
+  const rewardAccountPool = page.getByTestId("poolDetail.rewardAccountValue");
+  const ownerAccountPool = page.getByTestId("poolDetail.ownerAccountValue");
+  const deatailPageTitle = page.getByTestId("stake-address-detail-title");
+  const deatailBlockTitle = page.getByTestId("block.detail.header");
+  const deatailPagesTitle = page.getByTestId("detail.page.title");
+  const epochValuePools = page.getByTestId("delegationOverview.epochValue");
+  const epochValuePoolsList = page.getByTestId("delegationEpochList.epochValue").first();
+  const stakingTitlePoolsList = page.getByTestId("delegationDetail.stakingTitle");
+  const certificatesHistoryTitlePoolsList = page.getByTestId("delegationDetail.certificatesHistoryTitle");
+  const governanceTitle = page.getByTestId("delegationDetail.governanceTitle");
+  const governanceFilter = page.getByTestId("governance.filter");
+  const governanceApplyFilters = page.getByTestId("governance.applyFilters");
+  const delegatorValuePoolsList = page.getByTestId("stakingDelegators.delegatorValue").first();
+  const txHashValuePoolsList = page.getByTestId("poolHistory.txHashValue").first();
+  const blockValuePoolsList = page.getByTestId("poolHistory.blockValue").first();
+  const epochValuePoolsHistory = page.getByTestId("poolHistory.epochValue").first();
+  const governanceActionType = page.getByTestId("governance.filter.actionType");
+  const governanceCurrentStatus = page.getByTestId("governance.filter.currentStatus");
+  const governanceActionTypeText = page.getByTestId("governance.filter.actionTypeText").nth(4);
+  const governanceCurrentStatusText = page.getByTestId("governance.filter.currentStatusText").nth(1);
+  const governanceCardTitle = page.getByTestId("governance.card.actionTypeValue");
+  const governanceStatusValue = page.getByTestId("governance.card.statusValue");
+  const goToDashboard = async () => {
+    await page.goto("/");
+  };
+  const goToPoolsFromSidebar = async () => {
+    await sidebarBlockchainButton.click();
+    await poolsTab.click();
+  };
+
+  const searchBarOnPool = async () => {
+    await expect(searchBarPools).toHaveText("Pools");
+  };
+
+  const goToPools = async () => {
+    await page.goto("/pools");
+  };
+  const goToEpochDetailsPage = async () => {
+    await epochCardPools.click();
+  };
+  const goToPoolDetailsPage = async () => {
+    await page.goto("/pools");
+    await poolName.click();
+  };
+  const goToStakeAddressDetailPageByReward = async () => {
+    await rewardAccountPool.click();
+  };
+  const goToStakeAddressDetailPageByOwner = async () => {
+    await ownerAccountPool.click();
+  };
+  const goToEpochDetailPageByEpochValue = async () => {
+    await epochValuePoolsList.click();
+  };
+  const goToEpochDetailPageByDelegatorValue = async () => {
+    await stakingTitlePoolsList.click();
+    await delegatorValuePoolsList.click();
+  };
+  const goToTransactionDetailPageByTxHashPoolCertificates = async () => {
+    await certificatesHistoryTitlePoolsList.click();
+    await txHashValuePoolsList.click();
+  };
+
+  const goToBlockDetailPageByBlockNumberPoolCertificates = async () => {
+    await certificatesHistoryTitlePoolsList.click();
+    await blockValuePoolsList.click();
+  };
+
+  const goToEpochDetailPageByEpochNumberPoolCertificates = async () => {
+    await certificatesHistoryTitlePoolsList.click();
+    await epochValuePoolsHistory.click();
+  };
+
+  const goToGovernanceVoteSection = async () => {
+    await governanceTitle.click();
+  };
+  const openFilterModal = async () => {
+    await governanceFilter.click();
+  };
+  const selectActionType = async () => {
+    await governanceActionType.click();
+    await governanceActionTypeText.click();
+    await governanceApplyFilters.click();
+  };
+
+  const selectCurrentStatus = async () => {
+    await governanceCurrentStatus.click();
+    await governanceCurrentStatusText.click();
+    await governanceApplyFilters.click();
+  };
+
+  const getAddressDetailsTitle = async () => {
+    await expect(deatailPageTitle, "Check title on stake address detail").toHaveText("Stake Address Details");
+  };
+  const getTransactionDetailTitle = async () => {
+    await expect(deatailPagesTitle, "Check title on transaction detail").toHaveText("Transaction Details");
+  };
+  const getEpochDetailTitle = async () => {
+    await expect(deatailPagesTitle, "Check title on transaction detail").toHaveText("Epoch Details");
+  };
+  const getBlockDetailTitle = async () => {
+    await expect(deatailBlockTitle, "Check title on block detail").toHaveText("Block Details");
+  };
+  const getGovernanceVoteCardTitle = async () => {
+    await expect(governanceCardTitle, "Check title on block detail").toHaveText("Hard-Fork Initiation");
+  };
+  const getGovernanceVoteCardStatusValue = async () => {
+    await expect(governanceStatusValue, "Check title on block detail").toHaveText("Open ballot");
+  };
+
+  const getEpochNoValue = async () => {
+    const epochValue = epochValuePools.textContent();
+    return epochValue;
+  };
+  const getEpochNoValueList = async () => {
+    const epochValue = epochValuePoolsList.textContent();
+    return epochValue;
+  };
+
+  return {
+    goToDashboard,
+    goToPoolsFromSidebar,
+    searchBarOnPool,
+    goToPools,
+    goToEpochDetailsPage,
+    goToPoolDetailsPage,
+    goToStakeAddressDetailPageByReward,
+    goToStakeAddressDetailPageByOwner,
+    getAddressDetailsTitle,
+    getEpochNoValue,
+    goToEpochDetailPageByEpochValue,
+    getEpochNoValueList,
+    goToEpochDetailPageByDelegatorValue,
+    goToTransactionDetailPageByTxHashPoolCertificates,
+    goToBlockDetailPageByBlockNumberPoolCertificates,
+    goToEpochDetailPageByEpochNumberPoolCertificates,
+    getTransactionDetailTitle,
+    getBlockDetailTitle,
+    getEpochDetailTitle,
+    goToGovernanceVoteSection,
+    openFilterModal,
+    selectActionType,
+    getGovernanceVoteCardTitle,
+    selectCurrentStatus,
+    getGovernanceVoteCardStatusValue
+  };
+}

playwright/tests/e2e/features/pools.feature

@@ -0,0 +1,59 @@
+Feature: Check Pools Page Cardano Explorer
+
+  Scenario: Pools page content
+    Given the user is in the general dashboard page in explorer portal site
+    When the user selects the Pools option inside the Blockchain drop down menu
+    Then the user should see the Pools page containing the Search bar, the General infor cards and the Pools table
+
+  Scenario: Epochs page through pools page
+   Given the user is in the Pools page
+   When the user selects the epoch info card in the pools page
+   Then the user should be redirected to the current Epoch details page
+
+  Scenario: Reward account address through pool details page
+   Given the user is in the Pools details page of one Pool
+   When the user selects the address hash under the Reward account part in the pool details section
+   Then the user should be redirected to the reward account address details page of the selected address hash
+
+  Scenario: Owner account address through pool details page
+   Given the user is in the Pools details site of one Pool
+   When the user selects the address hash under the Owner account part in the pool details section
+   Then the user should be redirected to the Owner account address details page of the selected address hash
+
+  Scenario: Pools details page - Epoch table
+   Given the user is in the Pools details web of one Pool
+   When the user selects an Epoch number from the epochs table
+   Then the user should be redirected to the selected Epoch details page
+
+  Scenario: Pools details page -  Staking Delegators
+   Given the user is in the Pools details page site of one Pool
+   When the user selects an delegetor hash from the Staking delegators table
+   Then the user should be redirected to the selected Address details page
+
+   Scenario: Pools details page - Pool certificates History - Tx Hash
+   Given the user is in the Pools details page web of one Pool
+   When the user selects a transaction hash from the Pool certificates History table
+   Then the user should be redirected to the selected Transaction details page
+
+   Scenario: Pools details page - Pool certificates History - Block
+   Given the user is in the Pools details pages of one Pool
+   When the user selects a block number from the Pool certificates History table
+   Then the user should be redirected to the selected Block details page
+
+   Scenario: Pools details page - Pool certificates History - Epoch
+   Given the user is in the Pools details pages site of one Pool
+   When the user selects an epoch number from the Pool certificates History table
+   Then the user should be redirected to the selected Epoch details page web
+
+   Scenario: Governance votes - Filter by Action type
+   Given the user is in the Pools details pages web of one Pool
+   And the user selects the Governance votes section
+   When the user filter by one of the Action types
+   Then the user should see just the votes that has the same action type as the selected filter
+
+   Scenario: Governance votes - Filter by Current status
+   Given the user is in the Pools details pages web of one Pool page
+   And the user selects the Governance votes section current status
+   When the user filter by one of the current status
+   Then the user should see just the votes that has the same status as the selected filter current status
+

playwright/tests/e2e/steps/pools.steps.ts

@@ -0,0 +1,146 @@
+import { createBdd } from "playwright-bdd";
+
+import { epochDetailPage } from "playwright/pages/epoch-detail.page";
+import { poolOverviewPage } from "playwright/pages/pool.page";
+
+const { Given, When, Then } = createBdd();
+
+let epochNo: string | null;
+
+Given(/^the user is in the general dashboard page in explorer portal site$/, async ({ page }) => {
+  await poolOverviewPage(page).goToDashboard();
+});
+When(/^the user selects the Pools option inside the Blockchain drop down menu$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolsFromSidebar();
+});
+Then(
+  /^the user should see the Pools page containing the Search bar, the General infor cards and the Pools table$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).searchBarOnPool();
+  }
+);
+
+Given(/^the user is in the Pools page$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPools();
+});
+When(/^the user selects the epoch info card in the pools page$/, async ({ page }) => {
+  epochNo = await poolOverviewPage(page).getEpochNoValue();
+  await poolOverviewPage(page).goToEpochDetailsPage();
+});
+Then(/^the user should be redirected to the current Epoch details page$/, async ({ page }) => {
+  await epochDetailPage(page).checkEpochDetail({ epochNo: epochNo });
+});
+
+Given(/^the user is in the Pools details page of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(
+  /^the user selects the address hash under the Reward account part in the pool details section$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).goToStakeAddressDetailPageByReward();
+  }
+);
+Then(
+  /^the user should be redirected to the reward account address details page of the selected address hash$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).getAddressDetailsTitle();
+  }
+);
+
+Given(/^the user is in the Pools details site of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(
+  /^the user selects the address hash under the Owner account part in the pool details section$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).goToStakeAddressDetailPageByOwner();
+  }
+);
+Then(
+  /^the user should be redirected to the Owner account address details page of the selected address hash$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).getAddressDetailsTitle();
+  }
+);
+
+Given(/^the user is in the Pools details web of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(/^the user selects an Epoch number from the epochs table$/, async ({ page }) => {
+  epochNo = await poolOverviewPage(page).getEpochNoValueList();
+  await poolOverviewPage(page).goToEpochDetailPageByEpochValue();
+});
+Then(/^the user should be redirected to the selected Epoch details page$/, async ({ page }) => {
+  await epochDetailPage(page).checkEpochDetail({ epochNo: epochNo });
+});
+
+Given(/^the user is in the Pools details page site of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(/^the user selects an delegetor hash from the Staking delegators table$/, async ({ page }) => {
+  await poolOverviewPage(page).goToEpochDetailPageByDelegatorValue();
+});
+Then(/^the user should be redirected to the selected Address details page$/, async ({ page }) => {
+  await poolOverviewPage(page).getAddressDetailsTitle();
+});
+
+Given(/^the user is in the Pools details page web of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(/^the user selects a transaction hash from the Pool certificates History table$/, async ({ page }) => {
+  await poolOverviewPage(page).goToTransactionDetailPageByTxHashPoolCertificates();
+});
+Then(/^the user should be redirected to the selected Transaction details page$/, async ({ page }) => {
+  await poolOverviewPage(page).getTransactionDetailTitle();
+});
+
+Given(/^the user is in the Pools details pages of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(/^the user selects a block number from the Pool certificates History table$/, async ({ page }) => {
+  await poolOverviewPage(page).goToBlockDetailPageByBlockNumberPoolCertificates();
+});
+Then(/^the user should be redirected to the selected Block details page$/, async ({ page }) => {
+  await poolOverviewPage(page).getBlockDetailTitle();
+});
+
+Given(/^the user is in the Pools details pages site of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+When(/^the user selects an epoch number from the Pool certificates History table$/, async ({ page }) => {
+  await poolOverviewPage(page).goToEpochDetailPageByEpochNumberPoolCertificates();
+});
+Then(/^the user should be redirected to the selected Epoch details page web$/, async ({ page }) => {
+  await poolOverviewPage(page).getEpochDetailTitle();
+});
+
+Given(/^the user is in the Pools details pages web of one Pool$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+Given(/^the user selects the Governance votes section$/, async ({ page }) => {
+  await poolOverviewPage(page).goToGovernanceVoteSection();
+});
+When(/^the user filter by one of the Action types$/, async ({ page }) => {
+  await poolOverviewPage(page).openFilterModal();
+  await poolOverviewPage(page).selectActionType();
+});
+Then(/^the user should see just the votes that has the same action type as the selected filter$/, async ({ page }) => {
+  await poolOverviewPage(page).getGovernanceVoteCardTitle();
+});
+
+Given(/^the user is in the Pools details pages web of one Pool page$/, async ({ page }) => {
+  await poolOverviewPage(page).goToPoolDetailsPage();
+});
+Given(/^the user selects the Governance votes section current status$/, async ({ page }) => {
+  await poolOverviewPage(page).goToGovernanceVoteSection();
+});
+When(/^the user filter by one of the current status$/, async ({ page }) => {
+  await poolOverviewPage(page).openFilterModal();
+  await poolOverviewPage(page).selectCurrentStatus();
+});
+Then(
+  /^the user should see just the votes that has the same status as the selected filter current status$/,
+  async ({ page }) => {
+    await poolOverviewPage(page).getGovernanceVoteCardStatusValue();
+  }
+);

src/components/DelegationDetail/DelegationDetailList/index.tsx

@@ -172,9 +172,12 @@ const DelegationStakingDelegatorsList = ({
       minWidth: "50px",
       render: (data) =>
         (data.view || data.stakeAddress) && (
-          <div data-testid="stakingDelegators.delegatorValue" style={{ display: "flex", alignItems: "center" }}>
+          <div style={{ display: "flex", alignItems: "center" }}>
             <CustomTooltip title={data.view || data.stakeAddress || ""}>
-              <StyledLink to={details.stake(data.view || data.stakeAddress)}>
+              <StyledLink
+                to={details.stake(data.view || data.stakeAddress)}
+                data-testid="stakingDelegators.delegatorValue"
+              >
                 {getShortHash(data.view || data.stakeAddress || "")}
               </StyledLink>
             </CustomTooltip>

src/components/DelegationPool/DelegationOverview/index.tsx

@@ -76,7 +76,7 @@ const OverViews: React.FC = () => {
       </TimeDuration>
       <Grid container spacing={2}>
         <Grid item xl={3} md={6} xs={12}>
-          <StyledCard.ClickAble to={details.epoch(data?.epochNo)}>
+          <StyledCard.ClickAble to={details.epoch(data?.epochNo)} data-testid="delegationOverview.epochCard">
             <StyledCard.Content>
               <StyledCard.Title data-testid="delegationOverview.epochTitle">{t("glossary.epoch")}</StyledCard.Title>
               <StyledCard.Link data-testid="delegationOverview.epochValue" to={details.epoch(data?.epochNo)}>