diff --git a/apps/desktop/src/components/grid/DataGridInsertRowsDialog.vue b/apps/desktop/src/components/grid/DataGridInsertRowsDialog.vue index 7d709bd8d..84d53d3af 100644 --- a/apps/desktop/src/components/grid/DataGridInsertRowsDialog.vue +++ b/apps/desktop/src/components/grid/DataGridInsertRowsDialog.vue @@ -16,7 +16,7 @@ const emit = defineEmits<{ insert: [count: number, position: GridInsertRowPositi const canUsePosition = computed(() => props.canPlaceAtSelection !== false); -const rowCount = ref("1"); +const rowCount = ref("1"); const position = ref("below"); watch( @@ -36,8 +36,8 @@ watch(canUsePosition, (canUse) => { if (!canUse) position.value = "end"; }); -function parseIntegerOrNull(raw: string): number | null { - const trimmed = raw.trim(); +function parseIntegerOrNull(raw: string | number): number | null { + const trimmed = String(raw).trim(); if (!/^\d+$/.test(trimmed)) return null; const value = Number(trimmed); return Number.isInteger(value) && value >= 1 ? value : null; @@ -50,7 +50,7 @@ const parsedCount = computed(() => { }); const inputInvalid = computed(() => { - const raw = rowCount.value.trim(); + const raw = String(rowCount.value).trim(); if (raw === "") return false; return parseIntegerOrNull(raw) === null; }); diff --git a/apps/desktop/src/components/grid/__tests__/DataGridInsertRowsDialog.spec.ts b/apps/desktop/src/components/grid/__tests__/DataGridInsertRowsDialog.spec.ts index 414676188..6be1a7477 100644 --- a/apps/desktop/src/components/grid/__tests__/DataGridInsertRowsDialog.spec.ts +++ b/apps/desktop/src/components/grid/__tests__/DataGridInsertRowsDialog.spec.ts @@ -33,20 +33,6 @@ vi.mock("@/components/ui/button", async () => { }; }); -vi.mock("@/components/ui/input", async () => { - const { defineComponent, h } = await import("vue"); - return { - Input: defineComponent({ - inheritAttrs: false, - props: { modelValue: String }, - emits: ["update:modelValue"], - setup(props, { attrs, emit }) { - return () => h("input", { ...attrs, value: props.modelValue, onInput: (event: Event) => emit("update:modelValue", (event.target as HTMLInputElement).value) }); - }, - }), - }; -}); - import DataGridInsertRowsDialog from "../DataGridInsertRowsDialog.vue"; const mountedApps: Array<{ app: App; host: HTMLElement }> = []; @@ -80,4 +66,27 @@ describe("DataGridInsertRowsDialog", () => { await nextTick(); expect(onInsert).toHaveBeenCalledWith(1, "end"); }); + + it("accepts a numeric value emitted by the number input", async () => { + const onInsert = vi.fn(); + const host = document.createElement("div"); + document.body.append(host); + const app = createApp(DataGridInsertRowsDialog, { + open: true, + canPlaceAtSelection: true, + onInsert, + }); + app.use(i18n); + app.mount(host); + mountedApps.push({ app, host }); + + const input = host.querySelector("#insert-rows-count") as HTMLInputElement; + input.value = "3"; + input.dispatchEvent(new Event("input", { bubbles: true })); + await nextTick(); + + [...host.querySelectorAll("button")].find((button) => button.textContent === "Insert")!.click(); + await nextTick(); + expect(onInsert).toHaveBeenCalledWith(3, "below"); + }); });