Adding select options always sets select value to last item

If you have an empty <select> box and then later add items to it, the "selection" (value) of the select box always seems to be set to the final item. I would expect it to be set to the first item, as it is when you first load a select box with items in it and no explicit value set.

In my case, I'd like to keep it focused on the option that says "Select..." until the user actually selects something.

Here's a small test case. I think requirebin's gatekeeper server is down so I can't post a demo.

const yo = require('yo-yo')

const View = (items) => yo`
  <select>
    ${items.length
      ? yo`<option value="">Select...</option>`
      : ''}
    ${items.map((item) => yo`
      <option>${item}</option>
    `)}
  </select>
`

const noItems = []
const viewA = View(noItems)

document.body.appendChild(viewA)

window.setTimeout(() => {
  const aFewItems = ['a', 'b', 'c']
  const viewB = View(aFewItems)
  yo.update(viewA, viewB)
}, 3000)

Any idea what's wrong?

Start by running the JavaScript reproduction from the issue and trace the yo.update(viewA, viewB) path that handles the select element and its options. Done means updating an initially empty select produces the first option as the value rather than the final item, while preserving the intended "Select..." behavior.