The "stanza" event is not fired. But messege is sending

Below is code for react:

import React, {useEffect} from 'react'
import { BoshClient } from "xmpp-bosh-client/browser"; 
const dummyMessages = [
{
id: 'abcdef',
isSender: true,
message: 'Heelo'
},
{
id: 'bcdef',
isSender: false,
message: 'Hi'
}
]
const USERNAME = "test_user1@example.com";
const PASSWORD = "12345678";
const URL = "";
const client = new BoshClient(USERNAME, PASSWORD, URL);
const messege_box = document.querySelector('#msg-field');

client.on("error", (e) => {
    console.log("Error event");
    console.log(e);
    alert(e);
});
client.on("*", (e) => {
  console.log(e);
});
client.on("online", () => {
    console.log("Connected successfully");
    client.sendMessage('test_user2@example.com', 'this is test', 'chat')
});
client.on("ping", () => {
    console.log('Ping received at ${new Date()}');
});

client.on("stanza", (stanza) => {
    console.log('Stanza received at ${new Date()}');
    console.log('stanza', stanza);
    let messageObj = {
    isSender: false,
    message: 'message' //Chaqnge this
    }
    setMessages(prevValue => [...prevValue, messageObj])
    //his is incoming message
    //const [messages, setMessages] = React.useState([]);
    
});
client.on("offline", () => {
    console.log("Disconnected/Offline");
});
client.connect();

The problem is "stanza" event is not fired although the "online" event is fired and sucessfully connected and can send the message to the other client which is working fine, only issue is "stanza" event is not fired. Can any one shed some lights on it? Thank You in Advance.