@evoke-platform/ui-components 1.16.0 → 1.18.0

package/dist/published/components/custom/FormV2/tests/FormRendererContainer.test.js

@@ -95,7 +95,7 @@ describe('FormRendererContainer', () => {
                 return HttpResponse.json(rnLicense);
             }), http.get('/api/data/objects/specialtyType/instances', () => {
                 return HttpResponse.json([rnSpecialtyType1, rnSpecialtyType2]);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json(createSpecialtyForm);
             }));
             render(React.createElement(FormRendererContainer, { objectId: 'specialty', formId: 'specialtyForm', dataType: 'objectInstances', actionId: '_create', associatedObject: { propertyId: 'license', instanceId: 'rnLicense' } }));
@@ -116,6 +116,73 @@ describe('FormRendererContainer', () => {
             });
         });
     });
+    it('keeps the rich text editor mounted while typing when autosave is not configured', async () => {
+        const user = userEvent.setup();
+        const mountSpy = vi.fn();
+        const richTextForm = {
+            id: 'richTextForm',
+            name: 'Rich Text Form',
+            actionId: '_update',
+            objectId: 'richTextObject',
+            entries: [
+                {
+                    parameterId: 'notes',
+                    type: 'input',
+                    display: {
+                        label: 'Notes',
+                    },
+                },
+            ],
+        };
+        const richTextObject = {
+            id: 'richTextObject',
+            name: 'Rich Text Object',
+            actions: [
+                {
+                    id: '_update',
+                    name: 'Update',
+                    type: 'update',
+                    parameters: [
+                        {
+                            id: 'notes',
+                            name: 'Notes',
+                            type: 'richText',
+                        },
+                    ],
+                    outputEvent: 'updated',
+                },
+            ],
+            properties: [
+                {
+                    id: 'notes',
+                    name: 'Notes',
+                    type: 'richText',
+                },
+            ],
+        };
+        const TestRichTextEditor = (props) => {
+            React.useEffect(() => {
+                mountSpy();
+            }, []);
+            return (React.createElement("textarea", { "aria-label": "Notes", value: props.value || '', onChange: (event) => props.handleUpdate?.(event.target.value), onBlur: () => props.onBlur?.() }));
+        };
+        server.use(http.get('/api/data/objects/richTextObject/effective', () => HttpResponse.json(richTextObject)), http.get('/api/data/objects/richTextObject/instances/test-instance', () => {
+            return HttpResponse.json({
+                id: 'test-instance',
+                name: 'Rich Text Instance',
+                notes: '',
+            });
+        }), http.get('/api/data/objects/richTextObject/instances/test-instance/object', () => {
+            return HttpResponse.json(richTextObject);
+        }), http.get('/api/data/forms/richTextForm/effective', () => HttpResponse.json(richTextForm)));
+        render(React.createElement(FormRendererContainer, { objectId: "richTextObject", formId: "richTextForm", dataType: "objectInstances", actionId: "_update", instanceId: "test-instance", richTextEditor: TestRichTextEditor }));
+        const notesField = await screen.findByRole('textbox', { name: 'Notes' });
+        await user.click(notesField);
+        await user.type(notesField, 'Focus should stay here');
+        const updatedNotesField = await screen.findByRole('textbox', { name: 'Notes' });
+        expect(updatedNotesField).toHaveFocus();
+        expect(mountSpy).toHaveBeenCalledTimes(1);
+    });
     describe('autosave functionality', () => {
         it('should trigger autosave when field loses focus', async () => {
             const user = userEvent.setup();
@@ -129,7 +196,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -159,6 +226,254 @@ describe('FormRendererContainer', () => {
                 }),
             }));
         });
