# Stop Sharing Button from Browser Didn't Work Properly

**URL:** <https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997>\
**Category:** Off Topic\
**Created:** [February 27, 2023, 11:18am UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997 "2023-02-27T11:18:08Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![YohanesA3094](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/yohanesa3094/32/2021_2.png) [@YohanesA3094](https://mediasoup.discourse.group/u/YohanesA3094)\
**Post date:** [February 27, 2023, 11:18am UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/1 "2023-02-27T11:18:08Z")

</div>

Hello, I’m new to this form, sorry if I at the wrong section. I try create some sharing screen function on my conference apps. There is a case that I don’t know why it didn’t work properly.

![image](https://global.discourse-cdn.com/free1/uploads/mediasoup/original/2X/1/14f51da11cfc58da646de44d9da8bd3dda183aae.png)  
When I start sharing screen for the first time and stop it using “Stop Sharing” button from browser (in this case chrome like the image above) when I try to check the producer list, it didn’t find any producer so it failed send message to any member of the conference to close the consumer. the screen share on the producer side ended but on consumer side it still running but with frozen state.

![image](https://global.discourse-cdn.com/free1/uploads/mediasoup/original/2X/8/8a750ce713d6f9521684c4b826bb14b0ec6c91db.png)  
But when I try to stop with button from the site, and then I try to share screen again and stop it again but using the button from browser. it work properly (producer found and it trigger close-consumer to everyone in the conference.)

---

<div class="post-metadata">

**Author:** ![zaidiqbal](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/zaidiqbal/32/1498_2.png) [@zaidiqbal](https://mediasoup.discourse.group/u/zaidiqbal)\
**Post date:** [February 27, 2023, 11:39am UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/2 "2023-02-27T11:39:50Z")

</div>

You may be missing updating producer list first time causing the issue. Does the issue appear when you share screen first time and stop it from your custom button?

When you say producer list you mean producer list on server on client side?

---

<div class="post-metadata">

**Author:** ![YohanesA3094](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/yohanesa3094/32/2021_2.png) [@YohanesA3094](https://mediasoup.discourse.group/u/YohanesA3094)\
**Post date:** [February 27, 2023, 12:06pm UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/3 "2023-02-27T12:06:15Z")

</div>

If I share screen first time and using stop sharing from my custom button it work properly. and after that the button from chrome will work properly too when I share screen on the same session.

producer from client side. if it found the producer it will emit close-producer to server and the server will close its producer. but because no producer on client side is found (with the error case) it will not emit close-producer to server

---

<div class="post-metadata">

**Author:** ![zaidiqbal](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/zaidiqbal/32/1498_2.png) [@zaidiqbal](https://mediasoup.discourse.group/u/zaidiqbal)\
**Post date:** [February 27, 2023, 3:36pm UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/4 "2023-02-27T15:36:46Z")

</div>

Then you need to check the logic you have implemented to close producer when you stop sharing from chrome’s default button. Show some snippets here to have a better look. If you are saving the producer to some variable when screen is shared then it should be available on stop share screen.

You may be removing producer variable on stream being stopped, so when you stop share screen from chrome’s button then chrome stops the screen stream automatically and if you reset the producer variable at the stream stopped event then surely it will not be available for next part of your code causing the issue. Check if that is the case.

---

<div class="post-metadata">

**Author:** ![YohanesA3094](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/yohanesa3094/32/2021_2.png) [@YohanesA3094](https://mediasoup.discourse.group/u/YohanesA3094)\
**Post date:** [February 28, 2023, 1:04am UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/5 "2023-02-28T01:04:09Z")

</div>

I think no issue on the logic. here some snippets for custom button and onended event on MediaStreamTrack

Custom Button

```auto
<button onclick={handleStopSharing}>Stop Sharing</button>

const handleStopSharing = (event) => {
    stopSharingScreen();
    event.preventDefault();
}

```

MediaStreamTrack

```auto
screenShareStream.current.getVideoTracks()[0].onended = function () {
    console.log("track ended");
    stopSharingScreen();
};

```

and this is what inside stopSharingScreen():

```auto
const stopSharingScreen = () =>{

    const screenShareProducer = myProducers.find(p => p.rtpParameters.codecs.findIndex(codec => codec.mimeType.toLowerCase() === "video/vp8") !== -1);
    console.log("producer", screenShareProducer);
    ....
}

```

the problem is when the conference just created and do screenshare, if the screenshare stopped by ended event the producer is not found.  
console output:  
 ![image](https://global.discourse-cdn.com/free1/uploads/mediasoup/original/2X/8/871147a7be36f624f049b6c3e831e33884e2f138.png)

but when it stopped by custom button it works and then when do screenshare again in the same conference somehow the ended event can find the producer  
console output:  
 ![image](https://global.discourse-cdn.com/free1/uploads/mediasoup/original/2X/b/b5f845d13e2d1aa88b26c10ffdaeea3a7e6a504f.png)

---

<div class="post-metadata">

**Author:** ![zaidiqbal](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/zaidiqbal/32/1498_2.png) [@zaidiqbal](https://mediasoup.discourse.group/u/zaidiqbal)\
**Post date:** [February 28, 2023, 6:32am UTC](https://mediasoup.discourse.group/t/stop-sharing-button-from-browser-didnt-work-properly/4997/6 "2023-02-28T06:32:22Z")

</div>

You need to console log myProducers along with screenShareProducer to get to the bottom of it.

> [@YohanesA3094](#):
>
> `const screenShareProducer = myProducers.find(p => p.rtpParameters.codecs.findIndex(codec => codec.mimeType.toLowerCase() === "video/vp8") !== -1);`

This is not right way to find the producer. You are comparing codecs, how will you differentiate b/w camera stream, screen stream? This will cause many problems for you.

The right way to find the producer is that you save share\_screen\_producer in separate variable and on stopShareScreen get producer form that variable and proceed with your logic. There can be many other ways.