From db6a1f077b19cfce7c0eb81e7ba7aa720dc64867 Mon Sep 17 00:00:00 2001
From: bwallacee <ben@vega.xyz>
Date: Tue, 23 Jan 2024 10:56:48 +0000
Subject: [PATCH] chore(trading): e2e test

---
 .../competitions/competitions-team.tsx        | 19 ++++-
 .../components/competitions/team-stats.tsx    | 15 +++-
 apps/trading/e2e/tests/teams/test_teams.py    | 82 ++++++++++++++++---
 3 files changed, 101 insertions(+), 15 deletions(-)

diff --git a/apps/trading/client-pages/competitions/competitions-team.tsx b/apps/trading/client-pages/competitions/competitions-team.tsx
index d226e9bce..cdc0b76a8 100644
--- a/apps/trading/client-pages/competitions/competitions-team.tsx
+++ b/apps/trading/client-pages/competitions/competitions-team.tsx
@@ -93,17 +93,30 @@ const TeamPage = ({
       <header className="flex gap-3 lg:gap-4 pt-5 lg:pt-10">
         <TeamAvatar teamId={team.teamId} imgUrl={team.avatarUrl} />
         <div className="flex flex-col items-start gap-1 lg:gap-3">
-          <h1 className="calt text-2xl lg:text-3xl xl:text-5xl">{team.name}</h1>
+          <h1
+            className="calt text-2xl lg:text-3xl xl:text-5xl"
+            data-testid="team-name"
+          >
+            {team.name}
+          </h1>
           <JoinTeam team={team} partyTeam={partyTeam} refetch={refetch} />
         </div>
       </header>
       <TeamStats stats={stats} members={members} games={games} />
       <section>
         <div className="flex gap-4 lg:gap-8 mb-4 border-b border-default">
-          <ToggleButton active={showGames} onClick={() => setShowGames(true)}>
+          <ToggleButton
+            active={showGames}
+            onClick={() => setShowGames(true)}
+            data-testid="games-toggle"
+          >
             {t('Games ({{count}})', { count: games ? games.length : 0 })}
           </ToggleButton>
-          <ToggleButton active={!showGames} onClick={() => setShowGames(false)}>
+          <ToggleButton
+            active={!showGames}
+            onClick={() => setShowGames(false)}
+            data-testid="members-toggle"
+          >
             {t('Members ({{count}})', {
               count: members ? members.length : 0,
             })}
diff --git a/apps/trading/components/competitions/team-stats.tsx b/apps/trading/components/competitions/team-stats.tsx
index f79b75eb2..0b1ae41fd 100644
--- a/apps/trading/components/competitions/team-stats.tsx
+++ b/apps/trading/components/competitions/team-stats.tsx
@@ -30,11 +30,16 @@ export const TeamStats = ({
     <>
       <StatSection>
         <StatList>
-          <Stat value={members ? members.length : 0} label={t('Members')} />
+          <Stat
+            value={members ? members.length : 0}
+            label={t('Members')}
+            valueTestId="members-count-stat"
+          />
           <Stat
             value={stats ? stats.totalGamesPlayed : 0}
             label={t('Total games')}
             tooltip={t('Total number of games this team has participated in')}
+            valueTestId="total-games-stat"
           />
           <StatSectionSeparator />
           <Stat
@@ -47,6 +52,7 @@ export const TeamStats = ({
                 : 0
             }
             label={t('Total volume')}
+            valueTestId="total-volume-stat"
           />
           <Stat
             value={
@@ -59,6 +65,7 @@ export const TeamStats = ({
             }
             label={t('Rewards paid')}
             tooltip={'Total amount of rewards paid out to this team in qUSD'}
+            valueTestId="rewards-paid-stat"
           />
         </StatList>
       </StatSection>
@@ -159,14 +166,18 @@ const Stat = ({
   value,
   label,
   tooltip,
+  valueTestId,
 }: {
   value: ReactNode;
   label: ReactNode;
   tooltip?: string;
+  valueTestId?: string;
 }) => {
   return (
     <div>
-      <dd className="text-3xl lg:text-4xl">{value}</dd>
+      <dd className="text-3xl lg:text-4xl" data-testid={valueTestId}>
+        {value}
+      </dd>
       <dt className="text-sm text-muted">
         {tooltip ? (
           <Tooltip description={tooltip} underline={false}>
diff --git a/apps/trading/e2e/tests/teams/test_teams.py b/apps/trading/e2e/tests/teams/test_teams.py
index fa97c3a49..fc562e4b1 100644
--- a/apps/trading/e2e/tests/teams/test_teams.py
+++ b/apps/trading/e2e/tests/teams/test_teams.py
@@ -5,6 +5,7 @@ from vega_sim.null_service import VegaServiceNull
 from conftest import init_vega
 from actions.utils import next_epoch
 from fixtures.market import setup_continuous_market
+from conftest import auth_setup, init_page, init_vega, risk_accepted_setup
 from wallet_config import PARTY_A, PARTY_B, PARTY_C, PARTY_D, MM_WALLET
 
 
@@ -14,6 +15,7 @@ def vega(request):
         yield vega
 
 
+@pytest.fixture(scope="module")
 def setup_teams_and_games(vega: VegaServiceNull):
     tDAI_market = setup_continuous_market(vega)
     tDAI_asset_id = vega.find_asset_id(symbol="tDAI")
@@ -80,21 +82,17 @@ def setup_teams_and_games(vega: VegaServiceNull):
         volume=1,
     )
     next_epoch(vega=vega)
-    return tDAI_market, tDAI_asset_id, team_id, team_name
 
-
-@pytest.mark.usefixtures("auth", "risk_accepted")
-def test_teams(vega: VegaServiceNull, page: Page):
-    market_id, asset_id, team_id, team_name = setup_teams_and_games(vega)
-    page.goto(f"/#/competitions/teams/{team_id}")
-    # page.pause()
-    expect(page.get_by_role("heading", level=1)).to_have_text(team_name)
-    expect(page.get_by_text("Members (3)")).to_be_visible()
+    return {
+        "market_id": tDAI_market,
+        "asset_id": tDAI_asset_id,
+        "team_id": team_id,
+        "team_name": team_name,
+    }
 
 
 def create_team(vega: VegaServiceNull):
     team_name = "Foobar"
-
     vega.create_referral_set(
         key_name=PARTY_A.name,
         name=team_name,
@@ -104,3 +102,67 @@ def create_team(vega: VegaServiceNull):
     )
 
     return team_name
+
+
+@pytest.fixture(scope="module")
+def team_page(vega, browser, request, setup_teams_and_games):
+    with init_page(vega, browser, request) as page:
+        risk_accepted_setup(page)
+        auth_setup(vega, page)
+        team_id = setup_teams_and_games["team_id"]
+        page.goto(f"/#/competitions/teams/{team_id}")
+        yield page
+
+def test_team_page_games_table(team_page: Page):
+    team_page.get_by_test_id("games-toggle").click()
+    expect(team_page.get_by_test_id("games-toggle")).to_have_text("Games (1)")
+    expect(team_page.get_by_test_id("rank-0")).to_have_text("1")
+    expect(team_page.get_by_test_id("epoch-0")).to_have_text("8")
+    expect(team_page.get_by_test_id("type-0")).to_have_text("Price maker fees paid")
+    expect(team_page.get_by_test_id("amount-0")).to_have_text("10,000,000")
+    expect(team_page.get_by_test_id("teams-0")).to_have_text(
+        "2"
+    )  # TODO I think this should be 1, confirm with devs
+
+def test_team_page_members_table(team_page: Page):
+    team_page.get_by_test_id("members-toggle").click()
+    expect(team_page.get_by_test_id("members-toggle")).to_have_text("Members (3)")
+    expect(team_page.get_by_test_id("referee-0")).to_be_visible()
+    expect(team_page.get_by_test_id("joinedAt-0")).to_be_visible()
+    expect(team_page.get_by_test_id("joinedAtEpoch-0")).to_have_text("8")
+
+def test_team_page_headline(team_page: Page, setup_teams_and_games
+):
+    team_name = setup_teams_and_games["team_name"]
+    expect(team_page.get_by_test_id("team-name")).to_have_text(team_name)
+    expect(team_page.get_by_test_id("members-count-stat")).to_have_text("3")
+    expect(team_page.get_by_test_id("total-games-stat")).to_have_text(
+        "0"
+    )  # TODO this should be 1, confirm with devs
+    expect(team_page.get_by_test_id("total-volume-stat")).to_have_text(
+        "0"
+    )  # TODO this should be 10,000,000, confirm with devs
+    expect(team_page.get_by_test_id("rewards-paid-stat")).to_have_text(
+        "0"
+    )  # TODO this should be 100, confirm with devs
+
+@pytest.fixture(scope="module")
+def competitions_page(vega, browser, request):
+    with init_page(vega, browser, request) as page:
+        risk_accepted_setup(page)
+        auth_setup(vega, page)
+        page.goto(f"/#/competitions/")
+        yield page
+
+def test_leaderboard(competitions_page: Page, setup_teams_and_games):
+    team_name = setup_teams_and_games["team_name"]
+    competitions_page.pause()
+    expect(competitions_page.get_by_test_id("rank-0").locator("._text-yellow-300")).to_have_count(1)
+    expect(competitions_page.get_by_test_id("team-0")).to_have_text(team_name)
+    expect(competitions_page.get_by_test_id("earned-0")).to_have_text("-") #TODO I think this should be 100, confirm with dev
+    expect(competitions_page.get_by_test_id("games-0")).to_have_text("-") #TODO I think this should be 1, confirm with dev
+    expect(competitions_page.get_by_test_id("status-0")).to_have_text("Open") 
+    expect(competitions_page.get_by_test_id("volume-0")).to_have_text("-") #TODO I think this should be 10,000,000, confirm with dev
+
+#TODO def test_games(competitions_page: Page):
+    # TODO currently no games appear which i think is a bug
\ No newline at end of file