mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[FIX] compiler: better handle update of properties with same value
Before this commit, owl would incorrectly skip patching html properties when the new value is the same as the value used in the previous render. However, this is incorrect, since the user may have changed the value by clicking on a checkbox, or changing some text in an input. So, to be more correct, owl has to force the update whenever it encounters a prop. This is however hard to do without impacting the main update loop, so we kind of work around the problem by using String and Boolean instance, instead of primitive values.
This commit is contained in:
committed by
Sam Degueldre
parent
6c72e0a143
commit
f8073cb153
@@ -429,6 +429,42 @@ describe("special cases for some specific html attributes/properties", () => {
|
||||
expect(input.value).toBe("potato");
|
||||
});
|
||||
|
||||
test("input with t-att-value (patching with same value", () => {
|
||||
// render input with initial value
|
||||
const template = `<input t-att-value="v"/>`;
|
||||
const bnode1 = renderToBdom(template, { v: "zucchini" });
|
||||
const fixture = makeTestFixture();
|
||||
mount(bnode1, fixture);
|
||||
const input = fixture.querySelector("input")!;
|
||||
expect(input.value).toBe("zucchini");
|
||||
|
||||
// change value manually in input, to simulate user input
|
||||
input.value = "tomato";
|
||||
expect(input.value).toBe("tomato");
|
||||
|
||||
const bnode2 = renderToBdom(template, { v: "zucchini" });
|
||||
patch(bnode1, bnode2);
|
||||
expect(input.value).toBe("zucchini");
|
||||
});
|
||||
|
||||
test("input, type checkbox, with t-att-checked (patching with same value", () => {
|
||||
// render input with initial value
|
||||
const template = `<input type="checkbox" t-att-checked="v"/>`;
|
||||
const bnode1 = renderToBdom(template, { v: true });
|
||||
const fixture = makeTestFixture();
|
||||
mount(bnode1, fixture);
|
||||
const input = fixture.querySelector("input")!;
|
||||
expect(input.checked).toBe(true);
|
||||
|
||||
// change checked manually in input, to simulate user input
|
||||
input.checked = false;
|
||||
expect(input.checked).toBe(false);
|
||||
|
||||
const bnode2 = renderToBdom(template, { v: true });
|
||||
patch(bnode1, bnode2);
|
||||
expect(input.checked).toBe(true);
|
||||
});
|
||||
|
||||
test("input of type checkbox with t-att-indeterminate", () => {
|
||||
const template = `<input type="checkbox" t-att-indeterminate="v"/>`;
|
||||
const bnode1 = renderToBdom(template, { v: true });
|
||||
|
||||
Reference in New Issue
Block a user