Video tag is only working with iFrame. it's not working with <video> tag in reactjs and also It's not supported some extension like .mov

[akansha-simform]

When uploading videos from my computer, I'm limited to .mp4 files and the "video" type. If I try to upload .mov or other video file extensions, they're not uploaded but instead downloaded directly.

To address this issue, I need to use a

I've implemented this customVideoBlot code:

import Quill from 'quill';
const BlockEmbed = Quill.import('blots/block/embed');

class VideoBlot extends BlockEmbed {
  static blotName = 'video';
  static tagName = 'video';  // Use video tag

static create(url) {
    let node = super.create();
    node.setAttribute('src', url);   // Set video source
    node.setAttribute('controls', true);  // Add controls to video
    node.setAttribute('width', '100%');  // You can set default width/height if needed
    node.setAttribute('height', 'auto');
    return node;
  }

static formats(node) {
    let format = {};
    if (node.hasAttribute('height')) {
      format.height = node.getAttribute('height');
    }
    if (node.hasAttribute('width')) {
      format.width = node.getAttribute('width');
    }
    return format;
  }

static value(node) {
    return node.getAttribute('src');
  }

format(name, value) {
    if (name === 'height' || name === 'width') {
      if (value) {
        this.domNode.setAttribute(name, value);
      } else {
        this.domNode.removeAttribute(name);
      }
    } else {
      super.format(name, value);
    }
  }
}

Quill.register(VideoBlot);