Based on the logs you’ve shown the connection sequence doesn’t appear to be as it should be.
Most likely caused by having a lot of the logic handled within a component render function.
When the component decides to re-render it will essentially run all of that code again.
But just for reference the sequance should be in this order.
- The caller creates an offer and sets it as their local description.
- The caller sends the offer to the callee and they set their remote description as the offer.
- The callee creates an answer and sets it as their local description.
- The callee sends the answer over to the caller and that gets set as their remote description.
You should now have a connection between both clients.
What i didn’t include is that as soon as you start creating an offer you will have ice candidates to send and process on each side as they are delivered.
If you check over here i wrote a guide some while back which explains the processes.
Also have a look at this as it is important.