hamedandClaude Opus 4.8
d567ea5553
SessionStepper copied MUI's LTR connector offsets (left: -50%), which in the RTL admin drew each connector away from its previous step — a stray line ran off the card edge past the last step and the first two steps had no line between them. Swap the offsets so connectors extend toward the previous step on the right, matching tauri's MUI-flipped rendering. The acceptance-time field showed two clock icons (custom ClockP + the browser's native picker indicator); hide the native one like the tauri source, which has a single ClockField adornment. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
36 lines
1.9 KiB
TypeScript
36 lines
1.9 KiB
TypeScript
import { describe, it, expect } from 'vitest';
|
|
import { render, screen } from '@testing-library/react';
|
|
import SessionStepper from './SessionStepper';
|
|
|
|
const STEPS = ['ایجاد سرویس', 'پرداخت', 'جزییات'];
|
|
|
|
describe('SessionStepper', () => {
|
|
it('برچسب همه گامها و یک کانکتور بهازای هر گام غیر از اولی', () => {
|
|
render(<SessionStepper steps={STEPS} activeStep={0} />);
|
|
STEPS.forEach((l) => expect(screen.getByText(l)).toBeInTheDocument());
|
|
expect(screen.getByTestId('step-connector-1')).toBeInTheDocument();
|
|
expect(screen.getByTestId('step-connector-2')).toBeInTheDocument();
|
|
expect(screen.queryByTestId('step-connector-0')).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('کانکتور سمت گامِ قبلی (راست در RTL) کشیده میشود، نه بیرون از لبه چپ', () => {
|
|
render(<SessionStepper steps={STEPS} activeStep={0} />);
|
|
const c = screen.getByTestId('step-connector-2');
|
|
// RTL: امتداد به سمت راست (گام قبلی) → left مثبت از مرکز، right منفی
|
|
expect(c.style.left).toBe('calc(50% + 40px)');
|
|
expect(c.style.right).toBe('calc(-50% + 40px)');
|
|
});
|
|
|
|
it('کانکتور گامهای طیشده بنفش و بقیه خاکستری', () => {
|
|
render(<SessionStepper steps={STEPS} activeStep={1} />);
|
|
// jsdom رنگ hex را به rgb نرمال میکند
|
|
expect(screen.getByTestId('step-connector-1').style.background).toContain('rgb(85, 89, 206)');
|
|
expect(screen.getByTestId('step-connector-2').style.background).toContain('rgb(234, 234, 240)');
|
|
});
|
|
|
|
it('استپر خالی: بدون کرش و بدون کانکتور', () => {
|
|
const { container } = render(<SessionStepper steps={[]} activeStep={0} />);
|
|
expect(container.querySelectorAll('[data-testid^="step-connector"]').length).toBe(0);
|
|
});
|
|
});
|