fix e2e tests

WomenInSoftwareEngineeringJP · Jul 17, 2024 · fd856f8 · fd856f8
1 parent 7461360
commit fd856f8
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/e2e/team.spec.ts b/e2e/team.spec.ts
@@ -45,7 +45,7 @@ test('shows the team in English', async ({ page }) => {
     await expect(annLink).toHaveAttribute('target', '_blank')
 })
 
-test('shows the team in Japanese', async ({ page }) => {
+test('shows the team in Japanese', async ({ page, viewport }) => {
     await page.goto('/#/team')
 
     // switch locale to Japanese
@@ -56,8 +56,13 @@ test('shows the team in Japanese', async ({ page }) => {
 
     const teamContainer = page.getByLabel('team-container')
 
-    // click off to close sidebar
-    await teamContainer.click({ force: true })
+    // close the sidebar
+    if (viewport && viewport.width < 600) {
+        const closeButton = page.getByLabel('close-button')
+        await closeButton.click()
+    } else {
+        await teamContainer.click({ force: true })
+    }
 
     const heading = teamContainer.getByText('✨ リーダーシップ・チーム ✨')
     await expect(heading).toBeVisible()

diff --git a/src/components/SideDrawer/DrawerContents.tsx b/src/components/SideDrawer/DrawerContents.tsx
@@ -19,16 +19,19 @@ interface DrawerContentsProps {
 const DrawerContents: FC<DrawerContentsProps> = ({ closeDrawer }) => {
     const theme = useTheme()
     const { t } = useTranslation()
+
+    const closeButton = <IconButton onClick={closeDrawer} aria-label='close-button'>
+        <CloseIcon />
+    </IconButton>
+
     let navList = <></>
     if (useMediaQuery(theme.breakpoints.down('sm'))) {
         navList = (<>
             <ListItem>
                 <Stack direction='row' sx={{ width: '100%', m: 0, p: 0 }}>
                     <StyledNavLink to='/'>Home</StyledNavLink>
                     <Box sx={{ display: 'flex-grow', width: '100%' }} />
-                    <IconButton onClick={closeDrawer} aria-label='close-button'>
-                        <CloseIcon />
-                    </IconButton>
+                    {closeButton}
                 </Stack>
             </ListItem>
             <ListItem>