- Added BackButton component to standardize back navigation across pages. - Integrated BackButton into various pages, replacing custom back buttons for consistency. - Updated PageHeader to accept backTo prop for displaying BackButton when navigating from subpages. - Created useGoBack hook to handle navigation logic, determining whether to go back in history or redirect to a fallback page. - Added tests for BackButton and its integration with PageHeader to ensure expected behavior.
91 lines
3.1 KiB
TypeScript
91 lines
3.1 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from 'vitest';
|
|
import { screen, fireEvent, render } from '@testing-library/react';
|
|
import { MemoryRouter, Route, Routes, Link } from 'react-router-dom';
|
|
import BackButton from './BackButton';
|
|
import PageHeader from './PageHeader';
|
|
|
|
/**
|
|
* رفتار «بازگشت» باید در همهٔ صفحات یکی باشد: یک قدم عقب در تاریخچهٔ پنل، و وقتی
|
|
* صفحه مستقیم باز شده (تاریخچهای نیست) رفتن به صفحهٔ والد.
|
|
*/
|
|
function Detail({ fallback = '/admin/clinic-services' }: { fallback?: string }) {
|
|
return (
|
|
<>
|
|
<span>صفحهٔ جزئیات</span>
|
|
<BackButton fallback={fallback} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
function List() {
|
|
return (
|
|
<>
|
|
<span>صفحهٔ لیست</span>
|
|
<Link to="/admin/clinic-services/x1">باز کردن جزئیات</Link>
|
|
</>
|
|
);
|
|
}
|
|
|
|
function renderAt(initialEntries: string[]) {
|
|
return render(
|
|
<MemoryRouter initialEntries={initialEntries}>
|
|
<Routes>
|
|
<Route path="/admin/clinic-services" element={<List />} />
|
|
<Route path="/admin/clinic-services/:uuid" element={<Detail />} />
|
|
</Routes>
|
|
</MemoryRouter>,
|
|
);
|
|
}
|
|
|
|
beforeEach(() => vi.clearAllMocks());
|
|
|
|
describe('BackButton', () => {
|
|
it('ظاهر یکسان دارد: همان دکمهٔ بازگشتِ صفحهٔ سرویسها', () => {
|
|
renderAt(['/admin/clinic-services/x1']);
|
|
|
|
const btn = screen.getByRole('button', { name: /بازگشت/ });
|
|
expect(btn).toHaveClass('cp-btn-secondary');
|
|
expect(btn).toHaveAttribute('type', 'button');
|
|
});
|
|
|
|
it('وقتی از صفحهٔ دیگری آمدهایم، یک قدم به همان صفحه برمیگردد', () => {
|
|
renderAt(['/admin/clinic-services']);
|
|
|
|
fireEvent.click(screen.getByText('باز کردن جزئیات'));
|
|
expect(screen.getByText('صفحهٔ جزئیات')).toBeInTheDocument();
|
|
|
|
fireEvent.click(screen.getByRole('button', { name: /بازگشت/ }));
|
|
expect(screen.getByText('صفحهٔ لیست')).toBeInTheDocument();
|
|
});
|
|
|
|
it('در ورود مستقیم (بدون تاریخچه) به صفحهٔ والد میرود', () => {
|
|
renderAt(['/admin/clinic-services/x1']);
|
|
|
|
fireEvent.click(screen.getByRole('button', { name: /بازگشت/ }));
|
|
|
|
expect(screen.getByText('صفحهٔ لیست')).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('PageHeader — backTo', () => {
|
|
it('با backTo دکمهٔ بازگشت را نشان میدهد', () => {
|
|
render(
|
|
<MemoryRouter initialEntries={['/admin/claims/p1']}>
|
|
<PageHeader title="پروندهٔ بیمه" backTo="/admin/claims" />
|
|
</MemoryRouter>,
|
|
);
|
|
|
|
expect(screen.getByRole('button', { name: /بازگشت/ })).toBeInTheDocument();
|
|
});
|
|
|
|
it('بدون backTo دکمهای رندر نمیشود (صفحات سطحاول)', () => {
|
|
render(
|
|
<MemoryRouter>
|
|
<PageHeader title="مطالبات بیمه" />
|
|
</MemoryRouter>,
|
|
);
|
|
|
|
expect(screen.queryByRole('button', { name: /بازگشت/ })).not.toBeInTheDocument();
|
|
});
|
|
});
|