+        it('should autosave only fields configured on the form', async () => {
+            const user = userEvent.setup();
+            let autosaveRequestBody;
+            server.use(http.get('/api/data/objects/specialty/instances/test-instance', () => {
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    name: 'Original Name',
+                    specialtyType: { id: 'someSpecialtyTypeId', name: 'Some Specialty Type' },
+                    license: { id: 'someLicenseId', name: 'Some License' },
+                    additionalTraining: 'Board Certified',
+                });
+            }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
+                return HttpResponse.json(specialtyObject);
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
+                return HttpResponse.json({
+                    ...createSpecialtyForm,
+                    actionId: '_update',
+                    autosaveActionId: '_autosave',
+                });
+            }), http.post('/api/data/objects/specialty/instances/test-instance/actions', async ({ request }) => {
+                const body = (await request.json());
+                if (body.actionId === '_autosave') {
+                    autosaveRequestBody = body;
+                }
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    ...body.input,
+                });
+            }));
+            render(React.createElement(FormRendererContainer, { objectId: 'specialty', formId: 'specialtyForm', dataType: 'objectInstances', actionId: '_update', instanceId: 'test-instance' }));
+            const nameField = await screen.findByRole('textbox', { name: 'Name' });
+            await user.clear(nameField);
+            await user.type(nameField, 'Updated Name');
+            await user.tab();
+            await waitFor(() => {
+                expect(autosaveRequestBody).toBeDefined();
+            });
+            expect(autosaveRequestBody?.input).toEqual({
+                // Should not include additionalTraining since it's not configured on the form
+                name: 'Updated Name',
+                license: { id: 'someLicenseId', name: 'Some License' },
+                specialtyType: { id: 'someSpecialtyTypeId', name: 'Some Specialty Type' },
+            });
+        });
+        it('should include conditionally visible form fields from autosave payload', async () => {
+            const user = userEvent.setup();
+            let autosaveRequestBody;
+            const specialtyFormWithHiddenField = {
+                id: 'specialtyForm',
+                name: 'Specialty Form',
+                objectId: 'specialty',
+                actionId: '_update',
+                autosaveActionId: '_autosave',
+                entries: [
+                    {
+                        parameterId: 'name',
+                        type: 'input',
+                        display: {
+                            label: 'Name',
+                        },
+                    },
+                    {
+                        parameterId: 'additionalTraining',
+                        type: 'input',
+                        display: {
+                            label: 'Additional Training',
+                            visibility: {
+                                operator: 'all',
+                                conditions: [
+                                    {
+                                        property: 'name',
+                                        operator: 'eq',
+                                        value: 'Show Hidden',
+                                        isInstanceProperty: false,
+                                    },
+                                ],
+                            },
+                        },
+                    },
+                ],
+            };
+            server.use(http.get('/api/data/objects/specialty/instances/test-instance', () => {
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    name: 'Original Name',
+                    specialtyType: null,
+                    license: null,
+                    additionalTraining: 'Should Autosave',
+                });
+            }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
+                return HttpResponse.json(specialtyObject);
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
+                return HttpResponse.json(specialtyFormWithHiddenField);
+            }), http.post('/api/data/objects/specialty/instances/test-instance/actions', async ({ request }) => {
+                const body = (await request.json());
+                if (body.actionId === '_autosave') {
+                    autosaveRequestBody = body;
+                }
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    ...body.input,
+                });
+            }));
+            render(React.createElement(FormRendererContainer, { objectId: 'specialty', formId: 'specialtyForm', dataType: 'objectInstances', actionId: '_update', instanceId: 'test-instance' }));
+            const nameField = await screen.findByRole('textbox', { name: 'Name' });
+            await user.clear(nameField);
+            await user.type(nameField, 'Show Hidden');
+            await user.tab();
+            await waitFor(() => {
+                expect(autosaveRequestBody).toBeDefined();
+            });
+            // Should include additionalTraining since it's visible
+            expect(autosaveRequestBody?.input).toEqual({
+                name: 'Show Hidden',
+                additionalTraining: 'Should Autosave',
+            });
+        });
+        it('should exclude hidden form fields from autosave payload', async () => {
+            const user = userEvent.setup();
+            let autosaveRequestBody;
+            const specialtyFormWithHiddenField = {
+                id: 'specialtyForm',
+                name: 'Specialty Form',
+                objectId: 'specialty',
+                actionId: '_update',
+                autosaveActionId: '_autosave',
+                entries: [
+                    {
+                        parameterId: 'name',
+                        type: 'input',
+                        display: {
+                            label: 'Name',
+                        },
+                    },
+                    {
+                        parameterId: 'additionalTraining',
+                        type: 'input',
+                        display: {
+                            label: 'Additional Training',
+                            visibility: {
+                                operator: 'all',
+                                conditions: [
+                                    {
+                                        property: 'name',
+                                        operator: 'eq',
+                                        value: 'Show Hidden',
+                                        isInstanceProperty: false,
+                                    },
+                                ],
+                            },
+                        },
+                    },
+                ],
+            };
+            server.use(http.get('/api/data/objects/specialty/instances/test-instance', () => {
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    name: 'Original Name',
+                    specialtyType: null,
+                    license: null,
+                    additionalTraining: 'Should Not Autosave',
+                });
+            }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
+                return HttpResponse.json(specialtyObject);
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
+                return HttpResponse.json(specialtyFormWithHiddenField);
+            }), http.post('/api/data/objects/specialty/instances/test-instance/actions', async ({ request }) => {
+                const body = (await request.json());
+                if (body.actionId === '_autosave') {
+                    autosaveRequestBody = body;
+                }
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    ...body.input,
+                });
+            }));
+            render(React.createElement(FormRendererContainer, { objectId: 'specialty', formId: 'specialtyForm', dataType: 'objectInstances', actionId: '_update', instanceId: 'test-instance' }));
+            const nameField = await screen.findByRole('textbox', { name: 'Name' });
+            await user.clear(nameField);
+            await user.type(nameField, 'Updated Name');
+            await user.tab();
+            await waitFor(() => {
+                expect(autosaveRequestBody).toBeDefined();
+            });
+            // Should not include additionalTraining since it's hidden
+            expect(autosaveRequestBody?.input).toEqual({
+                name: 'Updated Name',
+            });
+        });
+        it('should exclude non-configured address subfields from autosave payload', async () => {
+            const user = userEvent.setup();
+            let autosaveRequestBody;
+            server.use(http.get('/api/data/objects/license/instances/test-license', () => {
+                return HttpResponse.json({
+                    id: 'test-license',
+                    name: 'RN-123456',
+                    address: {
+                        line1: '123 Main St',
+                        line2: 'Suite 200',
+                        city: 'Boston',
+                        county: 'Suffolk',
+                        state: 'MA',
+                        zipCode: '02101',
+                        country: 'US',
+                    },
+                });
+            }), http.get('/api/data/objects/license/instances/test-license/object', () => {
+                return HttpResponse.json(licenseObject);
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
+                return HttpResponse.json({
+                    ...licenseForm,
+                    autosaveActionId: '_autosave',
+                });
+            }), http.get('/api/data/locations/search', () => {
+                return HttpResponse.json([]);
+            }), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+                const body = (await request.json());
+                if (body.actionId === '_autosave') {
+                    autosaveRequestBody = body;
+                }
+                return HttpResponse.json({
+                    id: 'test-license',
+                    ...body.input,
+                });
+            }));
+            render(React.createElement(FormRendererContainer, { objectId: 'license', formId: 'licenseForm', dataType: 'objectInstances', actionId: '_update', instanceId: 'test-license' }));
+            const cityField = await screen.findByRole('textbox', { name: 'City' });
+            await user.clear(cityField);
+            // react state may not have finished updating state internally yet, so wait for the field to be cleared before proceeding
+            await waitFor(() => {
+                expect(cityField).toHaveValue('');
+            });
+            await user.type(cityField, 'Cambridge');
+            await user.tab();
+            await waitFor(() => {
+                expect(autosaveRequestBody).toBeDefined();
+            });
+            expect(autosaveRequestBody?.input).toEqual({
+                name: 'RN-123456',
+                // Only configured address fields should be included
+                address: {
+                    line1: '123 Main St',
+                    city: 'Cambridge',
+                    state: 'MA',
+                    zipCode: '02101',
+                },
+            });
+        });
         it('should show saving indicator during autosave', async () => {
             const user = userEvent.setup();
             let resolveSave;
@@ -175,7 +490,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -226,7 +541,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -261,7 +576,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -306,7 +621,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/license/instances/test-license/object', () => {
                 return HttpResponse.json(licenseObject);
-            }), http.get('/api/data/forms/licenseForm', () => {
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
                 return HttpResponse.json({
                     ...licenseForm,
                     autosaveActionId: '_autosave',
@@ -363,7 +678,7 @@ describe('FormRendererContainer', () => {
                 if (sanitizedVersion === 'true') {
                     return HttpResponse.json(licenseObject);
                 }
-            }), http.get('/api/data/forms/licenseForm', () => {
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
                 return HttpResponse.json({
                     ...licenseForm,
                     autosaveActionId: '_autosave',
@@ -411,7 +726,7 @@ describe('FormRendererContainer', () => {
                 if (sanitizedVersion === 'true') {
                     return HttpResponse.json(licenseObject);
                 }
-            }), http.get('/api/data/forms/licenseForm', () => {
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
                 return HttpResponse.json({
                     ...licenseForm,
                     autosaveActionId: '_autosave',
@@ -466,7 +781,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -488,7 +803,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/specialty/instances/test-instance/object', () => {
                 return HttpResponse.json(specialtyObject);
-            }), http.get('/api/data/forms/specialtyForm', () => {
+            }), http.get('/api/data/forms/specialtyForm/effective', () => {
                 return HttpResponse.json({
                     ...createSpecialtyForm,
                     actionId: '_update',
@@ -514,6 +829,81 @@ describe('FormRendererContainer', () => {
             // Verify autosave was not triggered
             expect(autosaveActionSpy).not.toHaveBeenCalled();
         });
+        it('should trigger autosave when a rich text field loses focus', async () => {
+            const user = userEvent.setup();
+            const autosaveActionSpy = vi.fn();
+            const richTextForm = {
+                id: 'richTextAutosaveForm',
+                name: 'Rich Text Autosave Form',
+                objectId: 'richTextObject',
+                actionId: '_update',
+                autosaveActionId: '_autosave',
+                entries: [
+                    {
+                        parameterId: 'notes',
+                        type: 'input',
+                        display: {
+                            label: 'Notes',
+                        },
+                    },
+                ],
+            };
+            const richTextObject = {
+                id: 'richTextObject',
+                name: 'Rich Text Object',
+                actions: [
+                    {
+                        id: '_update',
+                        name: 'Update',
+                        type: 'update',
+                        parameters: [
+                            {
+                                id: 'notes',
+                                name: 'Notes',
+                                type: 'richText',
+                            },
+                        ],
+                        outputEvent: 'updated',
+                    },
+                ],
+                properties: [
+                    {
+                        id: 'notes',
+                        name: 'Notes',
+                        type: 'richText',
+                    },
+                ],
+            };
+            const TestRichTextEditor = (props) => {
+                return (React.createElement("textarea", { "aria-label": "Notes", value: props.value || '', onChange: (event) => props.handleUpdate?.(event.target.value), onBlur: () => props.onBlur?.() }));
+            };
+            server.use(http.get('/api/data/objects/richTextObject/effective', () => HttpResponse.json(richTextObject)), http.get('/api/data/objects/richTextObject/instances/test-instance', () => {
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    name: 'Rich Text Instance',
+                    notes: '',
+                });
+            }), http.get('/api/data/objects/richTextObject/instances/test-instance/object', () => {
+                return HttpResponse.json(richTextObject);
+            }), http.get('/api/data/forms/richTextAutosaveForm/effective', () => HttpResponse.json(richTextForm)), http.post('/api/data/objects/richTextObject/instances/test-instance/actions', async ({ request }) => {
+                const body = (await request.json());
+                autosaveActionSpy(body);
+                return HttpResponse.json({
+                    id: 'test-instance',
+                    ...body.input,
+                });
+            }));
+            render(React.createElement(FormRendererContainer, { objectId: "richTextObject", formId: "richTextAutosaveForm", dataType: "objectInstances", actionId: "_update", instanceId: "test-instance", richTextEditor: TestRichTextEditor }));
+            const notesField = await screen.findByRole('textbox', { name: 'Notes' });
+            await user.type(notesField, 'Autosave me');
+            await user.tab();
+            expect(autosaveActionSpy).toHaveBeenCalledWith(expect.objectContaining({
+                actionId: '_autosave',
+                input: expect.objectContaining({
+                    notes: expect.stringContaining('Autosave me'),
+                }),
+            }));
+        });
         it('should trigger autosave immediately when a radio button is selected', async () => {
             const user = userEvent.setup();
             const autosaveActionSpy = vi.fn();
@@ -552,7 +942,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/license/instances/test-license/object', () => {
                 return HttpResponse.json(licenseObject);
-            }), http.get('/api/data/forms/licenseForm', () => {
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
                 return HttpResponse.json(licenseFormWithRadioButtons);
             }), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
@@ -615,7 +1005,7 @@ describe('FormRendererContainer', () => {
                 });
             }), http.get('/api/data/objects/license/instances/test-license/object', () => {
                 return HttpResponse.json(licenseObject);
-            }), http.get('/api/data/forms/licenseForm', () => {
+            }), http.get('/api/data/forms/licenseForm/effective', () => {
                 return HttpResponse.json(licenseFormWithRadioButtons);
             }), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
@@ -661,7 +1051,7 @@ describe('FormRendererContainer', () => {
                     },
                 ],
             };
-            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: 'Active' })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithDropdown)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: 'Active' })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithDropdown)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: body.input.status });
@@ -704,7 +1094,7 @@ describe('FormRendererContainer', () => {
                     },
                 ],
             };
