Socket.io's "on" handler doesn't fire in middleware in redux-toolkit

Question

I've wrote a middleware to store websoket connection in my redux-toolkit.

And socket.on('disconnect') event does not fire even if I call socket.disconnect(), but disconnect happens. Code of middleware:

export const socketMiddleware: Middleware = store => {
    
    let socket: Socket;
    
    return next => action => {
        const
            state = store.getState(),
            socketActions = socketSlice.actions;

        const isConnectionEstablished = socket && state.socketReducer.isConnected;
   
        if (socketActions.startConnection.match(action)) {
            socket = io(WS_URL, {
                path: '/chat/socket.io',
                transports: ['websocket', 'polling'],
                reconnection: true,
                autoConnect: true,
                extraHeaders: {
                    Authorization: `Bearer ${action.payload}`,
                },
            });           

            socket.on('connect', () => {
                console.log('connected');
                store.dispatch(socketActions.connectionSuccess());
            })
    
            socket.on('connect_error', err => {
                console.log(`connect_error`);
                store.dispatch(socketActions.connectionFail());
            });
    
            socket.on('disconnect', () => {
                console.log(`disconnected!`);
                store.dispatch(socketActions.disconnectionSuccess());
            });
        }

        if (socketActions.startDisconnection.match(action) && isConnectionEstablished) {
            // socket.disconnected === false
            socket.disconnect();
            // socket.disconnected === true
        }
   
        return next(action);
    }
}