navigator.clipboard.write() API doesn't work

<script type='text/javascript'>
function copy(text) {
  console.log(text)
  // This doesn't work.
  // Fails with NotAllowedError: Failed to execute 'write' on 'Clipboard': Invalid Blob types.
  // But ClipboardItem.supports('text/plain') returns true!
  window.navigator.clipboard.write(
    [
      new ClipboardItem(
        {
          ["text/plain"]: text
        }
      )
    ]
  )
}

function copytext(text) {
  // This works.
  navigator.clipboard.writeText(text)
}
</script>
<div onclick="copy('Text One')">Text One</div>
<div onclick="copy('Text Two')">Text Two</div>
<div onclick="copytext('Text writeText')">Text writeText</div>