refactor: make idReference to Form mandatory

equinor · Jun 27, 2023 · fbb436c · fbb436c
1 parent c2fa913
commit fbb436c
Show file tree

Hide file tree

Showing 10 changed files with 154 additions and 58 deletions.
diff --git a/packages/dm-core-plugins/src/form/Form.test.tsx b/packages/dm-core-plugins/src/form/Form.test.tsx
@@ -29,7 +29,9 @@ describe('Form', () => {
         },
       ])
 
-      const { container } = render(<Form type="Root" />, { wrapper })
+      const { container } = render(<Form idReference="ds/$1" type="Root" />, {
+        wrapper,
+      })
       await waitFor(() => {
         expect(container.querySelector(`input[id="foo"]`)).toBeTruthy()
         expect(container.querySelector(`input[id="bar"]`)).toBeTruthy()
@@ -77,9 +79,12 @@ describe('Form', () => {
           bar: '',
         },
       }
-      const { container } = render(<Form type="Root" formData={formData} />, {
-        wrapper,
-      })
+      const { container } = render(
+        <Form idReference="ds/$1" type="Root" formData={formData} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         expect(container.querySelector(`input[id="foo"]`)).toBeTruthy()
         expect(container.querySelector(`input[id="child.bar"]`)).toBeTruthy()
@@ -116,9 +121,12 @@ describe('Form', () => {
         order: [],
       }
 
-      const { container } = render(<Form type="Root" config={config} />, {
-        wrapper,
-      })
+      const { container } = render(
+        <Form idReference="ds/$1" type="Root" config={config} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         expect(container.querySelector(`input[id="foo"]`)).toBeTruthy()
         // Should only call get blueprint once

diff --git a/packages/dm-core-plugins/src/form/RegistryContext.tsx b/packages/dm-core-plugins/src/form/RegistryContext.tsx
@@ -2,7 +2,7 @@ import { TViewConfig } from '@development-framework/dm-core'
 import React, { createContext, useContext } from 'react'
 
 type Props = {
-  idReference?: string
+  idReference: string
   onOpen?: (key: string, view: TViewConfig) => void
 }
 

diff --git a/packages/dm-core-plugins/src/form/fields/ArrayField.test.tsx b/packages/dm-core-plugins/src/form/fields/ArrayField.test.tsx
@@ -31,7 +31,12 @@ describe('ArrayField', () => {
           },
         ],
       }
-      render(<Form type="MyBlueprint" formData={formData} />, { wrapper })
+      render(
+        <Form idReference="ds/$1" type="MyBlueprint" formData={formData} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         expect(screen.getByText('Could not find the blueprint')).toBeDefined()
       })
@@ -54,23 +59,29 @@ describe('ArrayField', () => {
 
     it('should contain no field in the list by default', async () => {
       mockBlueprintGet([blueprint])
-      const { container } = render(<Form type="MyBlueprint" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="MyBlueprint" />,
+        { wrapper }
+      )
       await waitFor(() => {
         expect(container.querySelectorAll(` input[type=text]`).length).toBe(0)
       })
     })
 
     it('should have an add button', async () => {
       mockBlueprintGet([blueprint])
-      render(<Form type="MyBlueprint" />, { wrapper })
+      render(<Form idReference="ds/$1" type="MyBlueprint" />, { wrapper })
       await waitFor(() => {
         expect(screen.getByText('Add')).toBeDefined()
       })
     })
 
     it('should add a new field when clicking the add button', async () => {
       mockBlueprintGet([blueprint])
-      const { container } = render(<Form type="MyBlueprint" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="MyBlueprint" />,
+        { wrapper }
+      )
       await waitFor(() => {
         fireEvent.click(screen.getByText('Add'))
         expect(container.querySelectorAll(` input[type=text]`).length).toBe(1)
@@ -83,7 +94,7 @@ describe('ArrayField', () => {
         array: ['foo', 'bar'],
       }
       const { container } = render(
-        <Form type="MyBlueprint" formData={formData} />,
+        <Form idReference="ds/$1" type="MyBlueprint" formData={formData} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -100,7 +111,7 @@ describe('ArrayField', () => {
         array: ['foo', 'bar'],
       }
       const { container } = render(
-        <Form type="MyBlueprint" formData={formData} />,
+        <Form idReference="ds/$1" type="MyBlueprint" formData={formData} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -145,7 +156,7 @@ describe('ArrayField', () => {
         ],
       }
       const { container } = render(
-        <Form type="MyBlueprint" formData={formData} />,
+        <Form idReference="ds/$1" type="MyBlueprint" formData={formData} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -191,9 +202,12 @@ describe('ArrayField', () => {
           },
         ],
       }
-      const { container } = render(<Form type="Root" formData={formData} />, {
-        wrapper,
-      })
+      const { container } = render(
+        <Form idReference="ds/$1" type="Root" formData={formData} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         const inputs = container.querySelectorAll(` input[type=text]`)
         expect(inputs.length).toBe(3)
@@ -205,7 +219,9 @@ describe('ArrayField', () => {
 
     it.skip('should add an inner when clicking the add button', async () => {
       mockBlueprintGet([outer, inner])
-      const { container } = render(<Form type="Root" />, { wrapper })
+      const { container } = render(<Form idReference="ds/$1" type="Root" />, {
+        wrapper,
+      })
       await waitFor(() => {
         fireEvent.click(screen.getByTestId('add-array'))
         expect(container.querySelectorAll(` input[type=text]`).length).toBe(1)

diff --git a/packages/dm-core-plugins/src/form/fields/AttributeField.test.tsx b/packages/dm-core-plugins/src/form/fields/AttributeField.test.tsx
@@ -19,7 +19,7 @@ describe('AttributeField', () => {
           ],
         },
       ])
-      render(<Form type="SingleField" />, { wrapper })
+      render(<Form idReference="ds/$1" type="SingleField" />, { wrapper })
       await waitFor(() => {
         expect(
           screen.getByText('Could not find the blueprint', { exact: false })

diff --git a/packages/dm-core-plugins/src/form/fields/BooleanField.test.tsx b/packages/dm-core-plugins/src/form/fields/BooleanField.test.tsx
@@ -24,7 +24,10 @@ describe('BooleanField', () => {
           ],
         },
       ])
-      const { container } = render(<Form type="SingleField" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="SingleField" />,
+        { wrapper }
+      )
       await waitFor(() => {
         expect(container.querySelectorAll(` input[type=checkbox]`).length).toBe(
           1
@@ -48,7 +51,9 @@ describe('BooleanField', () => {
           ],
         },
       ])
-      render(<Form type="SingleFieldWithLabel" />, { wrapper })
+      render(<Form idReference="ds/$1" type="SingleFieldWithLabel" />, {
+        wrapper,
+      })
       await waitFor(() => {
         expect(screen.getByText('Foo')).toBeDefined()
       })
@@ -69,7 +74,10 @@ describe('BooleanField', () => {
           ],
         },
       ])
-      const { container } = render(<Form type="SingleField" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="SingleField" />,
+        { wrapper }
+      )
       await waitFor(() => {
         const inputNode: Element | null =
           container.querySelector(` input[name="foo"]`)
@@ -98,7 +106,7 @@ describe('BooleanField', () => {
         foo: 'beep',
       }
       const { container } = render(
-        <Form type="SingleField" formData={formData} />,
+        <Form idReference="ds/$1" type="SingleField" formData={formData} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -127,7 +135,7 @@ describe('BooleanField', () => {
       ])
       const onSubmit = jest.fn()
       const { container } = render(
-        <Form type="SingleField" onSubmit={onSubmit} />,
+        <Form idReference="ds/$1" type="SingleField" onSubmit={onSubmit} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -159,7 +167,10 @@ describe('BooleanField', () => {
           ],
         },
       ])
-      const { container } = render(<Form type="SingleField" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="SingleField" />,
+        { wrapper }
+      )
       await waitFor(() => {
         const inputNode: Element | null =
           container.querySelector(` input[id="foo"]`)

diff --git a/packages/dm-core-plugins/src/form/fields/NumberField.test.tsx b/packages/dm-core-plugins/src/form/fields/NumberField.test.tsx
@@ -20,7 +20,10 @@ describe('NumberField', () => {
           ],
         },
       ])
-      const { container } = render(<Form type="SingleField" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="SingleField" />,
+        { wrapper }
+      )
       await waitFor(() => {
         expect(container.querySelectorAll(` input[type=text]`).length).toBe(1) // TODO type should be number not text
         expect(screen.getByText('foo')).toBeDefined()
@@ -44,7 +47,7 @@ describe('NumberField', () => {
       ])
       const onSubmit = jest.fn()
       const { container } = render(
-        <Form type="SingleField" onSubmit={onSubmit} />,
+        <Form idReference="ds/$1" type="SingleField" onSubmit={onSubmit} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -80,7 +83,7 @@ describe('NumberField', () => {
         foo: 2,
       }
       const { container } = render(
-        <Form type="SingleField" formData={formData} />,
+        <Form idReference="ds/$1" type="SingleField" formData={formData} />,
         { wrapper }
       )
       await waitFor(() => {
@@ -106,7 +109,10 @@ describe('NumberField', () => {
           ],
         },
       ])
-      const { container } = render(<Form type="SingleField" />, { wrapper })
+      const { container } = render(
+        <Form idReference="ds/$1" type="SingleField" />,
+        { wrapper }
+      )
 
       await waitFor(() => {
         const inputNode: Element | null =
@@ -137,7 +143,12 @@ describe('NumberField', () => {
         },
       ])
       const onSubmit = jest.fn()
-      render(<Form type="SingleField" onSubmit={onSubmit} />, { wrapper })
+      render(
+        <Form idReference="ds/$1" type="SingleField" onSubmit={onSubmit} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         fireEvent.submit(screen.getByTestId('form-submit'))
       })
@@ -162,7 +173,12 @@ describe('NumberField', () => {
         },
       ])
       const onSubmit = jest.fn()
-      render(<Form type="SingleField" onSubmit={onSubmit} />, { wrapper })
+      render(
+        <Form idReference="ds/$1" type="SingleField" onSubmit={onSubmit} />,
+        {
+          wrapper,
+        }
+      )
       fireEvent.submit(screen.getByTestId('form-submit'))
       await waitFor(() => {
         expect(onSubmit).not.toHaveBeenCalled()
@@ -192,7 +208,12 @@ describe('NumberField', () => {
         foo: value,
       }
 
-      render(<Form type="SingleField" formData={formData} />, { wrapper })
+      render(
+        <Form idReference="ds/$1" type="SingleField" formData={formData} />,
+        {
+          wrapper,
+        }
+      )
       await waitFor(() => {
         expect(screen.getByTestId('form-textfield').getAttribute('value')).toBe(
           String(value)

diff --git a/packages/dm-core-plugins/src/form/fields/ObjectField.test.tsx b/packages/dm-core-plugins/src/form/fields/ObjectField.test.tsx
@@ -42,31 +42,32 @@ const setupSimple = async (props: TFormProps) => {
 }
 
 test('should render two inputs', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.inputs.length).toBe(2)
 })
 
 test('should render a text input with label foo', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.fooInput).toBeDefined()
   expect(utils.fooInput.type).toBe('text')
 })
 
 test('should render a checkbox input with label bar', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.barInput).toBeDefined()
   expect(utils.barInput.type).toBe('checkbox')
 })
 
 test('should show foo before bar by default', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.fooInput.compareDocumentPosition(utils.barInput)).toBe(
     Node.DOCUMENT_POSITION_FOLLOWING
   )
 })
 
 test('should show foo after bar if order states it', async () => {
   const utils = await setupSimple({
+    idReference: 'ds/$1',
     type: 'MyBlueprint',
     config: { attributes: [], order: ['bar', 'foo'] },
   })
@@ -76,25 +77,29 @@ test('should show foo after bar if order states it', async () => {
 })
 
 test('should handle a default object value', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.fooInput.getAttribute('value')).toBe('beep')
   expect(utils.barInput.getAttribute('value')).toBe('false')
 })
 
 test('should handle object fields change events', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   fireEvent.change(utils.fooInput, { target: { value: 'changed' } })
   expect(utils.fooInput.getAttribute('value')).toBe('changed')
 })
 
 test('should render the widget with the expected id', async () => {
-  const utils = await setupSimple({ type: 'MyBlueprint' })
+  const utils = await setupSimple({ idReference: 'ds/$1', type: 'MyBlueprint' })
   expect(utils.fooInput.getAttribute('id')).toBe('foo')
 })
 
 test('should handle submit', async () => {
   const onSubmit = jest.fn()
-  const utils = await setupSimple({ type: 'MyBlueprint', onSubmit: onSubmit })
+  const utils = await setupSimple({
+    idReference: 'ds/$1',
+    type: 'MyBlueprint',
+    onSubmit: onSubmit,
+  })
   await waitFor(() => {
     fireEvent.submit(utils.submit)
     expect(onSubmit).toHaveBeenCalled()
@@ -128,7 +133,7 @@ test('should handle optional', async () => {
       ],
     },
   ])
-  render(<Form type="Parent" />, { wrapper })
+  render(<Form idReference="ds/$1" type="Parent" />, { wrapper })
   await waitFor(() => {
     screen.debug()
     // Show optional in label

diff --git a/packages/dm-core-plugins/src/form/fields/ObjectField.tsx b/packages/dm-core-plugins/src/form/fields/ObjectField.tsx
@@ -227,7 +227,7 @@ export const ContainedAttribute = (props: any): JSX.Element => {
   const isRoot = namePath == ''
   const shouldOpen = hasOpen && !isRoot
 
-  const attributePath = idReference?.split('.', 2).slice(1)
+  const attributePath = idReference.split('.', 2).slice(1)
 
   return (
     <div>