<!DOCTYPE html>
<style>
#scroller::-webkit-scrollbar {
    visibility: hidden;
}
</style>
Should show a green rectangle.
<div id=scroller style="overflow: scroll; width: 300px; height: 400px;">
  <div style="height: 200px"></div>
  <svg style="width: 600px; height: 600px;">
    <foreignObject x="100" y="100" width="100" height="100">
      <div id=target style="width: 100px; height: 50px; background: red"></div>
    </foreignObject>
  </svg>
</div>
<script>
function go() {
  scroller.scrollTo(0, 300);
  target.style.background = 'green';
}

onload = () => requestAnimationFrame(go);
</script>