[FIX] blockdom: ignore attributes with undefined value

src/blockdom/attributes.ts

@@ -16,7 +16,7 @@ const wordRegexp = /\s+/;
 
 export function createAttrUpdater(attr: string): Setter<HTMLElement> {
   return function (this: HTMLElement, value: any) {
-    if (value !== false) {
+    if (value !== false && value !== undefined) {
       setAttribute.call(this, attr, value === true ? "" : value);
     }
   };

tests/blockdom/block_attributes.test.ts

@@ -65,6 +65,14 @@ test("class attribute", async () => {
   expect(fixture.innerHTML).toBe(`<div class="0"></div>`);
 });
 
+test("attribute with undefined value", async () => {
+  const block = createBlock('<div block-attribute-0="abc"></div>');
+  const tree = block([undefined]);
+
+  mount(tree, fixture);
+  expect(fixture.innerHTML).toBe(`<div></div>`);
+});
+
 test("class attribute with undefined value", async () => {
   const block = createBlock('<div block-attribute-0="class"></div>');
   const tree = block([undefined]);

tests/compiler/__snapshots__/attributes.test.ts.snap

@@ -182,6 +182,34 @@ exports[`attributes dynamic formatted attributes with a dash 1`] = `
 }"
 `;
 
+exports[`attributes dynamic undefined class attribute 1`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    let d1 = ctx['c'];
+    return block1([d1]);
+  }
+}"
+`;
+
+exports[`attributes dynamic undefined generic attribute 1`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  let block1 = createBlock(\`<div block-attribute-0=\\"thing\\"/>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    let d1 = ctx['c'];
+    return block1([d1]);
+  }
+}"
+`;
+
 exports[`attributes fixed variable 1`] = `
 "function anonymous(bdom, helpers
 ) {

tests/compiler/attributes.test.ts

@@ -52,6 +52,18 @@ describe("attributes", () => {
     expect(result).toBe(`<div></div>`);
   });
 
+  test("dynamic undefined generic attribute", () => {
+    const template = `<div t-att-thing="c"/>`;
+    const result = renderToString(template, { c: undefined });
+    expect(result).toBe(`<div></div>`);
+  });
+
+  test("dynamic undefined class attribute", () => {
+    const template = `<div t-att-class="c"/>`;
+    const result = renderToString(template, { c: undefined });
+    expect(result).toBe(`<div></div>`);
+  });
+
   test("dynamic attribute with a dash", () => {
     const template = `<div t-att-data-action-id="id"/>`;
     const result = renderToString(template, { id: 32 });