microsoft / BotFramework-WebChat

A highly-customizable web-based client for Azure Bot Services.
https://www.botframework.com/
MIT License
1.6k stars 1.54k forks source link

Custom events are showing in wrong order #4793

Open stevkan opened 1 year ago

stevkan commented 1 year ago

Is it an issue related to Adaptive Cards?

No

Is this an accessibility issue?

No

What version of Web Chat are you using?

Latest production

Which distribution are you using Web Chat from?

NPM

Which hosting environment does this issue primarily affect?

Web apps

Which browsers and platforms do the issue happened?

Browser: Edge (latest), Browser: Chrome (latest)

Which area does this issue affect?

Chat history

What is the public URL for the website?

No response

Please describe the bug

(Refer to IcM #342603662 for full issue details.)

The scenario is a user is communicating with the bot, then elects to transfer (handoff) the conversation to a Salesforce agent. Once the handoff to the agent succeeds, an 'End Chat' button appears at the bottom of the transcript window giving the user the option to end the conversation at any point. It is a custom event, 'SHOW_CLOSE_CHAT_BUTTON', that is issued that causes the 'End Chat' button to appear.

Once the user clicks the 'End Chat' button, a second custom event, 'HIDE_CLOSE_CHAT_BUTTON', is issued which then causes the 'End Chat' button to be hidden. At this point, the conversation with the agent has concluded and the conversation with the bot has resumed. Additionally, the order of the issued events shows as:

1) 'SHOW_CLOSE_CHAT_BUTTON' 2) 'HIDE_CLOSE_CHAT_BUTTON'

If the user, then, refreshes the page, the order of the issued events reverses showing as:

1) 'HIDE_CLOSE_CHAT_BUTTON' 2) 'SHOW_CLOSE_CHAT_BUTTON'

The result being that the 'End Chat' button is once more visible. As the customer states,

the chat conversation is loading but the event fired are fetching in reverse order due to which the close event is firing first and show event is firing second.

Ram and I cannot attempt a repro using Salesforce since it requires having an account. However, using the customer's code we were not able to repro in any other environment. The order was always maintained. We tested with different versions of Web Chat as well as different versions of Composer.

Customer's bot and Web Chat code, as well as a video repro'ing the issue, are available in the IcM.

Do you see any errors in console log?

None shown while testing.

How to reproduce the issue?

Unable to repro as it requires a Salesforce account.

What do you expect?

When the page is refreshed, the order of the events should be maintained so that the state of the UI elements is also maintained.

What actually happened?

When the page is refreshed, the order of the events is not being maintained, but rather reversed in order. Consequently, the state of the affected UI elements is not being maintained.

Do you have any screenshots or recordings to repro the issue?

A video from the customer is available in the above referenced IcM.

Adaptive Card JSON

No response

Additional context

Customer stated they implemented the below as a workaround:

Regarding the workaround we have tried to count the number of events count by using state hooks and based on it we are handling to show end chat button or not. If show button event is triggered count is 1 and hide button event button is 1 then we are hiding the End Chat Button ,if the Show event count> hide event count then we are enabling the End Chat Button and vice-versa .

compulim commented 9 months ago

After some investigations:

Thus, when the chat history is being restored, the "show button" event is delayed waiting for the non-existing activity. And the "hide button" event is being presented sooner than the "show button" event.

On the bot side, needs to investigate why the replyToId on the "show button" event is pointing nowhere.