WebchatWidget icon indicating copy to clipboard operation
WebchatWidget copied to clipboard

Messages are getting duplicated on reconnect

Open Dujma opened this issue 1 year ago • 0 comments

When the connection is restored, messages are duplicated in the local storage.

To reproduce:

  1. Exchange some messages with the chatbot.
  2. Simulate network loss. For Chrome: Developer Tools -> Network -> Change from "No throttling" to "Offline"
  3. Wait for the connection to get lost.
  4. Change back to "No throttling".
  5. Now you have double the messages in the local storage.

This can cause the chatbot to completely break if you have enough of reconnects. Messages are going to be exponentially increased until the limit is reached and exception is going to be thrown in options-middleware.ts on setting the messages in the storage:

browserStorage.setItem(key, JSON.stringify({
  messages,
  rating
}));

I believe the issue is because of reducer.ts class that has a small typo:

export const reducer = (state = rootReducer(undefined, { type: '' }), action) => {
    switch (action.type) {
        case 'RESET_STATE': {
            // We only restore messages and prepend them to the current message history
            return rootReducer({
                ...state,
                messages: [
                    ...action.state.messages, // This I believe should be ...action.state.message (singular)
                    ...state.messages,
                ],
                rating: {
                    ...state.rating,
                    hasGivenRating: action.state.rating.hasGivenRating,
                }
            }, { type: '' })
        };
    };

    return rootReducer(state, action);
};

Dujma avatar Oct 25 '23 15:10 Dujma