@ncds/ui-admin 1.8.27 → 1.8.28-alpha.1

package/dist/temp/src/components/forms-and-input/combo-box/__tests__/ComboBox.interaction.test.js

@@ -0,0 +1,295 @@
+// @vitest-environment jsdom
+//
+// React ComboBox 상호작용 — 위험 목록표 RCB-03~14 (PR-7c).
+// 입력창 키보드·click·변경, 지우기·「전체」, 다중 경계, 편집, disabled 전환, 옵션 아이콘을 실구현으로 구동한다.
+import { createElement } from 'react';
+import { act } from 'react-dom/test-utils';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { ComboBox } from '../ComboBox';
+import { allButton, click, findByText, mountControlled, mountRoot, onCleanup, requireElement, runCleanups, } from './comboBoxTestUtils';
+// @ncds/ui-admin-icon 은 react@19 를 해석해 react-dom@18 이 거부하는 엘리먼트를 만든다 (ComboBox.portal.test.ts 와 같은 스텁)
+vi.mock('@ncds/ui-admin-icon', () => {
+    const IconStub = () => null;
+    return {
+        CheckCircle: IconStub,
+        ChevronSelectorVertical: IconStub,
+        HelpCircle: IconStub,
+        InfoCircle: IconStub,
+        SearchLg: IconStub,
+        X: IconStub,
+        XClose: IconStub,
+    };
+});
+const APPLE_ID = 1;
+const BANANA_ID = 2;
+const OPTIONS = [
+    { id: APPLE_ID, label: '사과' },
+    { id: BANANA_ID, label: '바나나' },
+];
+const OPTION_CLASS = 'ncua-select-dropdown__option';
+const FOCUSED_CLASS = 'ncua-select-dropdown__option--focused';
+afterEach(runCleanups);
+const mount = (props) => {
+    const { container, render } = mountRoot();
+    const rerender = (next) => render(createElement(ComboBox, next));
+    rerender(props);
+    return { container, rerender };
+};
+const hasButton = (scope, text) => Array.from(scope.querySelectorAll('button')).some((button) => button.textContent === text);
+const input = (container) => requireElement(container, 'input[role="combobox"]');
+const isPanelOpen = (container) => container.querySelector('.ncua-select-dropdown') !== null;
+const optionLabels = (container) => Array.from(container.querySelectorAll(`.${OPTION_CLASS}`)).map((option) => option.textContent);
+const focusedLabels = (container) => Array.from(container.querySelectorAll(`.${FOCUSED_CLASS}`)).map((option) => option.textContent);
+const clickOption = (container, label) => {
+    click(findByText(container, `.${OPTION_CLASS}`, label));
+};
+/** React 가 값 변경을 감지하도록 prototype setter 로 값을 넣고 input 이벤트를 보낸다 */
+const typeText = (container, text) => {
+    const field = input(container);
+    const setValue = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set;
+    if (setValue === undefined)
+        throw new Error('HTMLInputElement value setter 가 없습니다');
+    act(() => {
+        setValue.call(field, text);
+        field.dispatchEvent(new Event('input', { bubbles: true }));
+    });
+};
+const pressKey = (container, key) => {
+    const event = new KeyboardEvent('keydown', { key, bubbles: true, cancelable: true });
+    act(() => {
+        input(container).dispatchEvent(event);
+    });
+    return event;
+};
+describe('RCB-08 다중 선택 경계', () => {
+    it('RCB-08 maxSelection 에 도달하면 새 옵션 click 이 onChange 를 부르지 않고 「전체 선택」도 숨긴다', () => {
+        const onChangeSpy = vi.fn();
+        const container = mountControlled({
+            optionItems: OPTIONS,
+            multiple: true,
+            maxSelection: 1,
+            initialValue: [APPLE_ID],
+            onChangeSpy,
+        });
+        click(allButton(container));
+        clickOption(container, '바나나');
+        expect(onChangeSpy).not.toHaveBeenCalled();
+        expect(hasButton(container, '전체 선택')).toBe(false);
+    });
+    it('RCB-08 다중에서 value 를 넘기지 않으면 첫 옵션 click 이 [id] 로 시작한다', () => {
+        const onChange = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, multiple: true, onChange });
+        click(allButton(container));
+        clickOption(container, '사과');
+        expect(onChange).toHaveBeenCalledWith([APPLE_ID]);
+    });
+});
+describe('RCB-03 입력창 키보드', () => {
+    it('RCB-03 열린 목록에서 ArrowDown·ArrowUp 이 포커스를 옮기고 Enter 가 포커스 옵션을 선택해 단일은 닫는다', () => {
+        const onChange = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onChange });
+        typeText(container, '과');
+        pressKey(container, 'ArrowDown');
+        pressKey(container, 'ArrowDown');
+        const afterDown = focusedLabels(container);
+        pressKey(container, 'ArrowUp');
+        const afterUp = focusedLabels(container);
+        pressKey(container, 'Enter');
+        expect({ afterDown, afterUp }).toEqual({ afterDown: ['바나나'], afterUp: ['사과'] });
+        expect(onChange).toHaveBeenCalledWith(APPLE_ID);
+        expect(isPanelOpen(container)).toBe(false);
+    });
+    it('RCB-03 닫힌 상태의 ArrowDown 은 목록을 연다', () => {
+        const { container } = mount({ optionItems: OPTIONS });
+        pressKey(container, 'ArrowDown');
+        expect(isPanelOpen(container)).toBe(true);
+    });
+    it('RCB-03 열린 상태의 Escape 는 닫고, 닫힌 상태의 Escape 는 훅으로 넘어가 아무것도 하지 않는다', () => {
+        const { container } = mount({ optionItems: OPTIONS });
+        typeText(container, '과');
+        const openEscape = pressKey(container, 'Escape');
+        const afterOpenEscape = isPanelOpen(container);
+        const closedEscape = pressKey(container, 'Escape');
+        expect({
+            afterOpenEscape,
+            openPrevented: openEscape.defaultPrevented,
+            closedPrevented: closedEscape.defaultPrevented,
+            afterClosedEscape: isPanelOpen(container),
+        }).toEqual({ afterOpenEscape: false, openPrevented: true, closedPrevented: false, afterClosedEscape: false });
+    });
+});
+describe('RCB-04 입력창 Space', () => {
+    it('RCB-04 Space keydown 은 기본 동작을 막아 닫혀 있으면 열고, 열림 + 포커스 옵션이면 그 옵션을 선택한다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (useDropdownKeyboard 의 Enter/Space 처리를 input 에 그대로 연결해 검색어에 공백을 칠 수 없음)
+        const onChange = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onChange });
+        const closedSpace = pressKey(container, ' ');
+        const openedBySpace = isPanelOpen(container);
+        typeText(container, '과');
+        pressKey(container, 'ArrowDown');
+        const openSpace = pressKey(container, ' ');
+        expect({
+            closedPrevented: closedSpace.defaultPrevented,
+            openedBySpace,
+            openPrevented: openSpace.defaultPrevented,
+        }).toEqual({ closedPrevented: true, openedBySpace: true, openPrevented: true });
+        expect(onChange).toHaveBeenCalledWith(APPLE_ID);
+    });
+    it.todo('RCB-04 입력창 Space 는 검색어에 공백을 입력하고 패널 열기·옵션 선택에 쓰지 않아야 한다');
+});
+describe('RCB-05 「전체」 버튼', () => {
+    it('RCB-05 disabled 면 「전체」 click 을 무시해 onSearch 를 부르지 않고 닫힌 채다', () => {
+        const onSearch = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onSearch, disabled: true });
+        click(allButton(container));
+        expect(onSearch).not.toHaveBeenCalled();
+        expect(isPanelOpen(container)).toBe(false);
+    });
+    it('RCB-05 이미 열려 있으면 「전체」가 입력·검색어만 비우고 전체 목록으로 열린 채 둔다', () => {
+        const onSearch = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onSearch });
+        typeText(container, '과');
+        click(allButton(container));
+        expect({ value: input(container).value, open: isPanelOpen(container), labels: optionLabels(container) }).toEqual({
+            value: '',
+            open: true,
+            labels: ['사과', '바나나'],
+        });
+        expect(onSearch).toHaveBeenLastCalledWith('');
+    });
+});
+describe('RCB-06 지우기 버튼', () => {
+    it('RCB-06 지우기가 입력을 비우고 onSearch("") 를 부르며 패널은 결과 없음으로 열린 채다', () => {
+        const onSearch = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onSearch });
+        typeText(container, '과');
+        click(requireElement(container, '.ncua-input__clear'));
+        expect({
+            value: input(container).value,
+            open: isPanelOpen(container),
+            noResults: container.querySelector('.ncua-select-dropdown__no-results') !== null,
+        }).toEqual({ value: '', open: true, noResults: true });
+        expect(onSearch).toHaveBeenLastCalledWith('');
+    });
+});
+describe('RCB-07 열린 상태의 입력 변경', () => {
+    it('RCB-07 열린 채 입력이 바뀌면 다시 토글하지 않고 열린 채 onSearch 에 새 값을 넘긴다', () => {
+        const onSearch = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onSearch });
+        typeText(container, '사');
+        typeText(container, '사과');
+        expect(isPanelOpen(container)).toBe(true);
+        expect(onSearch).toHaveBeenLastCalledWith('사과');
+    });
+});
+describe('RCB-09 onChange 없는 다중', () => {
+    const errors = [];
+    const recordError = (event) => {
+        event.preventDefault();
+        errors.push(event.message);
+    };
+    // React 18 은 이벤트 핸들러 예외를 click() 밖으로 던지지 않고 window error 로 보고하므로 이쪽으로 받는다
+    const listenErrors = () => {
+        window.addEventListener('error', recordError);
+        onCleanup(() => {
+            window.removeEventListener('error', recordError);
+            errors.length = 0;
+        });
+    };
+    it('RCB-09 onChange 없이 「전체 선택」을 눌러도 예외 없이 아무것도 바꾸지 않는다', () => {
+        listenErrors();
+        const { container } = mount({ optionItems: OPTIONS, multiple: true, value: [] });
+        click(allButton(container));
+        click(findByText(container, 'button', '전체 선택'));
+        expect(errors).toEqual([]);
+        expect(container.querySelectorAll('.ncua-tag')).toHaveLength(0);
+    });
+    it('RCB-09 onChange 없이 태그 X 를 눌러도 예외 없이 태그가 남는다', () => {
+        listenErrors();
+        const { container } = mount({ optionItems: OPTIONS, multiple: true, value: [APPLE_ID] });
+        click(requireElement(container, '.ncua-tag__close'));
+        expect(errors).toEqual([]);
+        expect(Array.from(container.querySelectorAll('.ncua-tag__text')).map((tag) => tag.textContent)).toEqual(['사과']);
+    });
+});
+describe('RCB-10 편집 버튼', () => {
+    it('RCB-10 단일 + showFooterButtons 는 편집 버튼만 두고, 편집 click 이 onEdit 을 부르며 패널을 유지한다', () => {
+        const onEdit = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, showFooterButtons: true, onEdit });
+        click(allButton(container));
+        click(findByText(container, 'button', '편집'));
+        expect({ complete: hasButton(container, '선택 완료'), open: isPanelOpen(container) }).toEqual({
+            complete: false,
+            open: true,
+        });
+        expect(onEdit).toHaveBeenCalled();
+    });
+});
+describe('RCB-11 열린 채 disabled 전환', () => {
+    it('RCB-11 열린 채 disabled 로 바뀌면 패널이 열린 채 남고, 옵션 click 은 onChange 없이 닫기만 한다', () => {
+        // vanilla UBM-02 는 setDisabled 시 닫지만 React 는 열린 채 둔다 — 사용자 결정(Q3)으로 결함 후보가 아닌 현재 동작 고정
+        const onChange = vi.fn();
+        const { container, rerender } = mount({ optionItems: OPTIONS, onChange });
+        typeText(container, '과');
+        rerender({ optionItems: OPTIONS, onChange, disabled: true });
+        const openAfterDisable = isPanelOpen(container);
+        clickOption(container, '사과');
+        expect({ openAfterDisable, openAfterClick: isPanelOpen(container) }).toEqual({
+            openAfterDisable: true,
+            openAfterClick: false,
+        });
+        expect(onChange).not.toHaveBeenCalled();
+    });
+});
+describe('RCB-12 입력 click', () => {
+    it('RCB-12 검색어가 없으면 입력 click 이 패널을 열지 않는다', () => {
+        const { container } = mount({ optionItems: OPTIONS });
+        click(input(container));
+        expect(isPanelOpen(container)).toBe(false);
+    });
+    it('RCB-12 검색어가 있으면 입력 click 이 토글이라 열린 패널을 닫는다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (커서를 옮기려 입력을 click 해도 패널이 닫힘 — vanilla UBM-14 는 열기만 함)
+        const { container } = mount({ optionItems: OPTIONS });
+        typeText(container, '과');
+        click(input(container));
+        const afterFirstClick = isPanelOpen(container);
+        click(input(container));
+        expect([afterFirstClick, isPanelOpen(container)]).toEqual([false, true]);
+    });
+    it.todo('RCB-12 입력 click 은 패널을 열기만 하고 열린 패널을 닫지 않아야 한다');
+});
+describe('RCB-13 빈 검색어 패널의 키보드 선택', () => {
+    afterEach(() => {
+        vi.useRealTimers();
+    });
+    it('RCB-13 옵션이 보이지 않는 빈 검색어 패널에서 ArrowDown + Enter 가 화면에 없는 첫 옵션을 선택한다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (키보드 탐색이 표시 목록이 아니라 optionItems.length 기준이라 보이지 않는 옵션이 선택됨)
+        vi.useFakeTimers({ toFake: ['setTimeout'] });
+        const onChange = vi.fn();
+        const { container } = mount({ optionItems: OPTIONS, onChange });
+        pressKey(container, 'ArrowDown');
+        const shownLabels = optionLabels(container);
+        pressKey(container, 'ArrowDown');
+        // 스크롤 보정은 옵션 요소가 없어 건너뛴다 (scrollToFocusedOption 의 focusedOption 부재 early return)
+        act(() => {
+            vi.runOnlyPendingTimers();
+        });
+        pressKey(container, 'Enter');
+        expect(shownLabels).toEqual([]);
+        expect(onChange).toHaveBeenCalledWith(APPLE_ID);
+    });
+    it.todo('RCB-13 옵션이 표시되지 않은 패널에서는 키보드로 옵션을 선택할 수 없어야 한다');
+});
+describe('RCB-14 옵션 아이콘', () => {
+    it('RCB-14 icon 이 있는 옵션만 __option-icon 안에 아이콘을 렌더한다', () => {
+        const ProbeIcon = ({ className }) => createElement('svg', { className: `probe-icon ${className ?? ''}` });
+        const { container } = mount({
+            optionItems: [
+                { id: APPLE_ID, label: '사과', icon: ProbeIcon },
+                { id: BANANA_ID, label: '바나나' },
+            ],
+        });
+        click(allButton(container));
+        expect(['사과', '바나나'].map((label) => findByText(container, `.${OPTION_CLASS}`, label).querySelector('.ncua-select-dropdown__option-icon .probe-icon') !== null)).toEqual([true, false]);
+    });
+});

