From b242230e20b99746ca0c970447cc993b63b5fe8c Mon Sep 17 00:00:00 2001
From: Samuel Degueldre <sad@odoo.com>
Date: Mon, 30 Aug 2021 11:29:00 +0200
Subject: [PATCH] [FIX] qweb: fix overlapping multi-class in t-att-class

Previously, if two attributes in t-att-class shared some classes, their
presence would be determined by the last attribute declared, instead of
being present if any attribute containing it evaluates to true. This
commit fixes that.
---
 src/qweb/qweb.ts                              |  4 +--
 .../__snapshots__/qweb_t_att.test.ts.snap     | 28 +++++++++++++++++++
 tests/qweb/qweb_t_att.test.ts                 |  9 ++++++
 3 files changed, 39 insertions(+), 2 deletions(-)

diff --git a/src/qweb/qweb.ts b/src/qweb/qweb.ts
index 07e06fa6..b23d7d2d 100644
--- a/src/qweb/qweb.ts
+++ b/src/qweb/qweb.ts
@@ -127,12 +127,12 @@ const UTILS: Utils = {
       return result;
     }
     // this is already an object, but we may need to split keys:
-    // {'a': true, 'b c': true} should become {a: true, b: true, c: true}
+    // {'a b': true, 'a c': false} should become {a: true, b: true, c: false}
     for (let key in expr) {
       const value = expr[key];
       const words = key.split(/\s+/);
       for (let word of words) {
-        result[word] = value;
+        result[word] = result[word] || value;
       }
     }
     return result;
diff --git a/tests/qweb/__snapshots__/qweb_t_att.test.ts.snap b/tests/qweb/__snapshots__/qweb_t_att.test.ts.snap
index 2da7fc7a..be011d1a 100644
--- a/tests/qweb/__snapshots__/qweb_t_att.test.ts.snap
+++ b/tests/qweb/__snapshots__/qweb_t_att.test.ts.snap
@@ -27,3 +27,31 @@ exports[`qweb t-att t-att-class with multiple classes 2`] = `
     return vn4;
 }"
 `;
+
+exports[`qweb t-att t-att-class with multiple classes, some of which are duplicate 1`] = `
+"function anonymous(context, extra
+) {
+    // Template name: \\"test\\"
+    let utils = this.constructor.utils;
+    let scope = Object.create(context);
+    let h = this.h;
+    let _1 = utils.toClassObj({'a b c':scope['value'],'a b d':!scope['value']});
+    let c2 = [], p2 = {key:2,class:_1};
+    let vn2 = h('div', p2, c2);
+    return vn2;
+}"
+`;
+
+exports[`qweb t-att t-att-class with multiple classes, some of which are duplicate 2`] = `
+"function anonymous(context, extra
+) {
+    // Template name: \\"test\\"
+    let utils = this.constructor.utils;
+    let scope = Object.create(context);
+    let h = this.h;
+    let _3 = utils.toClassObj({'a b c':scope['value'],'a b d':!scope['value']});
+    let c4 = [], p4 = {key:4,class:_3};
+    let vn4 = h('div', p4, c4);
+    return vn4;
+}"
+`;
diff --git a/tests/qweb/qweb_t_att.test.ts b/tests/qweb/qweb_t_att.test.ts
index 4d10c3af..25b7644e 100644
--- a/tests/qweb/qweb_t_att.test.ts
+++ b/tests/qweb/qweb_t_att.test.ts
@@ -24,4 +24,13 @@ describe("qweb t-att", () => {
       '<div class="a b c"></div>'
     );
   });
+
+  test("t-att-class with multiple classes, some of which are duplicate", () => {
+    expect(render(`<div t-att-class="{'a b c': value, 'a b d': !value}" />`, { value: true })).toBe(
+      '<div class="a b c"></div>'
+    );
+    expect(render(`<div t-att-class="{'a b c': value, 'a b d': !value}" />`, { value: false })).toBe(
+      '<div class="a b d"></div>'
+    );
+  });
 });