-            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: 'Active' })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithDropdown)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: 'Active' })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithDropdown)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({ id: 'test-license', name: 'RN-123456', status: body.input.status });
@@ -752,7 +1142,7 @@ describe('FormRendererContainer', () => {
                 ],
             };
             const licenseInstanceInitial = { id: 'test-license', name: 'RN-123456' };
-            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json(licenseInstanceInitial)), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json(licenseInstanceInitial)), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({
@@ -802,7 +1192,7 @@ describe('FormRendererContainer', () => {
                 ],
             };
             const licenseInstanceInitial = { id: 'test-license', name: 'RN-123456', categories: ['Electrical'] };
-            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json(licenseInstanceInitial)), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            server.use(http.get('/api/data/objects/license/instances/test-license', () => HttpResponse.json(licenseInstanceInitial)), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({
@@ -857,7 +1247,7 @@ describe('FormRendererContainer', () => {
                 id: 'test-license',
                 name: 'RN-123456',
                 categories: ['Electrical', 'Plumbing'],
-            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({
@@ -914,7 +1304,7 @@ describe('FormRendererContainer', () => {
                 id: 'test-license',
                 name: 'RN-123456',
                 categories: ['Electrical', 'Plumbing'],
-            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({
@@ -969,7 +1359,7 @@ describe('FormRendererContainer', () => {
                 id: 'test-license',
                 name: 'RN-123456',
                 categories: ['Electrical', 'Plumbing'],
-            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
+            })), http.get('/api/data/objects/license/instances/test-license/object', () => HttpResponse.json(licenseObject)), http.get('/api/data/forms/licenseForm/effective', () => HttpResponse.json(licenseFormWithMultiSelect)), http.post('/api/data/objects/license/instances/test-license/actions', async ({ request }) => {
                 const body = (await request.json());
                 autosaveActionSpy(body);
                 return HttpResponse.json({
@@ -1015,7 +1405,7 @@ describe('FormRendererContainer', () => {
             ],
             properties: [],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, dataType: "objectInstances" }));
         await screen.findByText('Simple Form');
     });
@@ -1041,7 +1431,7 @@ describe('FormRendererContainer', () => {
             ],
             properties: [],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, title: {
                 hidden: false,
             }, dataType: "objectInstances" }));
@@ -1069,7 +1459,7 @@ describe('FormRendererContainer', () => {
             ],
             properties: [],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, title: {
                 hidden: true,
             }, dataType: "objectInstances" }));
@@ -1099,7 +1489,7 @@ describe('FormRendererContainer', () => {
             ],
             properties: [],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, actionId: '_create' }));
         await screen.findByRole('button', { name: 'Submit' });
     });
@@ -1125,7 +1515,7 @@ describe('FormRendererContainer', () => {
             ],
             properties: [],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, actionId: '_create' }));
         await screen.findByRole('button', { name: 'Discard Changes' });
     });
