<ion-button @click="openVideo">TAKE VIDEO PLEASE</ion-button>
<input
  style="display:none"
  type="file"
  accept="video/mp4, video/x-m4v, video/*"
  capture
  @change="setVideo"
  id="open-camera"
/>

openVideo: function() {
  document.getElementById("open-camera").click();
},
setVideo: function(event) {
  const file = event.target.files[0];

  if (typeof FileReader === "function") {
    const reader = new FileReader();
    reader.onload = event => {
      console.log(event.target.result);

      let videoBlob = new Blob([event.target.result], {
        type: file.type
      });

      // vue composition api / hook
      this.uploadData(videoBlob, file.name);
    };
    reader.onerror = _error => {
      console.log(_error);
    };
    reader.readAsArrayBuffer(file);
  } else {
    alert("Sorry, FileReader API not supported");
  }
},

takeVideo: async function() {
  try {
    let options = { limit: 1, duration: 30, quality: 1 };
    let video = await MediaCapture.captureVideo(options);
    this.videoInfo = video[0];

    const blob = await fetch(
      Capacitor.convertFileSrc(this.videoInfo.fullPath)
    ).then(r => r.blob());
    console.log(blob);

    // the hook starts an upload when it gets a dataurl or blob
    this.uploadData(blob, this.videoInfo.name);
  } catch (error) {
    console.log("takeVideo", error);
  }
}