From 1a2b33e5fbb4e293d9889d0585246a9bb8b39ec4 Mon Sep 17 00:00:00 2001 From: moshe vilner Date: Wed, 15 Nov 2023 20:49:38 +0200 Subject: [PATCH] test: change class regex not to include ant --- src/layout/sidebar/SideBar.tsx | 8 ++ src/layout/sidebar/sidebar.scss | 11 ++ .../components/header/sidebar/SideBar.tsx | 41 ------- .../components/header/sidebar/sidebar.scss | 109 ------------------ tests/about.spec.ts | 2 +- 5 files changed, 20 insertions(+), 151 deletions(-) delete mode 100644 src/pages/components/header/sidebar/SideBar.tsx delete mode 100644 src/pages/components/header/sidebar/sidebar.scss diff --git a/src/layout/sidebar/SideBar.tsx b/src/layout/sidebar/SideBar.tsx index 433789597..fcb855214 100644 --- a/src/layout/sidebar/SideBar.tsx +++ b/src/layout/sidebar/SideBar.tsx @@ -3,6 +3,7 @@ import './sidebar.scss' import { Drawer, Layout } from 'antd' import { useContext, useState } from 'react' import { LayoutContextInterface, LayoutCtx } from '../LayoutContext' +import GitHubLink from './GitHubLink/GitHubLink' const { Sider } = Layout @@ -26,7 +27,11 @@ export default function SideBar() { open={drawerOpen} className="hideOnDesktop" bodyStyle={{ padding: '0' }}> + +
+
+ setCollapsed(value)} className="hideOnMobile"> {collapsed ? : } +
+
+ ) diff --git a/src/layout/sidebar/sidebar.scss b/src/layout/sidebar/sidebar.scss index b7410b25a..2a821218b 100644 --- a/src/layout/sidebar/sidebar.scss +++ b/src/layout/sidebar/sidebar.scss @@ -58,4 +58,15 @@ border-bottom: 8px solid gray; padding-bottom: 0; line-height: 25px; +} + +.sidebar-section { + display: flex; + flex-direction: column; +} + +.sidebar-divider { + height: 1px; + background-color: #ccc; + margin: 8px 0; } \ No newline at end of file diff --git a/src/pages/components/header/sidebar/SideBar.tsx b/src/pages/components/header/sidebar/SideBar.tsx deleted file mode 100644 index 18885514e..000000000 --- a/src/pages/components/header/sidebar/SideBar.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import Menu from './menu/Menu' -import './sidebar.scss' -import { Drawer } from 'antd' -import { useContext } from 'react' -import { LayoutContextInterface, LayoutCtx } from 'src/layout/LayoutContext' -import GitHubLink from './GitHubLink/GitHubLink' - -const Logo = () => ( -
-

דאטאבוס

-
-) - -export default function SideBar() { - const { drawerOpen, setDrawerOpen } = useContext(LayoutCtx) - - return ( - <> - setDrawerOpen(false)} - open={drawerOpen} - className="hideOnDesktop"> - -
- -
- - - - - ) -} diff --git a/src/pages/components/header/sidebar/sidebar.scss b/src/pages/components/header/sidebar/sidebar.scss deleted file mode 100644 index b3af711f2..000000000 --- a/src/pages/components/header/sidebar/sidebar.scss +++ /dev/null @@ -1,109 +0,0 @@ -@import '../../../../resources/variables'; - -.sidebar-menu-toggle { - display: none; -} - -@media screen and (max-width: $mobile-max-width) { - - .main > .sidebar { - max-width: 0; - padding: 0; - transition: all 0.2s ease-in-out; - .sidebar-logo { - display: none; - } - .sidebar-menu-toggle { - display: block; - position: absolute; - top: 0; - right: 0; - margin: 10px; - cursor: pointer; - font-size: 20px; - } - } - - .main > .sidebar.open{ - .sidebar-logo { - display: block; - } - display: block; - position: absolute; - z-index: 500; - max-width: 100%; - padding: 30px; - margin-right: 1px; - } - -} -.hideOnMobile { - display: none; - } - @media only screen and (min-width: 768px) { - .hideOnMobile { - display: block; - } - } - - .hideOnDesktop { - display: block; - } - @media only screen and (min-width: 768px) { - .hideOnDesktop { - display: none; - } - } - -.sidebar-logo { - position: relative; - margin: 20px auto; - width: 119px; - font-size: 30px; - border-top: 6px solid gray; - border-bottom: 8px solid gray; - padding-bottom: 0; - line-height: 25px; - &::before { - height: 10px; - width: 10px; - border-radius: 5px; - position: absolute; - background: gray; - top: 28px; - right: 24px; - content: ' ' - } - &::after { - height: 10px; - width: 10px; - border-radius: 5px; - position: absolute; - background: gray; - top: 28px; - left: 17px; - content: ' ' - } -} - -.sidebar-logo-collapsed { - position: relative; - margin: 20px auto; - text-align: center; - font-size: 30px; - border-top: 6px solid gray; - border-bottom: 8px solid gray; - padding-bottom: 0; - line-height: 25px; -} - -.sidebar-section { - display: flex; - flex-direction: column; -} - -.sidebar-divider { - height: 1px; - background-color: #ccc; - margin: 8px 0; -} \ No newline at end of file diff --git a/tests/about.spec.ts b/tests/about.spec.ts index 92df1c94c..543f9c87d 100644 --- a/tests/about.spec.ts +++ b/tests/about.spec.ts @@ -5,7 +5,7 @@ test.describe('About Page Tests', () => { await page.getByText('אודות').click() await expect(page).toHaveURL('http://localhost:3000/about') const locator = await page.locator('li:has-text("אודות")') - await expect(locator).toHaveClass(/ant-menu-item-selected/) + await expect(locator).toHaveClass(/menu-item-selected/) }) test('page display title `מהו אתר “דאטאבוס”?`', async ({ page }) => { await page.goto('/about')