scrollbar.html | Explore in Territory

<!DOCTYPE html>
<html><body>

<style>
#host {
    width: 200px;
    height: 100px;
    background-color: blue;
}

#host::-webkit-scrollbar {
   width: 50px;
}

</style>
<style id="shadow-style">
#div1 {
  position: fixed;
  overflow: scroll;
  width: 80px;
  height: 80px;
  background-color: red;
}

#div1::-webkit-scrollbar {
  width: 20px;
}
</style>

<div id="host"></div>


<script>
var shadowRoot = host.attachShadow({mode: 'open'});
shadowRoot.innerHTML = '<div id="div1">some long text showing scrollbar</div>';
shadowRoot.appendChild(document.querySelector('#shadow-style'));
</script>

</body></html>

chromium/third_party/blink/web_tests/fast/dom/shadow/scrollbar.html