Listen Laravel Websocket Events on React App

I have configured the server , for websockets its working properly , but i am unable to listen for events triggered by server on a separate react application

Do you use sanctum to communicate with your Laravel app?

Add this to your main.js in react app:

window.Echo = new Echo({
  broadcaster: 'pusher',
  key: 'Your key in .env file',
  wsHost: 'Your Laravel App IP',
  wsPort: 6001,
  wssport: 6001,
  transports: ['websocket'],
  enabledTransports: ['ws', 'wss'],
  forceTLS: false,
  disableStats: true
})

don't forget to install pusher-js and laravel-echo

the connection has been established with server successfully but i am unable to listen event

 window.Echo.channel('message').listen('NewMessage', (event) => {
               console.log(event);
            });

event is being triggered , i have confirmed on debugger and terminal , but i am unable to listen

Your backend app and your frontend app in the same domain ??

yes both are on same domain but in different directories , whenever the connection is successful with backend I get success message also, and channel is also subscribed (i am tracking in laravel websockets debugger panel),

but i am unable to listen it

@sarmadindhar Hello, please did you solve your problem, I had the same issue :/

@yacinsantos

I fixed it by changing channel name in listenere for example you have event NEW_MESSAGE broadcasting from laravel then in your client side insted of listening to NEW_MESSAGE event listen for ".NEW_MESSAGE" or add dot before event

ECHO.listen("NEW_MESSAGE") 
to 

ECHO.listen(".NEW_MESSAGE")

@sarmadindhar Thank you for your reply, it is working now .. but not in all browsers, it worked for me perfectly in Edge browser, but not in chrome and brave I keep getting this error "runtime.lasterror the message port closed before a response was received" any idea why ?