From ad1d1a47d65153c52a606c0fcea8d2d81d89b1a6 Mon Sep 17 00:00:00 2001
From: Ivan <8611739+IRBorisov@users.noreply.github.com>
Date: Thu, 6 Mar 2025 22:26:08 +0300
Subject: [PATCH] T: Add logout test

---
 rsconcept/frontend/playwright.config.ts       |  1 +
 .../src/app/Navigation/NavigationButton.tsx   | 21 ++++++-------------
 .../src/app/Navigation/UserButton.tsx         |  6 +++++-
 .../frontend/src/app/Navigation/UserMenu.tsx  |  6 +++++-
 .../src/components/Dropdown/Dropdown.tsx      |  1 +
 rsconcept/frontend/tests/auth.spec.ts         | 15 ++++++++++++-
 6 files changed, 32 insertions(+), 18 deletions(-)

diff --git a/rsconcept/frontend/playwright.config.ts b/rsconcept/frontend/playwright.config.ts
index 66e16690..d7754138 100644
--- a/rsconcept/frontend/playwright.config.ts
+++ b/rsconcept/frontend/playwright.config.ts
@@ -5,6 +5,7 @@ export default defineConfig({
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 2 : 0,
   reporter: 'list',
+  fullyParallel: true,
   projects: [
     {
       name: 'Desktop Chrome',
diff --git a/rsconcept/frontend/src/app/Navigation/NavigationButton.tsx b/rsconcept/frontend/src/app/Navigation/NavigationButton.tsx
index 683a311b..95002f92 100644
--- a/rsconcept/frontend/src/app/Navigation/NavigationButton.tsx
+++ b/rsconcept/frontend/src/app/Navigation/NavigationButton.tsx
@@ -1,32 +1,23 @@
 import clsx from 'clsx';
 
-import { type Styling, type Titled } from '@/components/props';
+import { type Styling } from '@/components/props';
 import { globalIDs } from '@/utils/constants';
 
-interface NavigationButtonProps extends Titled, Styling {
+interface NavigationButtonProps extends Styling {
   text?: string;
+  title?: string;
   icon: React.ReactNode;
   onClick?: (event: React.MouseEvent<Element>) => void;
 }
 
-export function NavigationButton({
-  icon,
-  title,
-  className,
-  style,
-  titleHtml,
-  hideTitle,
-  onClick,
-  text
-}: NavigationButtonProps) {
+export function NavigationButton({ icon, title, className, style, onClick, text }: NavigationButtonProps) {
   return (
     <button
       type='button'
       tabIndex={-1}
-      data-tooltip-id={!!title || !!titleHtml ? globalIDs.tooltip : undefined}
-      data-tooltip-html={titleHtml}
+      aria-label={title}
+      data-tooltip-id={!!title ? globalIDs.tooltip : undefined}
       data-tooltip-content={title}
-      data-tooltip-hidden={hideTitle}
       onClick={onClick}
       className={clsx(
         'mr-1 h-full',
diff --git a/rsconcept/frontend/src/app/Navigation/UserButton.tsx b/rsconcept/frontend/src/app/Navigation/UserButton.tsx
index 1501633a..c75f3181 100644
--- a/rsconcept/frontend/src/app/Navigation/UserButton.tsx
+++ b/rsconcept/frontend/src/app/Navigation/UserButton.tsx
@@ -8,9 +8,10 @@ import { NavigationButton } from './NavigationButton';
 interface UserButtonProps {
   onLogin: () => void;
   onClickUser: () => void;
+  isOpen: boolean;
 }
 
-export function UserButton({ onLogin, onClickUser }: UserButtonProps) {
+export function UserButton({ onLogin, onClickUser, isOpen }: UserButtonProps) {
   const { user, isAnonymous } = useAuthSuspense();
   const adminMode = usePreferencesStore(state => state.adminMode);
   if (isAnonymous) {
@@ -26,6 +27,9 @@ export function UserButton({ onLogin, onClickUser }: UserButtonProps) {
     return (
       <NavigationButton
         className='cc-fade-in'
+        title='Пользователь'
+        aria-haspopup='true'
+        aria-expanded={isOpen}
         icon={<IconUser2 size='1.5rem' className={adminMode && user.is_staff ? 'icon-primary' : ''} />}
         onClick={onClickUser}
       />
diff --git a/rsconcept/frontend/src/app/Navigation/UserMenu.tsx b/rsconcept/frontend/src/app/Navigation/UserMenu.tsx
index 2a0dc9de..47a2567a 100644
--- a/rsconcept/frontend/src/app/Navigation/UserMenu.tsx
+++ b/rsconcept/frontend/src/app/Navigation/UserMenu.tsx
@@ -15,7 +15,11 @@ export function UserMenu() {
   return (
     <div ref={menu.ref} className='h-full w-[4rem] flex items-center justify-center'>
       <Suspense fallback={<Loader circular scale={1.5} />}>
-        <UserButton onLogin={() => router.push({ path: urls.login, force: true })} onClickUser={menu.toggle} />
+        <UserButton
+          onLogin={() => router.push({ path: urls.login, force: true })}
+          onClickUser={menu.toggle}
+          isOpen={menu.isOpen}
+        />
       </Suspense>
       <UserDropdown isOpen={menu.isOpen} hideDropdown={() => menu.hide()} />
     </div>
diff --git a/rsconcept/frontend/src/components/Dropdown/Dropdown.tsx b/rsconcept/frontend/src/components/Dropdown/Dropdown.tsx
index e223777f..d481f22f 100644
--- a/rsconcept/frontend/src/components/Dropdown/Dropdown.tsx
+++ b/rsconcept/frontend/src/components/Dropdown/Dropdown.tsx
@@ -54,6 +54,7 @@ export function Dropdown({
           clipPath: isOpen ? 'inset(0% 0% 0% 0%)' : 'inset(10% 0% 90% 0%)',
           ...style
         }}
+        aria-hidden={!isOpen}
         {...restProps}
       >
         {children}
diff --git a/rsconcept/frontend/tests/auth.spec.ts b/rsconcept/frontend/tests/auth.spec.ts
index b23fc319..9f360f32 100644
--- a/rsconcept/frontend/tests/auth.spec.ts
+++ b/rsconcept/frontend/tests/auth.spec.ts
@@ -1,4 +1,4 @@
-import { setupLogin } from './mocks/auth';
+import { authAdmin, setupLogin, setupLogout } from './mocks/auth';
 import { expect, test } from './setup';
 
 test('should display error message when login with wrong credentials', async ({ page }) => {
@@ -23,3 +23,16 @@ test('should login as admin successfully', async ({ page }) => {
   await expect(page.getByText('Вы вошли в систему как admin')).toBeVisible();
   await expect(page.getByRole('button', { name: 'Войти' })).toHaveCount(0);
 });
+
+test('logout procedure and consequence', async ({ page }) => {
+  authAdmin();
+  await setupLogout(page);
+
+  await page.goto('/');
+
+  await page.getByRole('button', { name: 'Пользователь' }).click();
+  await page.getByRole('button', { name: 'Выйти' }).click();
+
+  await page.getByRole('button', { name: 'Перейти на страницу логина' }).click();
+  await expect(page.getByRole('button', { name: 'Войти' })).toBeVisible();
+});