jubakitiashvili/everything-react-native-expo/tdd-workflow

import { render, screen, fireEvent } from '@testing-library/react-native';
import { LoginForm } from '../LoginForm';
describe('LoginForm', () => {
  it('disables submit when fields are empty', () => {
    render(<LoginForm onSubmit={jest.fn()} />);
    const submitButton = screen.getByRole('button', { name: /sign in/i });
    expect(submitButton).toBeDisabled();
  });
  it('calls onSubmit with email and password', () => {
    const onSubmit = jest.fn();
    render(<LoginForm onSubmit={onSubmit} />);
    fireEvent.changeText(screen.getByPlaceholderText(/email/i), 'user@test.com');
    fireEvent.changeText(screen.getByPlaceholderText(/password/i), 'secret123');
    fireEvent.press(screen.getByRole('button', { name: /sign in/i }));
    expect(onSubmit).toHaveBeenCalledWith({
      email: 'user@test.com',
      password: 'secret123',
    });
  });
  it('shows error message on failed login', async () => {
    const onSubmit = jest.fn().mockRejectedValue(new Error('Invalid credentials'));
    render(<LoginForm onSubmit={onSubmit} />);
    fireEvent.changeText(screen.getByPlaceholderText(/email/i), 'user@test.com');
    fireEvent.changeText(screen.getByPlaceholderText(/password/i), 'wrong');
    fireEvent.press(screen.getByRole('button', { name: /sign in/i }));
    expect(await screen.findByText(/invalid credentials/i)).toBeTruthy();
  });
});

export function LoginForm({ onSubmit }: LoginFormProps) {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [error, setError] = useState<string | null>(null);
  const handleSubmit = async () => {
    try {
      await onSubmit({ email, password });
    } catch (e) {
      setError(e instanceof Error ? e.message : 'Unknown error');
    }
  };
  return (
    <View>
      <TextInput placeholder="Email" value={email} onChangeText={setEmail} />
      <TextInput placeholder="Password" value={password} onChangeText={setPassword} secureTextEntry />
      <Pressable
        onPress={handleSubmit}
        disabled={!email || !password}
        accessibilityRole="button"
        accessibilityLabel="Sign in"
      >
        <Text>Sign In</Text>
      </Pressable>
      {error && <Text>{error}</Text>}
    </View>
  );
}

src/features/auth/
  LoginForm.tsx
  __tests__/
    LoginForm.test.tsx
  hooks/
    useLoginForm.ts
    __tests__/
      useLoginForm.test.ts