On Edge/IE11 input is stamping the expression placeholder as the value

[notwaldorf]

In a LitElement, if you are using an <input value="${props._value}"> in your template and props._value is undefined, then Edge/IE stamp the expression placeholder instead of something good:

If you set a default value for _value in the element's constructor then it's fine.

Repro: https://lit-element-example-6nhwjs.stackblitz.io
(Works fine on Chrome/FF/Safari, borked on Edge/IE11)

[bgotink]

const tpl = document.createElement('template');
tpl.innerHTML = '<input value="foo">';
const input = document.importNode(tpl.content, true).firstElementChild;

input.removeAttribute('value');
console.log('value is now:');
console.log(JSON.stringify(input.value));

This logs the value as "" for Chrome and "foo" for Edge. This explains why you get the expected result in your example in Chrome etc, but this actually accidentally also masks a bug in lit-html:

Setting the _value to empty string in the constructor means the first render will call the value property setter on the input element. When this initial _value is undefined, this setter is not called because the _equalToPreviousValues of AttributePart returns true.
This is wrong, on a first render _equalToPreviousValues should never be true.

Repro in @notwaldorf's example: https://stackblitz.com/edit/lit-element-example-sqqeig. Note how the setter never gets called unless you uncomment the this._value = ''; in the constructor.

Another result of the fact that _equalToPreviousValues returns true if the initial value is undefined is the following unexpected behaviour:

import {render, html} from 'lit-html';

render(html`
  <div test="${undefined} is ${undefined}"></div>
`, document.body);

console.log(document.body.innerHTML);

logs

<div></div>

Repro: https://stackblitz.com/edit/lit-element-example-fqhsbb

[justinfagnani]

I couldn't repro this anymore, so I think it was fixed by #377, but I added a test in #448