React 컴포넌트 테스트

문제 설명

React Testing Library를 사용하여 다음 컴포넌트들의 테스트를 작성하세요.

테스트할 컴포넌트

// Counter.jsx
function Counter({ initialCount = 0 }) {
  const [count, setCount] = useState(initialCount);
  return (
    <div>
      <span data-testid="count">{count}</span>
      <button onClick={() => setCount(c => c + 1)}>증가</button>
      <button onClick={() => setCount(c => c - 1)}>감소</button>
    </div>
  );
}

// LoginForm.jsx
function LoginForm({ onSubmit }) {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [error, setError] = useState("");

  const handleSubmit = (e) => {
    e.preventDefault();
    if (!email || !password) {
      setError("모든 필드를 입력하세요");
      return;
    }
    onSubmit({ email, password });
  };
  // ...
}

테스트 케이스

• 렌더링 테스트
• 사용자 상호작용 테스트
• 비동기 동작 테스트
• 에러 상태 테스트
• 접근성 테스트

평가 기준

• 테스트 커버리지
• 테스트 격리성
• Best Practices 준수