@@ -1167,7 +1557,7 @@ describe('FormRendererContainer', () => {
                 },
             ],
         };
-        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+        server.use(http.get(`/api/data/objects/${simpleObject.id}/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         const user = userEvent.setup();
         render(React.createElement(FormRendererContainer, { objectId: simpleObject.id, formId: form.id, actionId: '_create' }));
         const firstNameInput = await screen.findByRole('textbox', { name: 'First Name' });
@@ -1176,6 +1566,72 @@ describe('FormRendererContainer', () => {
         await user.click(discardButton);
         await waitFor(() => expect(firstNameInput).toHaveValue(''));
     });
+    it('should reset rich text content without remounting the editor when discarding changes', async () => {
+        const user = userEvent.setup();
+        const mountSpy = vi.fn();
+        const form = {
+            id: 'richTextDiscardForm',
+            name: 'Rich Text Form',
+            entries: [
+                {
+                    type: 'input',
+                    parameterId: 'notes',
+                    display: {
+                        label: 'Notes',
+                    },
+                },
+            ],
+            actionId: '_update',
+            objectId: 'richTextDiscardObject',
+        };
+        const richTextObject = {
+            id: 'richTextDiscardObject',
+            name: 'Rich Text Object',
+            actions: [
+                {
+                    id: '_update',
+                    name: 'Update',
+                    type: 'update',
+                    parameters: [
+                        {
+                            id: 'notes',
+                            name: 'Notes',
+                            type: 'richText',
+                        },
+                    ],
+                    outputEvent: 'updated',
+                },
+            ],
+            properties: [
+                {
+                    id: 'notes',
+                    name: 'Notes',
+                    type: 'richText',
+                },
+            ],
+        };
+        const TestRichTextEditor = (props) => {
+            React.useEffect(() => {
+                mountSpy();
+            }, []);
+            return (React.createElement("textarea", { "aria-label": "Notes", value: props.value || '', onChange: (event) => props.handleUpdate?.(event.target.value), onBlur: () => props.onBlur?.() }));
+        };
+        server.use(http.get('/api/data/objects/richTextDiscardObject/effective', () => HttpResponse.json(richTextObject)), http.get('/api/data/forms/richTextDiscardForm/effective', () => HttpResponse.json(form)), http.get('/api/data/objects/richTextDiscardObject/instances/test-instance', () => HttpResponse.json({
+            id: 'test-instance',
+            name: 'Rich Text Instance',
+            notes: 'Original notes',
+        })), http.get('/api/data/objects/richTextDiscardObject/instances/test-instance/object', () => HttpResponse.json(richTextObject)));
+        render(React.createElement(FormRendererContainer, { objectId: "richTextDiscardObject", formId: "richTextDiscardForm", dataType: "objectInstances", actionId: "_update", instanceId: "test-instance", richTextEditor: TestRichTextEditor }));
+        const notesField = await screen.findByRole('textbox', { name: 'Notes' });
+        expect(notesField).toHaveValue('{\\rtf1\\ansi\\deff0 {\\fonttbl {\\f0 Calibri;}} \\f0\\fs22 Original notes}');
+        await user.clear(notesField);
+        await user.type(notesField, 'Updated notes');
+        expect(notesField).toHaveValue('Updated notes');
+        const discardButton = await screen.findByRole('button', { name: 'Discard Changes' });
+        await user.click(discardButton);
+        await waitFor(() => expect(notesField).toHaveValue('{\\rtf1\\ansi\\deff0 {\\fonttbl {\\f0 Calibri;}} \\f0\\fs22 Original notes}'));
+        expect(mountSpy).toHaveBeenCalledTimes(1);
+    });
     it('should show a not found error if the instance cannot be found', async () => {
         const form = {
             id: 'simpleForm',
@@ -1221,7 +1677,7 @@ describe('FormRendererContainer', () => {
                 },
             ],
         };
-        server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)), http.get('/api/data/objects/simpleObject/instances/123', () => HttpResponse.json({
+        server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)), http.get('/api/data/objects/simpleObject/instances/123', () => HttpResponse.json({
             message: 'Not Found',
         }, { status: 404 })), http.get('/api/data/objects/simpleObject/instances/123/object', () => HttpResponse.json(simpleObject)));
         render(React.createElement(FormRendererContainer, { formId: form.id, actionId: "_update", objectId: "simpleObject", instanceId: '123' }));
@@ -1272,7 +1728,7 @@ describe('FormRendererContainer', () => {
                 },
             ],
         };
-        server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)), http.get('/api/data/objects/simpleObject/instances/123', () => HttpResponse.json({
+        server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)), http.get('/api/data/objects/simpleObject/instances/123', () => HttpResponse.json({
             message: 'Unauthorized',
         }, { status: 403 })), http.get('/api/data/objects/simpleObject/instances/123/object', () => HttpResponse.json({
             message: 'Unauthorized',
@@ -1320,7 +1776,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)));
             render(React.createElement(FormRendererContainer, { formId: form.id, objectId: "simpleObject", actionId: "_create" }));
             await screen.findByText('Simple Form');
         });
@@ -1339,7 +1795,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/notAForm`, () => HttpResponse.json({ error: 'Not Found' }, { status: 404 })));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/notAForm/effective`, () => HttpResponse.json({ error: 'Not Found' }, { status: 404 })));
             render(React.createElement(FormRendererContainer, { formId: 'notAForm', objectId: "simpleObject", dataType: "objectInstances" }));
             await screen.findByText('The requested content could not be found.');
         });
@@ -1365,7 +1821,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)));
             render(React.createElement(FormRendererContainer, { formId: form.id, objectId: "simpleObject", dataType: "objectInstances" }));
             await screen.findByText('It looks like something is missing.');
         });
@@ -1391,7 +1847,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)));
             render(React.createElement(FormRendererContainer, { formId: form.id, objectId: "simpleObject", actionId: "_create", dataType: "objectInstances" }));
             await screen.findByText('It looks like something is missing.');
         });
@@ -1421,7 +1877,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)));
             render(React.createElement(FormRendererContainer, { objectId: "simpleObject", actionId: "_create", dataType: "objectInstances" }));
             await screen.findByText('Simple Form');
         });
@@ -1442,7 +1898,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/notAForm`, () => HttpResponse.json({ error: 'Not Found' }, { status: 404 })));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/notAForm/effective`, () => HttpResponse.json({ error: 'Not Found' }, { status: 404 })));
             render(React.createElement(FormRendererContainer, { objectId: "simpleObject", actionId: "_create", dataType: "objectInstances" }));
             await screen.findByText('The requested content could not be found.');
         });
@@ -1488,7 +1944,7 @@ describe('FormRendererContainer', () => {
                 ],
                 properties: [],
             };
-            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/simpleObject/effective`, () => HttpResponse.json(simpleObject)), http.get(`/api/data/forms/simpleForm/effective`, () => HttpResponse.json(form)));
             render(React.createElement(FormRendererContainer, { objectId: "simpleObject", actionId: "_create", dataType: "objectInstances" }));
             await screen.findByText('It looks like something is missing.');
         });
@@ -1548,7 +2004,7 @@ describe('FormRendererContainer', () => {
             ],
         };
         beforeEach(() => {
-            server.use(http.get(`/api/data/objects/${validationTestObject.id}/effective`, () => HttpResponse.json(validationTestObject)), http.get(`/api/data/forms/${form.id}`, () => HttpResponse.json(form)));
+            server.use(http.get(`/api/data/objects/${validationTestObject.id}/effective`, () => HttpResponse.json(validationTestObject)), http.get(`/api/data/forms/${form.id}/effective`, () => HttpResponse.json(form)));
         });
         it('should display validation errors after trying to submit the form', async () => {
             const user = userEvent.setup();