# Error about the size of a video for cv.read // openCV.js

**URL:** <https://forum.opencv.org/t/error-about-the-size-of-a-video-for-cv-read-opencv-js/13166>\
**Category:** Uncategorized\
**Tags:** opencvjs\
**Created:** [May 12, 2023, 12:07pm UTC](https://forum.opencv.org/t/error-about-the-size-of-a-video-for-cv-read-opencv-js/13166 "2023-05-12T12:07:07Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![TsuRuBa](https://avatars.discourse-cdn.com/v4/letter/t/9d8465/32.png) [@TsuRuBa](https://forum.opencv.org/u/TsuRuBa)\
**Post date:** [May 12, 2023, 12:07pm UTC](https://forum.opencv.org/t/error-about-the-size-of-a-video-for-cv-read-opencv-js/13166/1 "2023-05-12T12:07:07Z")

</div>

Hello there !

I’m trying to record a video from cam in browser, stop the recording, then to apply an Edge Detection Filter to the recorded video.  
Recording is done by a function working with WebRTC. This function provide me a blob `blobVideoColor` and an URL to this blob `URLvideoColor`.  
My issue is while treating the video.

Here is the code I’m working on :

```html
<video src="" id="videoTempTreatment"> </video>

```

```js
var matSrc = new cv.Mat(hauteur, largeur, cv.CV_8UC4);
var matDst = new cv.Mat(hauteur, largeur, cv.CV_8UC1);
var captur = new cv.VideoCapture(traitement);
//... Some code for recording, useless here.
function treatmentInit(){
    video = document.getElementById("videoTempTreatment");
    video.src = URLvideoColor; // Affecting blob to html <video>
    video.addEventListener("loadeddata", startTreatment); // Waiting for the blob to be into the <video>
}

function startTreatment(){
    //Initializing mat's and capture object
    const hauteur = video.videoHeight;
    const largeur = video.videoWidth;

    matSrc = new cv.Mat(hauteur, largeur, cv.CV_8UC4);
    matDst = new cv.Mat(hauteur, largeur, cv.CV_8UC1);
    captur = new cv.VideoCapture(video);

    let dooku = 1; // T'as compris la blague ?
    video.play();
    video.addEventListener("play", edgeVideo(dooku); // Just in case my issue was due to the video not playing ?
}

function edgeVideo(count){
    // Some verifications on sizes
    console.log("matSrc.cols*rows : %o * %o", matSrc.cols, matSrc.rows);
    console.log("video.width*height : %o*%o", video.videoHeight, video.videoWidth;
    //As expected, matSrc and video have same dimensions, not the issue origin.

    captur.read(matSrc);
    // treatment on frame, but read don't works properly...
}

```

My issue is with the `captur.read(matSrc);` line, at the end of the code I’m providing. There is an error :

> Uncaught Error: Bad size of input mat: the size should be same as the video.

There is why I verified the sizes of `video` and `matSrc` so it’s not the issue.  
I don’t think the issue come from my recorded video too, cause it’s played properly. but just to be sure, I modified my code to use a local video :  
The line

```js
    video.src = URLvideoColor; // Affecting blob to html <video>

```

was deleted in js, and I modified the html to add a local src :

```html
<video src="ressources/neige.webm" id="videoTempTreatment"> </video>

```

Once again, the video is playing properly, but I’ve the same error, except for one detail :

> Uncaught **(in promise)** Error: Bad size of input mat: the size should be same as the video.

Why is it talking about a promise ? according to datasheet, neither `cv.src()`nor `cv.VideoCapture(video)` are returning a promise… Maybe this answer about the promise with local video can help me with the recorded video.

“any clue will be apreciated”