package/dist/temp/src/components/forms-and-input/combo-box/__tests__/ComboBox.register.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/temp/src/components/forms-and-input/combo-box/__tests__/ComboBox.register.test.js

@@ -0,0 +1,111 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { allButton, click, findByText, mountControlled, requireElement, runCleanups } from './comboBoxTestUtils';
+// @ncds/ui-admin-icon 은 react@19 를 해석해 react-dom@18 이 거부하는 엘리먼트를 만든다 (ComboBox.portal.test.ts 와 같은 스텁)
+vi.mock('@ncds/ui-admin-icon', () => {
+    const IconStub = () => null;
+    return {
+        CheckCircle: IconStub,
+        ChevronSelectorVertical: IconStub,
+        HelpCircle: IconStub,
+        InfoCircle: IconStub,
+        SearchLg: IconStub,
+        X: IconStub,
+        XClose: IconStub,
+    };
+});
+const FIELD_NAME = 'fruit';
+const APPLE_ID = 1;
+const BANANA_ID = 2;
+const OPTIONS = [
+    { id: APPLE_ID, label: '사과' },
+    { id: BANANA_ID, label: '바나나' },
+];
+afterEach(runCleanups);
+const createRegister = () => {
+    const onChange = vi.fn(async () => true);
+    const register = {
+        name: FIELD_NAME,
+        onChange,
+        onBlur: vi.fn(async () => true),
+        ref: vi.fn(),
+    };
+    return { register, onChange };
+};
+const openAll = (container) => {
+    click(allButton(container));
+};
+const clickOption = (container, label) => {
+    click(findByText(container, '.ncua-select-dropdown__option', label));
+};
+const hiddenInputValue = (container) => requireElement(container, 'input[type="hidden"]').value;
+describe('RCB-01 register 통지', () => {
+    it('RCB-01 단일 옵션 click 이 register.onChange 에 숫자 id 를 그대로 넘기고 hidden input 은 문자열이 된다', () => {
+        const { register, onChange } = createRegister();
+        const container = mountControlled({ optionItems: OPTIONS, register, onChangeSpy: vi.fn() });
+        openAll(container);
+        clickOption(container, '바나나');
+        expect(onChange).toHaveBeenCalledWith({ target: { value: BANANA_ID, name: FIELD_NAME } });
+        expect(hiddenInputValue(container)).toBe(String(BANANA_ID));
+    });
+    it('RCB-01 다중 옵션 click 이 register.onChange 에 JSON 문자열을 넘기고 hidden input 도 JSON 이 된다', () => {
+        const { register, onChange } = createRegister();
+        const container = mountControlled({
+            optionItems: OPTIONS,
+            register,
+            multiple: true,
+            initialValue: [],
+            onChangeSpy: vi.fn(),
+        });
+        const expected = JSON.stringify([APPLE_ID, BANANA_ID]);
+        openAll(container);
+        clickOption(container, '사과');
+        clickOption(container, '바나나');
+        expect(onChange).toHaveBeenLastCalledWith({ target: { value: expected, name: FIELD_NAME } });
+        expect(hiddenInputValue(container)).toBe(expected);
+    });
+});
+describe('RCB-02 register 미통지 경로', () => {
+    it('RCB-02 단일 태그 X 는 onChange 만 부르고 register.onChange 를 부르지 않는다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (#592 SB-07 같은 뿌리 — handleRemoveTag 가 notifyFormChange 를 거치지 않아 폼 값이 이전 상태로 남음)
+        const { register, onChange } = createRegister();
+        const onChangeSpy = vi.fn();
+        const container = mountControlled({ optionItems: OPTIONS, register, initialValue: APPLE_ID, onChangeSpy });
+        click(requireElement(container, '.ncua-tag__close'));
+        expect(onChangeSpy).toHaveBeenCalledWith('');
+        expect(onChange).not.toHaveBeenCalled();
+    });
+    it('RCB-02 다중 「전체 선택」은 onChange 만 부르고 register.onChange 를 부르지 않는다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (#592 SB-07 같은 뿌리 — handleSelectAll 이 notifyFormChange 를 거치지 않아 폼 값이 이전 상태로 남음)
+        const { register, onChange } = createRegister();
+        const onChangeSpy = vi.fn();
+        const container = mountControlled({
+            optionItems: OPTIONS,
+            register,
+            multiple: true,
+            initialValue: [],
+            onChangeSpy,
+        });
+        openAll(container);
+        click(findByText(container, 'button', '전체 선택'));
+        expect(onChangeSpy).toHaveBeenCalledWith([APPLE_ID, BANANA_ID]);
+        expect(onChange).not.toHaveBeenCalled();
+    });
+    it('RCB-02 다중 태그 X 는 onChange 만 부르고 register.onChange 를 부르지 않는다', () => {
+        // 현재 동작 고정 — 결함 후보: 후속 이슈 (#592 SB-07 같은 뿌리 — handleRemoveTag 가 notifyFormChange 를 거치지 않아 폼 값이 이전 상태로 남음)
+        const { register, onChange } = createRegister();
+        const onChangeSpy = vi.fn();
+        const container = mountControlled({
+            optionItems: OPTIONS,
+            register,
+            multiple: true,
+            initialValue: [APPLE_ID, BANANA_ID],
+            onChangeSpy,
+        });
+        click(requireElement(container, '.ncua-tag__close'));
+        expect(onChangeSpy).toHaveBeenCalledWith([BANANA_ID]);
+        expect(onChange).not.toHaveBeenCalled();
+    });
+    it.todo('RCB-02 단일 태그 X 는 register.onChange 에 빈 값을 통지해야 한다 (#592)');
+    it.todo('RCB-02 다중 「전체 선택」은 register.onChange 에 선택 결과 JSON 을 통지해야 한다 (#592)');
+    it.todo('RCB-02 다중 태그 X 는 register.onChange 에 남은 값 JSON 을 통지해야 한다 (#592)');
+});

