empiezo a programar un chat pero siempre me sale este error:

Error de referencia no capturado: el nombre de usuario no está definido

Pero definí const nombre de usuario = usuario.displayName;

esta es una parte de mi código:

 function authStateListener() { firebase.auth().onAuthStateChanged((user) => { if (user) { const username = user.displayName; } else { window.location.href = "../pages/login.html"; } }); };

y ahi esta el error:

 fetchChat.on("child_added", function (snapshot) { const messages = snapshot.val(); const now = (new Date().toLocaleDateString()).split("."); const t = (messages.date).split("."); if( t[0] < now[0]) { const message = `<li class=${username === messages.username ? "sent" : "receive"}><span class="name">${messages.username} </span><br>${messages.message}<br><span class="time">${t[0] - now[0]} Days ago</span></li>`; addMsg(message); } else { const message = `<li class=${username === messages.username ? "sent" : "receive"}><span class="name">${messages.username} </span><br>${messages.message}<br><span class="time">${messages.time}</span></li>`; addMsg(message); } //const message = `<li class=${username === messages.username ? "sent" : "receive"}></span>${messages.message}</li>`; });

Espero que puedas ayudarme