122 lines
4.1 KiB
TypeScript
122 lines
4.1 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { act, fireEvent, render, screen, within } from '@testing-library/react';
|
|
import userEvent from '@testing-library/user-event';
|
|
import { expect, test, vi } from 'vitest';
|
|
|
|
import { PlatformMudPointWalletEntry } from './PlatformMudPointWalletEntry.tsx';
|
|
|
|
import { formatMudPointCount } from '@/packages/shared/src/utils/format.ts';
|
|
|
|
const breakdown = {
|
|
totalPoints: 207,
|
|
permanentPoints: 100,
|
|
limitedPoints: 80,
|
|
limitedExpiresAt: '2026-07-06T16:00:00Z',
|
|
dailyFreePoints: 27,
|
|
dailyFreeResetPoints: 20,
|
|
dailyFreeResetsAt: '2026-07-12T16:00:00Z',
|
|
};
|
|
|
|
test('formats mud point counts consistently', () => {
|
|
expect(formatMudPointCount(12_345)).toBe('12,345');
|
|
expect(formatMudPointCount(12_345, true)).toBe('1.2万');
|
|
});
|
|
|
|
test('shows only permanent and daily free points in the shared wallet panel', async () => {
|
|
const user = userEvent.setup();
|
|
const onRequestDetails = vi.fn();
|
|
const onRecharge = vi.fn();
|
|
const onOpenLedger = vi.fn();
|
|
|
|
render(
|
|
<PlatformMudPointWalletEntry
|
|
balance={999}
|
|
breakdown={breakdown}
|
|
onRequestDetails={onRequestDetails}
|
|
onRecharge={onRecharge}
|
|
onOpenLedger={onOpenLedger}
|
|
/>,
|
|
);
|
|
|
|
const balanceButton = screen.getByRole('button', { name: '泥点 207' });
|
|
await user.hover(balanceButton);
|
|
|
|
const details = screen.getByRole('dialog', { name: '泥点账户详情' });
|
|
expect(details.className).toContain('rounded-[1.12rem]');
|
|
expect(within(details).getByText('不限时泥点')).toBeTruthy();
|
|
expect(within(details).getByText('按量充值、兑换码获得')).toBeTruthy();
|
|
expect(within(details).getByText('100')).toBeTruthy();
|
|
expect(within(details).queryByText('限时泥点')).toBeNull();
|
|
expect(within(details).queryByText('2026-07-07 到期')).toBeNull();
|
|
expect(within(details).getByText('每日免费泥点')).toBeTruthy();
|
|
expect(within(details).getByText('27')).toBeTruthy();
|
|
expect(within(details).getByText('每天重置为 20 泥点')).toBeTruthy();
|
|
expect(onRequestDetails).not.toHaveBeenCalled();
|
|
|
|
await user.click(within(details).getByRole('button', { name: '使用详情' }));
|
|
expect(onOpenLedger).toHaveBeenCalledTimes(1);
|
|
|
|
await user.click(screen.getByRole('button', { name: '充值' }));
|
|
expect(onRecharge).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
test('keeps the desktop panel open while moving across the gap without click pinning', () => {
|
|
vi.useFakeTimers();
|
|
|
|
try {
|
|
render(
|
|
<PlatformMudPointWalletEntry
|
|
balance={207}
|
|
breakdown={breakdown}
|
|
onRequestDetails={vi.fn()}
|
|
onRecharge={vi.fn()}
|
|
onOpenLedger={vi.fn()}
|
|
/>,
|
|
);
|
|
|
|
const balanceButton = screen.getByRole('button', { name: '泥点 207' });
|
|
const root = balanceButton.closest('.platform-mud-point-wallet-entry');
|
|
expect(root).toBeTruthy();
|
|
|
|
fireEvent.mouseEnter(balanceButton);
|
|
const details = screen.getByRole('dialog', { name: '泥点账户详情' });
|
|
|
|
fireEvent.mouseLeave(root as HTMLElement, { relatedTarget: null });
|
|
fireEvent.mouseEnter(details);
|
|
act(() => vi.advanceTimersByTime(120));
|
|
expect(screen.getByRole('dialog', { name: '泥点账户详情' })).toBeTruthy();
|
|
|
|
balanceButton.focus();
|
|
fireEvent.click(balanceButton);
|
|
expect(screen.getByRole('dialog', { name: '泥点账户详情' })).toBeTruthy();
|
|
|
|
fireEvent.mouseLeave(root as HTMLElement, { relatedTarget: null });
|
|
act(() => vi.advanceTimersByTime(120));
|
|
expect(screen.queryByRole('dialog', { name: '泥点账户详情' })).toBeNull();
|
|
} finally {
|
|
vi.useRealTimers();
|
|
}
|
|
});
|
|
|
|
test('requests the balance breakdown when a compact entry opens', async () => {
|
|
const user = userEvent.setup();
|
|
const onRequestDetails = vi.fn();
|
|
|
|
render(
|
|
<PlatformMudPointWalletEntry
|
|
balance={20}
|
|
breakdown={null}
|
|
isLoading={false}
|
|
variant="mobile"
|
|
onRequestDetails={onRequestDetails}
|
|
onRecharge={vi.fn()}
|
|
onOpenLedger={vi.fn()}
|
|
/>,
|
|
);
|
|
|
|
await user.click(screen.getByRole('button', { name: '泥点 20' }));
|
|
expect(onRequestDetails).toHaveBeenCalledTimes(1);
|
|
expect(screen.getByText('余额明细暂不可用')).toBeTruthy();
|
|
});
|