Correctly stopping the stream

[Tseberechts]

I noticed the stream didn't really stop on unmount. According to https://stackoverflow.com/a/12436772 every track should be stopped individually.

[rico345100]

Thanks for PR!

However did you tested the stream didn't stopped?

Because I already did same thing in very top of the code:

// stop hack
// from http://stackoverflow.com/questions/11642926/stop-close-webcam-which-is-opened-by-navigator-getusermedia
var MediaStream = window.MediaStream || window.webkitMediaStream;;
if (typeof MediaStream !== 'undefined' && !('stop' in MediaStream.prototype)) {
    MediaStream.prototype.stop = function() {
        this.getAudioTracks().forEach(function(track) {
            track.stop();
        });

        this.getVideoTracks().forEach(function(track) {
            track.stop();
        });
    };
}

I was tested this in Chrome and FF, and it was worked. Let me know if it doesn't work!

[Tseberechts]

Hello,

I saw in chrome when I unmounted that the red dot in the tab didn’t go away, eg. the stream didn’t stop. now, after adding the line, it properly goes away , eg. the stream stopped.

Greets, Thomas

Thomas Seberechts Full Stack Javascript Gladiator +32 479 98 23 85 <tel:+32479982385> - thomas@codious.io mailto:thomas@codious.io [cid:3A895D0D-784A-4F37-BF13-1954591B9533]

Codious BVBA Corda Campus Hal A, Unit 027.1 Kempische Steenweg 303/20 3500 Hasselt, Belgium www.codious.io https://codious.io/

On 19 October 2018 at 13:34:51, .modernator (notifications@github.commailto:notifications@github.com) wrote:

Thanks for PR!

However did you tested the stream didn't stopped?

Because I already did same thing in very top of the code:

// stop hack // from http://stackoverflow.com/questions/11642926/stop-close-webcam-which-is-opened-by-navigator-getusermedia var MediaStream = window.MediaStream || window.webkitMediaStream;; if (typeof MediaStream !== 'undefined' && !('stop' in MediaStream.prototype)) { MediaStream.prototype.stop = function() { this.getAudioTracks().forEach(function(track) { track.stop(); });

    this.getVideoTracks().forEach(function(track) {
        track.stop();
    });
};

}

I was tested this in Chrome and FF, and it was worked. Let me know if it doesn't work!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/rico345100/react-multimedia-capture/pull/9#issuecomment-431333910, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ARlnRY5lrJg_a21PRRbWcUOcO2CJmJqEks5umbjYgaJpZM4XwK6y.

[rico345100]

Alright, thanks for testing!

Maybe I should check the issue myself.

However your solution looks great, but I think it's better to place your code inside of MediaStream.prototype.stop, not inside of componentWillUnmount. What do you think?

I'll check the issue as fast as possible, because I'm in the outside right now.

Thank you for improve this module!

Cheers!

[Tseberechts]

I'm always a little hesitant to alter a prototype. We could, however create a closeStream function where we do all the closing steps and call that one in componentWillUnmount.

[rico345100]

Alright, PB merged! Thanks for contribute! I will update NPM module as soon as possible!

[rico345100]

Well, I found another issue after merge this PR. After stop the recording, means invoking stop of each track, now I can't record anymore.

Luckily, I found the solution and try to fix this.

[rico345100]

ReactMultiMediaCapture@1.2.2 released! Now developer can ask permission manually by using "request" function prop from render method!

This can be use when user accidently pressed "denied" button, or re-access after stop the recording.

[Tseberechts]

Cool!