From 049d8695be2dbd93824042bd11a43d8df36df695 Mon Sep 17 00:00:00 2001 From: daproclaima Date: Mon, 12 Aug 2024 13:13:20 +0200 Subject: [PATCH] =?UTF-8?q?=E2=99=BF=EF=B8=8F(frontend)=20updates=20links?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - remove buttons inside links in panels and teams index - update component and e2e tests --- src/frontend/apps/desk/src/__tests__/pages.test.tsx | 5 +++++ .../apps/desk/src/core/__tests__/MainLayout.test.tsx | 4 ++-- src/frontend/apps/desk/src/features/menu/MenuItems.tsx | 2 +- .../teams/teams-panel/components/PanelActions.tsx | 4 +++- src/frontend/apps/desk/src/pages/teams/index.tsx | 10 ++++++---- src/frontend/apps/e2e/__tests__/app-desk/common.ts | 2 +- .../apps/e2e/__tests__/app-desk/teams-create.spec.ts | 8 ++++---- .../apps/e2e/__tests__/app-desk/teams-panel.spec.ts | 2 +- 8 files changed, 23 insertions(+), 14 deletions(-) diff --git a/src/frontend/apps/desk/src/__tests__/pages.test.tsx b/src/frontend/apps/desk/src/__tests__/pages.test.tsx index ce4573e..28d66c5 100644 --- a/src/frontend/apps/desk/src/__tests__/pages.test.tsx +++ b/src/frontend/apps/desk/src/__tests__/pages.test.tsx @@ -5,6 +5,11 @@ import { AppWrapper } from '@/tests/utils'; import Page from '../pages'; +jest.mock('next/navigation', () => ({ + ...jest.requireActual('next/navigation'), + useRouter: () => ({}), +})); + describe('Page', () => { it('checks Page rendering', () => { render(, { wrapper: AppWrapper }); diff --git a/src/frontend/apps/desk/src/core/__tests__/MainLayout.test.tsx b/src/frontend/apps/desk/src/core/__tests__/MainLayout.test.tsx index d2502bb..54b833b 100644 --- a/src/frontend/apps/desk/src/core/__tests__/MainLayout.test.tsx +++ b/src/frontend/apps/desk/src/core/__tests__/MainLayout.test.tsx @@ -15,13 +15,13 @@ describe('MainLayout', () => { render(, { wrapper: AppWrapper }); expect( - screen.getByRole('button', { + screen.getByRole('link', { name: /Teams button/i, }), ).toBeInTheDocument(); expect( - screen.getByRole('button', { + screen.getByRole('link', { name: /Mail Domains button/i, }), ).toBeInTheDocument(); diff --git a/src/frontend/apps/desk/src/features/menu/MenuItems.tsx b/src/frontend/apps/desk/src/features/menu/MenuItems.tsx index d4d5db0..624e9b5 100644 --- a/src/frontend/apps/desk/src/features/menu/MenuItems.tsx +++ b/src/frontend/apps/desk/src/features/menu/MenuItems.tsx @@ -70,7 +70,7 @@ const MenuItem = ({ Icon, label, href, alias }: MenuItemProps) => { { - diff --git a/src/frontend/apps/desk/src/pages/teams/index.tsx b/src/frontend/apps/desk/src/pages/teams/index.tsx index 28e9c9a..13dfde3 100644 --- a/src/frontend/apps/desk/src/pages/teams/index.tsx +++ b/src/frontend/apps/desk/src/pages/teams/index.tsx @@ -1,9 +1,10 @@ import { Button } from '@openfun/cunningham-react'; +import { useRouter as useNavigate } from 'next/navigation'; import type { ReactElement } from 'react'; import { useTranslation } from 'react-i18next'; import styled from 'styled-components'; -import { Box, StyledLink } from '@/components'; +import { Box } from '@/components'; import { TeamLayout } from '@/features/teams/team-management'; import { NextPageWithLayout } from '@/types/next'; @@ -13,12 +14,13 @@ const StyledButton = styled(Button)` const Page: NextPageWithLayout = () => { const { t } = useTranslation(); + const router = useNavigate(); return ( - - {t('Create a new team')} - + void router.push('/teams/create')}> + {t('Create a new team')} + ); }; diff --git a/src/frontend/apps/e2e/__tests__/app-desk/common.ts b/src/frontend/apps/e2e/__tests__/app-desk/common.ts index 3ebc7e0..a5b84c7 100644 --- a/src/frontend/apps/e2e/__tests__/app-desk/common.ts +++ b/src/frontend/apps/e2e/__tests__/app-desk/common.ts @@ -35,7 +35,7 @@ export const createTeam = async ( const randomTeams = randomName(teamName, browserName, length); for (let i = 0; i < randomTeams.length; i++) { - await panel.getByRole('button', { name: 'Add a team' }).click(); + await panel.getByRole('link', { name: 'Add a team' }).click(); await page.getByText('Team name').fill(randomTeams[i]); await expect(buttonCreate).toBeEnabled(); await buttonCreate.click(); diff --git a/src/frontend/apps/e2e/__tests__/app-desk/teams-create.spec.ts b/src/frontend/apps/e2e/__tests__/app-desk/teams-create.spec.ts index 59f4653..c800c79 100644 --- a/src/frontend/apps/e2e/__tests__/app-desk/teams-create.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-desk/teams-create.spec.ts @@ -63,7 +63,7 @@ test.describe('Teams Create', () => { }) => { const panel = page.getByLabel('Teams panel').first(); - await panel.getByRole('button', { name: 'Add a team' }).click(); + await panel.getByRole('link', { name: 'Add a team' }).click(); const teamName = `My routing team ${browserName}-${Math.floor(Math.random() * 1000)}`; await page.getByText('Team name').fill(teamName); @@ -72,7 +72,7 @@ test.describe('Teams Create', () => { const elTeam = page.getByRole('heading', { name: teamName }); await expect(elTeam).toBeVisible(); - await panel.getByRole('button', { name: 'Add a team' }).click(); + await panel.getByRole('link', { name: 'Add a team' }).click(); await expect(elTeam).toBeHidden(); await panel.locator('li').getByText(teamName).click(); @@ -96,13 +96,13 @@ test.describe('Teams Create', () => { test('checks error when duplicate team', async ({ page, browserName }) => { const panel = page.getByLabel('Teams panel').first(); - await panel.getByRole('button', { name: 'Add a team' }).click(); + await panel.getByRole('link', { name: 'Add a team' }).click(); const teamName = `My duplicate team ${browserName}-${Math.floor(Math.random() * 1000)}`; await page.getByText('Team name').fill(teamName); await page.getByRole('button', { name: 'Create the team' }).click(); - await panel.getByRole('button', { name: 'Add a team' }).click(); + await panel.getByRole('link', { name: 'Add a team' }).click(); await page.getByText('Team name').fill(teamName); await page.getByRole('button', { name: 'Create the team' }).click(); diff --git a/src/frontend/apps/e2e/__tests__/app-desk/teams-panel.spec.ts b/src/frontend/apps/e2e/__tests__/app-desk/teams-panel.spec.ts index 2f41da9..d06b129 100644 --- a/src/frontend/apps/e2e/__tests__/app-desk/teams-panel.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-desk/teams-panel.spec.ts @@ -22,7 +22,7 @@ test.describe('Teams Panel', () => { ).toBeVisible(); await expect( - panel.getByRole('button', { + panel.getByRole('link', { name: 'Add a team', }), ).toBeVisible();