Setting multiple props with dot syntax fails

[Chris Haynes]

It looks like there's an issue around setting multiple properties. The following test fails:

Deno.test('Multiple props can be passed with dot syntax', async () => {
  let { html } = new Ocean({ document });
  class MyPropEl extends HTMLElement {
    constructor() {
      super();
      this.attachShadow({ mode: 'open' });
    }
    connectedCallback() {
      let name = this.name;
      let div = document.createElement('div');
      div.id = "name";
      div.textContent = name;
      this.shadowRoot.append(div);

      let city = this.city;
      let div2 = document.createElement('div');
      div2.id = 'city';
      div2.textContent = city;
      this.shadowRoot.append(div2);
    }
  }
  customElements.define('my-prop-el', MyPropEl);
  let iter = html`<my-prop-el .name="${'Wilbur'}" .city="${'London'}" class="dark"></my-prop-el>`;
  let out = await consume(iter);

  assertStringIncludes(out, `<my-prop-el class="dark">`, 'Start tag no prop attrs');
  assertStringIncludes(out, `<div id="name">Wilbur</div><div id="city">London</div>`, 'Content from the props');
});

with the output being:

<my-prop-el class="dark">
  <template shadowroot="open">
    <div id="name"></div>
    <div id="city">Wilbur</div>
  </template>
</my-prop-el>

so it looks like only the first prop value is used and is set to the last prop passed? I will investigate the cause.

Thanks.