feat: add DigitInput component; force English digits for phone & national code
New reusable DigitInput normalizes Persian/Arabic digits to English on input, strips non-digits, enforces maxDigits, and is always LTR + numeric keyboard. Use it for the phone and national-code fields on the appointment create page (phone previously kept raw Persian digits; national code lost Persian digits to the \D strip). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,29 @@
|
||||
import { describe, it, expect, vi } from 'vitest';
|
||||
import { render, screen, fireEvent } from '@testing-library/react';
|
||||
import DigitInput from './DigitInput';
|
||||
|
||||
describe('DigitInput — ورودی عددی با تبدیل رقم فارسی', () => {
|
||||
it('converts Persian/Arabic digits to English (happy path)', () => {
|
||||
const onChange = vi.fn();
|
||||
render(<DigitInput value="" onChange={onChange} placeholder="p" />);
|
||||
fireEvent.change(screen.getByPlaceholderText('p'), { target: { value: '۰۹۱۲٣٤' } });
|
||||
expect(onChange).toHaveBeenCalledWith('091234');
|
||||
});
|
||||
|
||||
it('strips non-digit characters (error/garbage input)', () => {
|
||||
const onChange = vi.fn();
|
||||
render(<DigitInput value="" onChange={onChange} placeholder="p" />);
|
||||
fireEvent.change(screen.getByPlaceholderText('p'), { target: { value: '0a9 1-2b' } });
|
||||
expect(onChange).toHaveBeenCalledWith('0912');
|
||||
});
|
||||
|
||||
it('enforces maxDigits and handles empty input (boundary)', () => {
|
||||
const onChange = vi.fn();
|
||||
render(<DigitInput value="" onChange={onChange} maxDigits={10} placeholder="p" />);
|
||||
const input = screen.getByPlaceholderText('p');
|
||||
fireEvent.change(input, { target: { value: '۱۲۳۴۵۶۷۸۹۰۱۲' } });
|
||||
expect(onChange).toHaveBeenCalledWith('1234567890');
|
||||
expect(input).toHaveAttribute('dir', 'ltr');
|
||||
expect(input).toHaveAttribute('inputmode', 'numeric');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user