package/dist/temp/src/components/forms-and-input/combo-box/__tests__/comboBoxTestUtils.d.ts

@@ -0,0 +1,22 @@
+import { type ReactElement } from 'react';
+import type { OptionValue } from '../../../../types/dropdown';
+import { type ComboBoxProps } from '../ComboBox';
+interface HarnessProps extends Omit<ComboBoxProps, 'value' | 'onChange'> {
+    initialValue?: OptionValue;
+    onChangeSpy: (value: OptionValue) => void;
+}
+/** 각 테스트 파일의 afterEach 에서 부른다 */
+export declare const runCleanups: () => void;
+export declare const onCleanup: (cleanup: () => void) => void;
+/** 같은 root 에 다시 render 하면 props 변경(rerender)이 된다 */
+export declare const mountRoot: () => {
+    container: HTMLDivElement;
+    render: (element: ReactElement) => void;
+};
+export declare const mountControlled: (props: HarnessProps) => HTMLElement;
+export declare const requireElement: <T extends Element>(scope: ParentNode, selector: string) => T;
+export declare const findByText: <T extends HTMLElement>(scope: ParentNode, selector: string, text: string) => T;
+export declare const click: (element: HTMLElement) => void;
+/** 「전체」 버튼 — 검색어 없이 전체 목록을 연다 */
+export declare const allButton: (container: HTMLElement) => HTMLElement;
+export {};

