graphing/designer: unset a constant whose value was cleared

Vue casts a number field through looseToNumber, which hands back the raw
string when parseFloat cannot read it, so an emptied input stored '' in a
field typed number | null and sent it to a backend that rejects it.

JIRA-Ref: CMK-37206
Change-Id: Ia0b8ff7dd7200c995f87099f20df04ba12d4ed83

Author: ottermata

packages/cmk-frontend-vue/src/graphing/designer/components/forms/ConstantLineForm.vue

@@ -21,8 +21,9 @@ const { _t } = usei18n()
 
 const valueInputId = useId()
 
-function onValueChange(value: number | undefined): void {
-  store.replace({ ...item, value: value ?? null })
+function onValueChange(value: unknown): void {
+  const parsed = parseFloat(String(value))
+  store.replace({ ...item, value: Number.isFinite(parsed) ? parsed : null })
 }
 </script>
 

packages/cmk-frontend-vue/tests/graphing/designer/components/ConstantLineForm.test.ts

@@ -20,3 +20,13 @@ test('entering a value completes a constant', async () => {
 
   expect(store.items.value[0]).toMatchObject({ type: 'constant', value: 42 })
 })
+
+test('clearing the value leaves the constant unset rather than blank', async () => {
+  const draft = { ...newConstantDraft('A', '#28a2f3'), value: 42 }
+  const store = useGraphItems(PALETTE, [draft])
+  render(ConstantLineForm, { props: { item: draft, store } })
+
+  await fireEvent.update(screen.getByRole('spinbutton', { name: 'Constant at' }), '')
+
+  expect(store.items.value[0]).toMatchObject({ type: 'constant', value: null })
+})