i18n 적용

tests/unit/LocaleProvider.spec.tsx

@@ -0,0 +1,56 @@
+import { describe, it, expect, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { LocaleProvider, useAppLocale, useLocaleActions } from "@/features/i18n/LocaleProvider";
+
+// LocaleProvider / useAppLocale / useLocaleActions TDD
+// - initialLocale 로 전달된 로케일이 하위 컴포넌트에서 그대로 노출되는지 검증한다.
+// - useLocaleActions 로 setLocale 을 호출하면 하위 컴포넌트의 로케일이 변경되어야 한다.
+
+describe("LocaleProvider", () => {
+  afterEach(() => {
+    cleanup();
+  });
+
+  function LocaleConsumer() {
+    const locale = useAppLocale();
+    return <div data-testid="current-locale">{locale}</div>;
+  }
+
+  function LocaleSetterButton({ next }: { next: "en" | "ko" }) {
+    const { setLocale } = useLocaleActions();
+    return (
+      <button type="button" onClick={() => setLocale(next)}>
+        set-{next}
+      </button>
+    );
+  }
+
+  it("initialLocale 로 en 을 전달하면 하위 컴포넌트에서 en 로케일을 읽을 수 있어야 한다", () => {
+    render(
+      <LocaleProvider initialLocale="en">
+        <LocaleConsumer />
+      </LocaleProvider>,
+    );
+
+    const current = screen.getByTestId("current-locale");
+
+		expect(current.textContent).toBe("en");
+  });
+
+  it("setLocale 을 호출하면 하위 컴포넌트의 useAppLocale 결과가 업데이트되어야 한다", () => {
+    render(
+      <LocaleProvider initialLocale="en">
+        <LocaleConsumer />
+        <LocaleSetterButton next="ko" />
+      </LocaleProvider>,
+    );
+
+    const current = screen.getByTestId("current-locale");
+
+		expect(current.textContent).toBe("en");
+
+    fireEvent.click(screen.getByText("set-ko"));
+
+    expect(current.textContent).toBe("ko");
+  });
+});