[FIX] web: popover clickAway don't preventDefault by default
Since commit 3d218e1, clicking outside
a popover closes the popover and performs a preventDefault on the event.
As a consequence, changes made in the property definition popover are no
longer applied when the popover is closed by clicking outside.
Problem:
The preventDefault has the consequence of cancelling the input change
event allowing the change to be applied to the property definition when
the popover is closed.
Solution:
Remove the preventDefault by default and only use it in the case of the
calendar view, which is the only use case that wants to prevent the click
event so as not to open a record creation dialog (see commit 3d218e1).
How to reproduce the PropertyField bug:
- Go to a form view with a properties field
- Click on the edit property button
- A popover opens so that you can edit the field definition
- Type a few characters in the label input
- Click outside the popover
Before this commit:
The value inserted in the popover is ignored
After this commit:
The value inserted in the popover is applied to the property.
It is not possible to write a test reproducing this native browser behaviour.
closes odoo/odoo#142842
Signed-off-by: Michaël Mattiello (mcm) <mcm@odoo.com>
This commit is contained in:
@@ -56,7 +56,6 @@ export class PopoverController extends Component {
|
||||
const target = ev.composedPath()[0];
|
||||
if (this.props.closeOnClickAway(target) && !this.isInside(target)) {
|
||||
this.props.close();
|
||||
ev.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ import { Field } from "@web/views/fields/field";
|
||||
import { Record } from "@web/model/record";
|
||||
import { getFormattedDateSpan } from "@web/views/calendar/utils";
|
||||
|
||||
import { Component } from "@odoo/owl";
|
||||
import { Component, useExternalListener } from "@odoo/owl";
|
||||
|
||||
export class CalendarCommonPopover extends Component {
|
||||
setup() {
|
||||
@@ -17,6 +17,8 @@ export class CalendarCommonPopover extends Component {
|
||||
this.date = null;
|
||||
this.dateDuration = null;
|
||||
|
||||
useExternalListener(window, "pointerdown", (e) => e.preventDefault(), { capture: true });
|
||||
|
||||
this.computeDateTimeAndDuration();
|
||||
}
|
||||
|
||||
|
||||
@@ -85,30 +85,6 @@ QUnit.test("close on click away", async (assert) => {
|
||||
assert.containsNone(fixture, ".o_popover #comp");
|
||||
});
|
||||
|
||||
QUnit.test("close on click away should be default prevented", async (assert) => {
|
||||
assert.expect(6);
|
||||
class Comp extends Component {}
|
||||
Comp.template = xml`<div id="comp">in popover</div>`;
|
||||
|
||||
popovers.add(popoverTarget, Comp, {});
|
||||
await nextTick();
|
||||
|
||||
assert.containsOnce(fixture, ".o_popover");
|
||||
assert.containsOnce(fixture, ".o_popover #comp");
|
||||
const closeButton = fixture.querySelector("#close");
|
||||
function clickListener(ev) {
|
||||
assert.step(`click-event-${ev.defaultPrevented ? "default-prevented" : ""}`);
|
||||
}
|
||||
closeButton.addEventListener("pointerdown", clickListener);
|
||||
|
||||
await click(fixture, "#close");
|
||||
|
||||
assert.containsNone(fixture, ".o_popover");
|
||||
assert.containsNone(fixture, ".o_popover #comp");
|
||||
assert.verifySteps(["click-event-default-prevented"]);
|
||||
closeButton.removeEventListener("pointerdown", clickListener);
|
||||
});
|
||||
|
||||
QUnit.test("close on 'Escape' keydown", async (assert) => {
|
||||
class Comp extends Component {}
|
||||
Comp.template = xml`<div id="comp">in popover</div>`;
|
||||
|
||||
Reference in New Issue
Block a user