From 2ee329f6ca8417fea1b3cb9fe632ef2befcc3817 Mon Sep 17 00:00:00 2001 From: FrancoisGe Date: Tue, 12 Sep 2023 09:58:56 +0200 Subject: [PATCH] [FIX] web: close button in form view dialog discard The goal of this commit is to ensure that the form view dialog close button performs the same behaviour as the discard button. To enable this, we had to add the dialogData.dismiss, which lets you add a callBack that will only be executed when a dialog is closed because of the "x" or the "escape" shortcut. closes odoo/odoo#135116 Related: odoo/enterprise#47283 Signed-off-by: Aaron Bohy (aab) --- .../confirmation_dialog.js | 6 ++-- addons/web/static/src/core/dialog/dialog.js | 9 +++++- addons/web/static/src/core/dialog/dialog.xml | 5 ++- .../src/views/fields/relational_utils.js | 6 ++-- .../views/view_dialogs/form_view_dialog.js | 15 +++++---- .../view_dialogs/select_create_dialog.xml | 2 +- .../src/webclient/actions/action_dialog.xml | 1 - addons/web/static/tests/core/dialog_tests.js | 18 +++++++---- .../view_dialogs/form_view_dialog_tests.js | 32 +++++++++++++++++++ 9 files changed, 70 insertions(+), 24 deletions(-) diff --git a/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.js b/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.js index cb9991e4909..1c5e93ee7f1 100644 --- a/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.js +++ b/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.js @@ -8,17 +8,17 @@ import { Component } from "@odoo/owl"; export class ConfirmationDialog extends Component { setup() { - this.env.dialogData.close = () => this._cancel(); + this.env.dialogData.dismiss = () => this._cancel(); this.modalRef = useChildRef(); this.isProcess = false; } async _cancel() { - this.execButton(this.props.cancel); + return this.execButton(this.props.cancel); } async _confirm() { - this.execButton(this.props.confirm); + return this.execButton(this.props.confirm); } setButtonsDisabled(disabled) { diff --git a/addons/web/static/src/core/dialog/dialog.js b/addons/web/static/src/core/dialog/dialog.js index 310f72ca9f6..00cb2cc8f79 100644 --- a/addons/web/static/src/core/dialog/dialog.js +++ b/addons/web/static/src/core/dialog/dialog.js @@ -90,7 +90,14 @@ export class Dialog extends Component { } onEscape() { - this.data.close(); + return this.dismiss(); + } + + async dismiss() { + if (this.data.dismiss) { + await this.data.dismiss(); + } + return this.data.close(); } } Dialog.template = "web.Dialog"; diff --git a/addons/web/static/src/core/dialog/dialog.xml b/addons/web/static/src/core/dialog/dialog.xml index 75e0e16734e..78a1f34836b 100644 --- a/addons/web/static/src/core/dialog/dialog.xml +++ b/addons/web/static/src/core/dialog/dialog.xml @@ -13,7 +13,6 @@
- @@ -38,13 +37,13 @@ - + diff --git a/addons/web/static/src/views/fields/relational_utils.js b/addons/web/static/src/views/fields/relational_utils.js index 25021920376..4ad5a4dbb37 100644 --- a/addons/web/static/src/views/fields/relational_utils.js +++ b/addons/web/static/src/views/fields/relational_utils.js @@ -301,7 +301,7 @@ export class Many2XAutocomplete extends Component { }); } - if (!this.props.noSearchMore && records.length > 0) { + if (!this.props.noSearchMore && records.length > 0) { options.push({ label: _t("Search More..."), action: this.onSearchMore.bind(this, request), @@ -508,7 +508,7 @@ export class X2ManyFieldDialog extends Component { this.title = this.props.title; this.contentClass = computeViewClassName("form", this.archInfo.xmlDoc); useSubEnv({ config: this.props.config }); - this.env.dialogData.close = () => this.discard(); + this.env.dialogData.dismiss = () => this.discard(); useBus(this.record.model.bus, "update", () => this.render(true)); @@ -633,7 +633,7 @@ X2ManyFieldDialog.props = { save: Function, title: String, delete: { optional: true }, - deleteButtonLabel: {optional: true}, + deleteButtonLabel: { optional: true }, config: Object, }; X2ManyFieldDialog.template = "web.X2ManyFieldDialog"; diff --git a/addons/web/static/src/views/view_dialogs/form_view_dialog.js b/addons/web/static/src/views/view_dialogs/form_view_dialog.js index d19061a11d4..edf4b84f4f6 100644 --- a/addons/web/static/src/views/view_dialogs/form_view_dialog.js +++ b/addons/web/static/src/views/view_dialogs/form_view_dialog.js @@ -11,6 +11,7 @@ export class FormViewDialog extends Component { super.setup(); this.modalRef = useChildRef(); + this.env.dialogData.dismiss = () => this.discardRecord(); const buttonTemplate = this.props.isToMany ? "web.FormViewDialog.ToMany.buttons" @@ -28,12 +29,7 @@ export class FormViewDialog extends Component { viewId: this.props.viewId || false, preventCreate: this.props.preventCreate, preventEdit: this.props.preventEdit, - discardRecord: async () => { - if (this.props.onRecordDiscarded) { - await this.props.onRecordDiscarded(); - } - this.props.close(); - }, + discardRecord: this.discardRecord.bind(this), saveRecord: async (record, { saveAndNew }) => { const saved = await record.save({ reload: false }); if (saved) { @@ -70,6 +66,13 @@ export class FormViewDialog extends Component { } }); } + + async discardRecord() { + if (this.props.onRecordDiscarded) { + await this.props.onRecordDiscarded(); + } + this.props.close(); + } } FormViewDialog.components = { Dialog, View }; diff --git a/addons/web/static/src/views/view_dialogs/select_create_dialog.xml b/addons/web/static/src/views/view_dialogs/select_create_dialog.xml index 7d4ac8373cf..f5211831d6a 100644 --- a/addons/web/static/src/views/view_dialogs/select_create_dialog.xml +++ b/addons/web/static/src/views/view_dialogs/select_create_dialog.xml @@ -5,7 +5,7 @@ - + diff --git a/addons/web/static/src/webclient/actions/action_dialog.xml b/addons/web/static/src/webclient/actions/action_dialog.xml index 14cf92ba409..37356e65f12 100644 --- a/addons/web/static/src/webclient/actions/action_dialog.xml +++ b/addons/web/static/src/webclient/actions/action_dialog.xml @@ -17,7 +17,6 @@ - diff --git a/addons/web/static/tests/core/dialog_tests.js b/addons/web/static/tests/core/dialog_tests.js index 51ba0f2c01f..66307f94a64 100644 --- a/addons/web/static/tests/core/dialog_tests.js +++ b/addons/web/static/tests/core/dialog_tests.js @@ -14,6 +14,7 @@ import { triggerEvent, triggerHotkey, dragAndDrop, + nextTick, } from "../helpers/utils"; import { makeFakeDialogService } from "../helpers/mock_services"; @@ -81,6 +82,7 @@ QUnit.module("Components", (hooks) => { const env = await makeDialogTestEnv(); env.dialogData.close = () => assert.step("close"); + env.dialogData.dismiss = () => assert.step("dismiss"); parent = await mount(Parent, target, { env }); assert.strictEqual( target.querySelector("header .modal-title").textContent, @@ -89,7 +91,8 @@ QUnit.module("Components", (hooks) => { assert.strictEqual(target.querySelector("footer button").textContent, "Ok"); // Same effect as clicking on the x button triggerHotkey("escape"); - assert.verifySteps(["close"]); + await nextTick(); + assert.verifySteps(["dismiss", "close"]); // Same effect as clicking on the Ok button triggerHotkey("control+enter"); assert.verifySteps(["close"]); @@ -123,9 +126,10 @@ QUnit.module("Components", (hooks) => { }); QUnit.test("click on the button x triggers the service close", async function (assert) { - assert.expect(3); + assert.expect(4); const env = await makeDialogTestEnv(); env.dialogData.close = () => assert.step("close"); + env.dialogData.dismiss = () => assert.step("dismiss"); class Parent extends Component {} Parent.template = xml` @@ -137,19 +141,20 @@ QUnit.module("Components", (hooks) => { parent = await mount(Parent, target, { env }); assert.containsOnce(target, ".o_dialog"); await click(target, ".o_dialog header button.btn-close"); - assert.verifySteps(["close"]); + assert.verifySteps(["dismiss", "close"]); }); QUnit.test( - "click on the button x triggers the close defined by a Child component", + "click on the button x triggers the close and dismiss defined by a Child component", async function (assert) { - assert.expect(3); + assert.expect(4); const env = await makeDialogTestEnv(); class Child extends Component { static template = xml`
Hello
`; setup() { this.env.dialogData.close = () => assert.step("close"); + this.env.dialogData.dismiss = () => assert.step("dismiss"); } } class Parent extends Component {} @@ -163,7 +168,7 @@ QUnit.module("Components", (hooks) => { assert.containsOnce(target, ".o_dialog"); await click(target, ".o_dialog header button.btn-close"); - assert.verifySteps(["close"]); + assert.verifySteps(["dismiss", "close"]); } ); @@ -172,6 +177,7 @@ QUnit.module("Components", (hooks) => { async function (assert) { const env = await makeDialogTestEnv(); env.dialogData.close = () => assert.step("close"); + env.dialogData.dismiss = () => assert.step("dismiss"); assert.expect(3); class Parent extends Component {} diff --git a/addons/web/static/tests/views/view_dialogs/form_view_dialog_tests.js b/addons/web/static/tests/views/view_dialogs/form_view_dialog_tests.js index cf95da9b83a..01bb5e7efef 100644 --- a/addons/web/static/tests/views/view_dialogs/form_view_dialog_tests.js +++ b/addons/web/static/tests/views/view_dialogs/form_view_dialog_tests.js @@ -386,4 +386,36 @@ QUnit.module("ViewDialogs", (hooks) => { await nextTick(); assert.containsNone(target, ".o_dialog .o_form_view"); }); + + QUnit.test("FormViewDialog with discard button", async function (assert) { + serverData.views = { + "partner,false,form": `
`, + }; + + const webClient = await createWebClient({ serverData }); + webClient.env.services.dialog.add(FormViewDialog, { + resModel: "partner", + resId: 1, + onRecordDiscarded: () => assert.step("discard"), + }); + await nextTick(); + + assert.containsOnce(target, ".o_dialog .o_form_view"); + assert.containsOnce(target, ".o_dialog .modal-footer .o_form_button_cancel"); + await click(target.querySelector(".o_dialog .modal-footer .o_form_button_cancel")); + assert.verifySteps(["discard"]); + assert.containsNone(target, ".o_dialog .o_form_view"); + + webClient.env.services.dialog.add(FormViewDialog, { + resModel: "partner", + resId: 1, + onRecordDiscarded: () => assert.step("discard"), + }); + await nextTick(); + + assert.containsOnce(target, ".o_dialog .o_form_view"); + await click(target.querySelector(".o_dialog .btn-close")); + assert.verifySteps(["discard"]); + assert.containsNone(target, ".o_dialog .o_form_view"); + }); });