Video inside clip-path

Attempting to reproduce Flutter issue https://github.com/flutter/flutter/issues/80401

by David Iglesias

HTML

<div class="container">
  <div class="clip">
    <video controls
        src="https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4">
      Sorry, your browser doesn't support embedded videos.
    </video>
  </div>
</div>

<svg>
  <defs>
    <clipPath id="a">
      <circle cx="100" cy="100" r="100"></circle>
    </clipPath>
  </defs>
</svg>

CSS

html, body {
  background: #333;
}
video {
  width: 320px;
  height: 200px;
}
.clip {
    clip-path: url(#a);
    width: 200px;
    height: 200px;  
}