T: Add logout test

This commit is contained in:
Ivan 2025-03-06 22:26:08 +03:00
parent 28b147ed28
commit ad1d1a47d6
6 changed files with 32 additions and 18 deletions

View File

@ -5,6 +5,7 @@ export default defineConfig({
forbidOnly: !!process.env.CI, forbidOnly: !!process.env.CI,
retries: process.env.CI ? 2 : 0, retries: process.env.CI ? 2 : 0,
reporter: 'list', reporter: 'list',
fullyParallel: true,
projects: [ projects: [
{ {
name: 'Desktop Chrome', name: 'Desktop Chrome',

View File

@ -1,32 +1,23 @@
import clsx from 'clsx'; import clsx from 'clsx';
import { type Styling, type Titled } from '@/components/props'; import { type Styling } from '@/components/props';
import { globalIDs } from '@/utils/constants'; import { globalIDs } from '@/utils/constants';
interface NavigationButtonProps extends Titled, Styling { interface NavigationButtonProps extends Styling {
text?: string; text?: string;
title?: string;
icon: React.ReactNode; icon: React.ReactNode;
onClick?: (event: React.MouseEvent<Element>) => void; onClick?: (event: React.MouseEvent<Element>) => void;
} }
export function NavigationButton({ export function NavigationButton({ icon, title, className, style, onClick, text }: NavigationButtonProps) {
icon,
title,
className,
style,
titleHtml,
hideTitle,
onClick,
text
}: NavigationButtonProps) {
return ( return (
<button <button
type='button' type='button'
tabIndex={-1} tabIndex={-1}
data-tooltip-id={!!title || !!titleHtml ? globalIDs.tooltip : undefined} aria-label={title}
data-tooltip-html={titleHtml} data-tooltip-id={!!title ? globalIDs.tooltip : undefined}
data-tooltip-content={title} data-tooltip-content={title}
data-tooltip-hidden={hideTitle}
onClick={onClick} onClick={onClick}
className={clsx( className={clsx(
'mr-1 h-full', 'mr-1 h-full',

View File

@ -8,9 +8,10 @@ import { NavigationButton } from './NavigationButton';
interface UserButtonProps { interface UserButtonProps {
onLogin: () => void; onLogin: () => void;
onClickUser: () => void; onClickUser: () => void;
isOpen: boolean;
} }
export function UserButton({ onLogin, onClickUser }: UserButtonProps) { export function UserButton({ onLogin, onClickUser, isOpen }: UserButtonProps) {
const { user, isAnonymous } = useAuthSuspense(); const { user, isAnonymous } = useAuthSuspense();
const adminMode = usePreferencesStore(state => state.adminMode); const adminMode = usePreferencesStore(state => state.adminMode);
if (isAnonymous) { if (isAnonymous) {
@ -26,6 +27,9 @@ export function UserButton({ onLogin, onClickUser }: UserButtonProps) {
return ( return (
<NavigationButton <NavigationButton
className='cc-fade-in' className='cc-fade-in'
title='Пользователь'
aria-haspopup='true'
aria-expanded={isOpen}
icon={<IconUser2 size='1.5rem' className={adminMode && user.is_staff ? 'icon-primary' : ''} />} icon={<IconUser2 size='1.5rem' className={adminMode && user.is_staff ? 'icon-primary' : ''} />}
onClick={onClickUser} onClick={onClickUser}
/> />

View File

@ -15,7 +15,11 @@ export function UserMenu() {
return ( return (
<div ref={menu.ref} className='h-full w-[4rem] flex items-center justify-center'> <div ref={menu.ref} className='h-full w-[4rem] flex items-center justify-center'>
<Suspense fallback={<Loader circular scale={1.5} />}> <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> </Suspense>
<UserDropdown isOpen={menu.isOpen} hideDropdown={() => menu.hide()} /> <UserDropdown isOpen={menu.isOpen} hideDropdown={() => menu.hide()} />
</div> </div>

View File

@ -54,6 +54,7 @@ export function Dropdown({
clipPath: isOpen ? 'inset(0% 0% 0% 0%)' : 'inset(10% 0% 90% 0%)', clipPath: isOpen ? 'inset(0% 0% 0% 0%)' : 'inset(10% 0% 90% 0%)',
...style ...style
}} }}
aria-hidden={!isOpen}
{...restProps} {...restProps}
> >
{children} {children}

View File

@ -1,4 +1,4 @@
import { setupLogin } from './mocks/auth'; import { authAdmin, setupLogin, setupLogout } from './mocks/auth';
import { expect, test } from './setup'; import { expect, test } from './setup';
test('should display error message when login with wrong credentials', async ({ page }) => { 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.getByText('Вы вошли в систему как admin')).toBeVisible();
await expect(page.getByRole('button', { name: 'Войти' })).toHaveCount(0); 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();
});