Async WebRTC event order

by jib1

HTML

<script src="https://webrtchacks.github.io/adapter/adapter-latest.js"></script>
<video id="video1" width="160" height="120" autoplay muted></video>
<video id="video2" width="160" height="120" autoplay></video><br>
<div id="div"></div>

JavaScript

const console = { log: msg => div.innerHTML += msg + "<br>" };
const wait = ms => new Promise(resolve => setTimeout(resolve, ms));

const config = {iceCandidatePoolSize: 5};
const pc1 = new RTCPeerConnection(config), pc2 = new RTCPeerConnection(config);

(async () => {
  try {
    await wait(2000);
    const stream = await navigator.mediaDevices.getUserMedia({video: true, audio: true});
    for (const track of stream.getTracks()) {
      pc1.addTrack(track, stream);
    }
    video1.srcObject = stream;
    await pc1.setLocalDescription(await pc1.createOffer());
    console.log("SLD(offer) success");
    await pc2.setRemoteDescription(pc1.localDescription);
    await pc2.setLocalDescription(await pc2.createAnswer());
    console.log("SLD(answer) success");
    await pc1.setRemoteDescription(pc2.localDescription);
  } catch (e) {
    console.log(e);
  }
})();

pc1.onicecandidate = e => console.log(`pc1 candidate`);
pc2.onicecandidate = e => console.log(`pc2 candidate`);
pc2.ontrack = e => video2.srcObject = e.streams[0];