From 9d0fd2701215d0643b9e3e59275c925b650030c9 Mon Sep 17 00:00:00 2001 From: Gildas Garcia <1122076+djhi@users.noreply.github.com> Date: Thu, 14 Jan 2021 16:20:38 +0100 Subject: [PATCH 1/3] Fix Warning Avout Unsaved Change --- packages/ra-core/src/form/useInitializeFormWithRecord.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/ra-core/src/form/useInitializeFormWithRecord.ts b/packages/ra-core/src/form/useInitializeFormWithRecord.ts index 4138d4c7382..6084cfb5562 100644 --- a/packages/ra-core/src/form/useInitializeFormWithRecord.ts +++ b/packages/ra-core/src/form/useInitializeFormWithRecord.ts @@ -15,7 +15,14 @@ const useInitializeFormWithRecord = record => { const initialValues = form.getState().initialValues; const initialValuesMergedWithRecord = merge({}, initialValues, record); - form.initialize(initialValuesMergedWithRecord); + + // Disable this option when re-initializing the form because in this case, it should reset the dirty state of all fields + // We do need to keep this option for dynamically added inputs though which is why it is kept at the form level + form.setConfig('keepDirtyOnReinitialize', false); + // Ignored until next version of final-form is released. See https://github.com/final-form/final-form/pull/376 + // @ts-ignore + form.restart(initialValuesMergedWithRecord); + form.setConfig('keepDirtyOnReinitialize', true); }, [form, JSON.stringify(record)]); // eslint-disable-line react-hooks/exhaustive-deps }; From 48250e29e402a71b04a0e341813eb3c8832fb768 Mon Sep 17 00:00:00 2001 From: Gildas Garcia <1122076+djhi@users.noreply.github.com> Date: Fri, 15 Jan 2021 10:02:34 +0100 Subject: [PATCH 2/3] Add a test --- cypress/integration/edit.js | 48 ++++++++++++++++++++----------------- cypress/support/EditPage.js | 3 +++ 2 files changed, 29 insertions(+), 22 deletions(-) diff --git a/cypress/integration/edit.js b/cypress/integration/edit.js index b91edfb2862..71c40d5353b 100644 --- a/cypress/integration/edit.js +++ b/cypress/integration/edit.js @@ -74,30 +74,15 @@ describe('Edit Page', () => { EditPostTagsPage.navigate(); EditPostTagsPage.gotoTab(3); - // Music is selected by default + // Select first notification input checkbox cy.get( - EditPostTagsPage.elements.input('tags', 'reference-array-input') + EditPostTagsPage.elements.input( + 'notifications', + 'checkbox-group-input' + ) ) - .get(`div[role=button]`) - .contains('Music') - .should('exist'); - - EditPostTagsPage.clickInput('change-filter'); - - // Music should not be selected anymore after filter reset - cy.get( - EditPostTagsPage.elements.input('tags', 'reference-array-input') - ) - .get(`div[role=button]`) - .contains('Music') - .should('not.exist'); - - EditPostTagsPage.clickInput('tags', 'reference-array-input'); - - // Music should not be visible in the list after filter reset - cy.get('div[role=listbox]').contains('Music').should('not.exist'); - - cy.get('div[role=listbox]').contains('Photo').should('exist'); + .eq(0) + .click(); }); }); @@ -256,4 +241,23 @@ describe('Edit Page', () => { .eq(2) .should(el => expect(el).to.contain('Sed quo et et fugiat modi')); }); + + it('should not display a warning about unsaved changes when an array input has been updated', () => { + ListPagePosts.navigate(); + ListPagePosts.nextPage(); // Ensure the record is visible in the table + + EditPostPage.navigate(); + // Select first notification input checkbox + cy.get( + EditPostPage.elements.input('notifications', 'checkbox-group-input') + ) + .eq(0) + .click(); + + EditPostPage.submit(); + + // If the update succeeded without display a warning about unsaved changes, + // we should have been redirected to the list + cy.url().then(url => expect(url).to.contain('/#/posts')); + }); }); diff --git a/cypress/support/EditPage.js b/cypress/support/EditPage.js index 21700c8bdd1..4a9314028fc 100644 --- a/cypress/support/EditPage.js +++ b/cypress/support/EditPage.js @@ -6,6 +6,9 @@ export default url => ({ if (type === 'rich-text-input') { return `.ra-input-${name} .ql-editor`; } + if (type === 'checkbox-group-input') { + return `.ra-input-${name} label`; + } if (type === 'reference-array-input') { return `.ra-input div[role=combobox]`; } From 28dd222241c089b5895549cdb6c71ce03b20a33f Mon Sep 17 00:00:00 2001 From: Gildas Garcia <1122076+djhi@users.noreply.github.com> Date: Fri, 15 Jan 2021 10:32:24 +0100 Subject: [PATCH 3/3] Revert wrong change --- cypress/integration/edit.js | 29 ++++++++++++++++++++++------- 1 file changed, 22 insertions(+), 7 deletions(-) diff --git a/cypress/integration/edit.js b/cypress/integration/edit.js index 71c40d5353b..d23df5aefa9 100644 --- a/cypress/integration/edit.js +++ b/cypress/integration/edit.js @@ -74,15 +74,30 @@ describe('Edit Page', () => { EditPostTagsPage.navigate(); EditPostTagsPage.gotoTab(3); - // Select first notification input checkbox + // Music is selected by default cy.get( - EditPostTagsPage.elements.input( - 'notifications', - 'checkbox-group-input' - ) + EditPostTagsPage.elements.input('tags', 'reference-array-input') ) - .eq(0) - .click(); + .get(`div[role=button]`) + .contains('Music') + .should('exist'); + + EditPostTagsPage.clickInput('change-filter'); + + // Music should not be selected anymore after filter reset + cy.get( + EditPostTagsPage.elements.input('tags', 'reference-array-input') + ) + .get(`div[role=button]`) + .contains('Music') + .should('not.exist'); + + EditPostTagsPage.clickInput('tags', 'reference-array-input'); + + // Music should not be visible in the list after filter reset + cy.get('div[role=listbox]').contains('Music').should('not.exist'); + + cy.get('div[role=listbox]').contains('Photo').should('exist'); }); });