38 lines
1.0 KiB
TypeScript
38 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
export function SampleCounter() {
|
|
const [count, setCount] = useState(0);
|
|
|
|
return (
|
|
<div style={{ padding: "20px", textAlign: "center" }}>
|
|
<h2>단위 테스트 샘플 카운터</h2>
|
|
<p data-testid="counter-value" style={{ fontSize: "24px", fontWeight: "bold" }}>
|
|
현재 값: {count}
|
|
</p>
|
|
<div style={{ display: "flex", gap: "10px", justifyContent: "center" }}>
|
|
<button
|
|
onClick={() => setCount((prev) => prev - 1)}
|
|
style={{ padding: "8px 16px" }}
|
|
aria-label="decrease"
|
|
>
|
|
감소 (-)
|
|
</button>
|
|
<button
|
|
onClick={() => setCount((prev) => prev + 1)}
|
|
style={{ padding: "8px 16px" }}
|
|
aria-label="increase"
|
|
>
|
|
증가 (+)
|
|
</button>
|
|
</div>
|
|
{count > 5 && (
|
|
<p data-testid="warning-message" style={{ color: "red", marginTop: "10px" }}>
|
|
값이 5를 초과했습니다!
|
|
</p>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|