Web RTC between two different web clients not working

Question

As per our web RTC requirements, there are two different client

1. Player (Players the screen shared by capture client)
2. Capture (Share Screen) The two web clients communicate and exchange offers and ICE candidates using WebSocket.

In Chrome [Version 84.0.4147.105 (Official Build) (64-bit)]

There is no error in the Player and Capture javascript console in chrome. But if we check chrome://webrtc-internals/ we can see the following event and transmission graph:

Player Capture

Here the I can see the video streaming is transmission but not playing in payer end and an ICE Candidate error in showing up int he events log. Is that is the problem the video stream is not working in the payer end?

Firefox (v79.0) Showing errors in the console:

DOMException: No remoteDescription.

In player.js line no: 33. Any Idea why two different browsers have different errors?

Player.js

(function(){
    var localVideo, remoteVideo, localConnection, remoteConnection;
    const MESSAGE_TYPE = {
        SDP: 'SDP',
        CANDIDATE_LOCAL: 'LOCAL_CANDIDATE',
        CANDIDATE_REMOTE: 'REMOTE_CANDIDATE'
    };
    const signaling = new WebSocket('ws://127.0.0.1:1337');
    var configuration = {
        offerToReceiveAudio: true,
        offerToReceiveVideo: true
    }
    remoteConnection = new RTCPeerConnection({configuration: configuration, iceServers: [{ urls: 'stun:aalimoshaver.com:3478' }]});
    remoteConnection.onicecandidate = function(e) { !e.candidate
        || signaling.send(JSON.stringify({message_type:MESSAGE_TYPE.CANDIDATE_REMOTE, content: e.candidate.toJSON()}));
        }
    remoteConnection.ontrack = function (e) {
        const remoteVideo = document.getElementById('remote-view');
        if (!remoteVideo.srcObject) {
            remoteVideo.srcObject = e.streams[0];
          }
        };
    signaling.onmessage = function (message){
        const data = JSON.parse(message.data);
        

        const message_type = data.message_type;
        const content = data.content;
        try {
            if (message_type === MESSAGE_TYPE.CANDIDATE_LOCAL && content) {
                remoteConnection.addIceCandidate(content)
                    .catch(function (e) {
                        console.error(e)
                    });
            }else if (message_type === MESSAGE_TYPE.SDP && content) {
                if (content.type === 'offer') {
                    remoteConnection.setRemoteDescription(content);
                    remoteConnection.createAnswer()
                    .then(function(answer){
                        remoteConnection.setLocalDescription(answer);
                        signaling.send(JSON.stringify({
                            message_type: MESSAGE_TYPE.SDP,
                            content: answer
                        }));    
                    });
                  } else {
                    console.log('Unsupported SDP type.');
                }
            }
        } catch (err) {
            console.error(err);
        }
    };
})()

Capture.js

/**
 * Created by Sowvik Roy on 30-07-2020.
 */

(function () {
    var localVideo, remoteVideo, localConnection, remoteConnection;
    const MESSAGE_TYPE = {
        SDP_LOCAL: 'SDP',
        CANDIDATE_LOCAL: 'LOCAL_CANDIDATE',
        CANDIDATE_REMOTE: 'REMOTE_CANDIDATE'
    };
    var configuration = {
        offerToReceiveAudio: true,
        offerToReceiveVideo: true
    };
  const signaling = new WebSocket('ws://127.0.0.1:1337');
    signaling.onmessage = function (message){
        const data = JSON.parse(message.data);
        
        const message_type = data.message_type;
        const content = data.content;
        try {
            if (message_type === MESSAGE_TYPE.CANDIDATE_REMOTE && content) {
                localConnection.addIceCandidate(content)
                    .catch(function (e) {
                        console.error(e)
                    });
            } else if (message_type === MESSAGE_TYPE.SDP_LOCAL) {
                if (content.type === 'answer') {
                    localConnection.setRemoteDescription(content);
                } else {
                    console.log('Unsupported SDP type.');
                }
            }
        } catch (err) {
            console.error(err);
        }
    };
    document.addEventListener('click', function (event) {
        if (event.target.id === 'start') {
            startChat();
            localVideo = document.getElementById('self-view');
            remoteVideo = document.getElementById('remote-view');
        }
    });

    function startConnection(){
        localConnection = new RTCPeerConnection({configuration: configuration, iceServers: [{ urls: 'stun:aalimoshaver.com:3478' }]});
        localConnection.onicecandidate = function (e) {
            !e.candidate
            || signaling.send(JSON.stringify({message_type:MESSAGE_TYPE.CANDIDATE_LOCAL, content: e.candidate.toJSON()}));
        };
        localConnection.createOffer()
        .then(function (offer) {
            if(offer){
                localConnection.setLocalDescription(offer);
                signaling.send(JSON.stringify({message_type:MESSAGE_TYPE.SDP_LOCAL, content: localConnection.localDescription}));
                if (navigator.getDisplayMedia) {
                    navigator.getDisplayMedia({video: true}).then(onCaptureSuccess);
                } else if (navigator.mediaDevices.getDisplayMedia) {
                    navigator.mediaDevices.getDisplayMedia({video: true}).then(onCaptureSuccess);
                } else {
                    navigator.mediaDevices.getUserMedia({video: {mediaSource: 'screen'}}).then(onCaptureSuccess);
                }
            }
            else{
                console.error("RTC offer is null");
            }
           
        })
        .catch(function (e) {
            console.error(e)
        });
    }

    function onCaptureSuccess(stream){
        localVideo.srcObject = stream;
        stream.getTracks().forEach(
            function (track) {
                localConnection.addTrack(
                    track,
                    stream
                );
            }
        );
    }

    function startChat() {
        if (navigator.getDisplayMedia) {
            navigator.getDisplayMedia({video: true}).then(onMediaSuccess);
        } else if (navigator.mediaDevices.getDisplayMedia) {
            navigator.mediaDevices.getDisplayMedia({video: true}).then(onMediaSuccess);
        } else {
            navigator.mediaDevices.getUserMedia({video: {mediaSource: 'screen'}}).then(onMediaSuccess);
        }
        
    }

    function onMediaSuccess(stream) {
        localVideo.srcObject = stream;
          // Set up the ICE candidates for the two peers
          localConnection = new RTCPeerConnection({configuration: configuration, iceServers: [{ urls: 'stun:stun.xten.com:19302' }]});
          localConnection.onicecandidate = function (e) {
              !e.candidate
              || signaling.send(JSON.stringify({message_type:MESSAGE_TYPE.CANDIDATE_LOCAL, content: e.candidate.toJSON()}));
          };
         
  
       
        stream.getTracks().forEach(
            function (track) {
                localConnection.addTrack(
                    track,
                    stream
                );
            }
        );
        localConnection.createOffer()
        .then(function (offer) {
            if(offer){
                localConnection.setLocalDescription(offer);
                signaling.send(JSON.stringify({message_type:MESSAGE_TYPE.SDP_LOCAL, content: localConnection.localDescription}));
            }
            else{
                console.error("RTC offer is null");
            }
           
        })
        .catch(function (e) {
            console.error(e)
        });
  
    }
})();

Can anybody explain or identify a loophole in the code? Please let me know if you need additional info.