package/dist/temp/src/components/forms-and-input/combo-box/__tests__/comboBoxTestUtils.js

@@ -0,0 +1,69 @@
+// React ComboBox 테스트(interaction·register) 공용 마운트·조회 헬퍼.
+// vitest include 가 *.test.ts 만 수집하므로 이 파일은 테스트로 실행되지 않는다.
+// @ncds/ui-admin-icon 스텁은 vi.mock 이 테스트 파일 단위로 호이스팅되므로 각 테스트 파일에 둔다.
+import { createElement, useState } from 'react';
+import { createRoot } from 'react-dom/client';
+import { act } from 'react-dom/test-utils';
+import { ComboBox } from '../ComboBox';
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;
+const cleanups = [];
+/** onChange 로 받은 값을 value 로 되돌려주는 사용처 흉내 (controlled) */
+const Harness = ({ initialValue, onChangeSpy, ...rest }) => {
+    const [value, setValue] = useState(initialValue);
+    return createElement(ComboBox, {
+        ...rest,
+        value,
+        onChange: (next) => {
+            onChangeSpy(next);
+            setValue(next);
+        },
+    });
+};
+/** 각 테스트 파일의 afterEach 에서 부른다 */
+export const runCleanups = () => {
+    for (const cleanup of cleanups.splice(0))
+        cleanup();
+};
+export const onCleanup = (cleanup) => {
+    cleanups.push(cleanup);
+};
+/** 같은 root 에 다시 render 하면 props 변경(rerender)이 된다 */
+export const mountRoot = () => {
+    const container = document.createElement('div');
+    document.body.appendChild(container);
+    const root = createRoot(container);
+    onCleanup(() => {
+        act(() => root.unmount());
+        container.remove();
+    });
+    const render = (element) => {
+        act(() => {
+            root.render(element);
+        });
+    };
+    return { container, render };
+};
+export const mountControlled = (props) => {
+    const { container, render } = mountRoot();
+    render(createElement(Harness, props));
+    return container;
+};
+export const requireElement = (scope, selector) => {
+    const element = scope.querySelector(selector);
+    if (element === null)
+        throw new Error(`요소를 찾을 수 없습니다: ${selector}`);
+    return element;
+};
+export const findByText = (scope, selector, text) => {
+    const found = Array.from(scope.querySelectorAll(selector)).find((element) => element.textContent === text);
+    if (found === undefined)
+        throw new Error(`요소를 찾을 수 없습니다: ${selector} "${text}"`);
+    return found;
+};
+export const click = (element) => {
+    act(() => {
+        element.click();
+    });
+};
+/** 「전체」 버튼 — 검색어 없이 전체 목록을 연다 */
+export const allButton = (container) => requireElement(container, '.ncua-input__right-icon:not(.ncua-input__clear)');

package/dist/temp/src/components/forms-and-input/date-picker/__tests__/DatePicker.input.test.d.ts

@@ -0,0 +1 @@
+export {};