[IMP] qweb: add indeterminate to special input properties

Input with type="checkbox" have a special property (indeterminate) to
visually display the fact that the input value is non determinate (in my
chrome browser, the checkbox is then drawn with a simple - inside). It
does not actually modify the value of the input, only the way it is
displayed.

So, with this commit, owl will properly set the property, as expected.

closes #713

src/qweb/qweb.ts

@@ -66,8 +66,6 @@ interface QWebConfig {
 // Const/global stuff/helpers
 //------------------------------------------------------------------------------
 
-const DISABLED_TAGS = ["input", "textarea", "button", "select", "option", "optgroup"];
-
 const TRANSLATABLE_ATTRS = ["label", "title", "placeholder", "alt"];
 
 const lineBreakRE = /[\r\n]/;
@@ -683,23 +681,29 @@ export class QWeb extends EventBus {
 
     function handleProperties(key, val) {
       let isProp = false;
-      if (node.nodeName === "input" && key === "checked") {
+      switch (node.nodeName) {
+        case "input":
           let type = (<Element>node).getAttribute("type");
           if (type === "checkbox" || type === "radio") {
+            if (key === "checked" || key === "indeterminate") {
               isProp = true;
             }
           }
-      if (node.nodeName === "input" && key === "value") {
+          if (key === "value" || key === "readonly" || key === "disabled") {
             isProp = true;
           }
-      if (node.nodeName === "option" && key === "selected") {
+          break;
-        isProp = true;
+        case "option":
-      }
+          isProp = key === "selected" || key === "disabled";
-      if (key === "disabled" && DISABLED_TAGS.indexOf(node.nodeName) > -1) {
+          break;
-        isProp = true;
+        case "textarea":
-      }
+          isProp = key === "readonly" || key === "disabled";
-      if ((key === "readonly" && node.nodeName === "input") || node.nodeName === "textarea") {
+          break;
-        isProp = true;
+        case "button":
+        case "select":
+        case "optgroup":
+          isProp = key === "disabled";
+          break;
       }
       if (isProp) {
         props.push(`${key}: _${val}`);

tests/qweb/__snapshots__/qweb.test.ts.snap

@@ -1059,7 +1059,7 @@ exports[`properly support svg add proper namespace to svg 1`] = `
 }"
 `;
 
-exports[`special cases for some boolean html attributes/properties input type= checkbox, with t-att-checked 1`] = `
+exports[`special cases for some specific html attributes/properties input type= checkbox, with t-att-checked 1`] = `
 "function anonymous(context, extra
 ) {
     // Template name: \\"test\\"
@@ -1073,7 +1073,7 @@ exports[`special cases for some boolean html attributes/properties input type= c
 }"
 `;
 
-exports[`special cases for some boolean html attributes/properties various boolean html attributes 1`] = `
+exports[`special cases for some specific html attributes/properties various boolean html attributes 1`] = `
 "function anonymous(context, extra
 ) {
     // Template name: \\"test\\"

tests/qweb/qweb.test.ts

@@ -1850,7 +1850,7 @@ describe("loading templates", () => {
   });
 });
 
-describe("special cases for some boolean html attributes/properties", () => {
+describe("special cases for some specific html attributes/properties", () => {
   test("input type= checkbox, with t-att-checked", () => {
     qweb.addTemplate("test", `<input type="checkbox" t-att-checked="flag"/>`);
     const result = renderToString(qweb, "test", { flag: true });
@@ -1896,6 +1896,14 @@ describe("special cases for some boolean html attributes/properties", () => {
     patch(vnode2, vnode3);
     expect(elm.value).toBe("potato");
   });
+
+  test("input of type checkbox with t-att-indeterminate", () => {
+    qweb.addTemplate("test", `<input type="checkbox" t-att-indeterminate="v"/>`);
+    const vnode1 = qweb.render("test", { v: true });
+    const vnode2 = patch(document.createElement("input"), vnode1);
+    let elm = vnode2.elm as HTMLInputElement;
+    expect(elm.indeterminate).toBe(true);
+  });
 });
 
 describe("whitespace handling", () => {