Part doesn't work in light DOM

by dandclark_msft

HTML

<!DOCTYPE html>

<style>
  ::part(foo) {
    background-color: blue;
  }
</style>

<div id="host">
  <div part="foo">
    slotted-in div
  </div>
</div>

<script>
const sheet = new CSSStyleSheet();
sheet.replaceSync('::part(foo) { background-color: red; }');
const host = document.getElementById("host");
let shadowRoot = host.attachShadow({mode: "open"});
shadowRoot.innerHTML = '<div part="foo">part in shadow</div><slot></slot>';
shadowRoot.adoptedStyleSheets = [sheet];  

</script>