Username entered in first instance prompt not showing up in the second chrome instance with SocketIO + NodeJS

I am a newbie to socket IO and to "Stack overflow" as well. I am in the process of making my first ever runtime chat application with SocketIO + NodeJS. After coding up the server and client, everything works perfectly as expected but as I create two chrome instances and prompt the user to enter his name, the first instance is showing up with the name entered in the second instance perfectly but simultaneously the second instance doesn't show up with the name entered in the first one. I have been searching and finding the solution to it on the internet for about two days but there's not much info regarding this. I would appreciate it if someone helps me in coming up with a solution to this.

Here's my code

Server.JS

 const io = require('socket.io')(8000, {
    cors: {
        origin: "*"
    }
});

const users = {};
io.on('connection', socket => {
    socket.on('newuserjoined', name=>{
        console.log('New User', name);
        users[socket.id] = name;
        socket.broadcast.emit('user-joined', name);
    })
    socket.on('sendmessage', message => {
        console.log(message);
        socket.broadcast.emit('chat-message', message);
    })
});

Client.JS

const socket = io('http://localhost:8000');
const messageform = document.getElementById('form');
const inmessage = document.getElementById('messageinput');
const messagecontainer = document.querySelector('.container');

socket.on('chat-message', data =>{
    console.log(data);
});

messageform.addEventListener('submit', e=>{
    e.preventDefault()
    const message = inmessage.value
    socket.emit('sendmessage', message)
    inmessage.value = ''
});


const append = (message, position)=>{
    const messageElement = document.createElement('div');
    messageElement.innerText = message;
    messageElement.classList.add('message');
    messageElement.classList.add(position);
    messagecontainer.append(messageElement);

}
const uname = prompt("Enter your name?");
append(`You joined`, 'right')
socket.emit('newuserjoined', uname)

socket.on('user-joined', uname=>{
    append(`${uname} joined the chat`, 'right');
})

Index.HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="chat.png">
    <title>Node Application using NodeJs and Socket IO</title>
    <script defer src= "http://localhost:8000/socket.io/socket.io.js"> </script>
    <script defer src= "JS/client.js"> </script>
</head>

<style>
    * {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
    }

    .logo {
        display: block;
        width: 100px;
        margin: auto;
    }

    body {
        background-color: #9e0000;
    }

    .container {
        border: 3px solid black;
        width: 55%;
        height: 80vh;
        margin: 0px auto;
        border-radius: 12px;
        background-color: #f7f7f7;
        overflow: auto;
    }

    .message, #messageinput {
        border: 2px solid black;
        padding: 12px;
        width: 48%;
        border-radius: 7px;
        margin: 8px 11px;
        background-color: burlywood;
    }

    .right {
        float: right;
        clear: both;
    }

    .left {
        float: left;
        clear: both;
    }

    #form {
        display: flex;
        justify-content: center;
        color: white;
    }

    .btn {
        padding: 0px 12px;
        border: 2px solid black;
        background: azure;
        margin: 12px 0px;
        border-radius: 5px;
        cursor: pointer;
    }

</style>

<body>

    <nav class="navbar">
        <img src="chat.png" class="logo">
    </nav>
    <div class="container">
        <!-- <div class="message right">Hey how are you?</div>
        <div class="message left">I am good, Thank you!</div> -->


    </div>

    <div class="Submit">
        <form id="form">
            <input type="text" id="messageinput">
            <button class="btn" type="submit">Send Now</button>
        </form>

    </div>

</body>

</html>