Web Chat events summary
bot-framework web-chat

List of Web Chat event types with respective payloads
July 1, 2019

Simple cheat sheet which might come handy when you start working with the (very cool) back channel in Bot Framework's Web Chat component.

WEB_CHAT

Event Payload
WEB_CHAT/MARK_ACTIVITY { activityID, name, value }
WEB_CHAT/SEND_EVENT { (string) name, (string) value }
WEB_CHAT/SEND_MESSAGE { (string) method, (string) text }
WEB_CHAT/SET_LANGUAGE { language }
WEB_CHAT/SET_REFERENCE_GRAMMAR_ID { referenceGrammarID }
WEB_CHAT/SET_SEND_BOX { (string) text }
WEB_CHAT/SET_SEND_TIMEOUT { sendTimeout }
WEB_CHAT/SET_SEND_TYPING_INDICATOR { (bool) sendTypingIndicator }
WEB_CHAT/SET_SUGGESTED_ACTIONS { (array, default: []) suggestedActions }
WEB_CHAT/START_SPEAKING N/A
WEB_CHAT/STOP_DICTATE N/A
WEB_CHAT/STOP_SPEAKING N/A
WEB_CHAT/SUBMIT_SEND_BOX { (string, default: 'keyboard') method }

How to send

This example sends new event with custom name when Direct Line connection is established:

const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
   if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
     dispatch({
       type: 'WEB_CHAT/SEND_EVENT',
       payload: {
         name: 'webchat/join',
         value: { myvalue: "test" }
       }
     });
   }
   return next(action);
});

DIRECT_LINE

Event
DIRECT_LINE/CONNECT
DIRECT_LINE/CONNECT_FULFILLED
DIRECT_LINE/CONNECT_FULFILLING
DIRECT_LINE/CONNECT_PENDING
DIRECT_LINE/CONNECTION_STATUS_UPDATE
DIRECT_LINE/DELETE_ACTIVITY
DIRECT_LINE/DISCONNECT
DIRECT_LINE/DISCONNECT_FULFILLED
DIRECT_LINE/DISCONNECT_PENDING
DIRECT_LINE/DISCONNECT_REJECTED
DIRECT_LINE/INCOMING_ACTIVITY
DIRECT_LINE/POST_ACTIVITY
DIRECT_LINE/POST_ACTIVITY_FULFILLED
DIRECT_LINE/POST_ACTIVITY_PENDING
DIRECT_LINE/POST_ACTIVITY_REJECTED
DIRECT_LINE/UPDATE_CONNECTION_STATUS

How to handle

This example hooks into any incoming activity and does nothing with it :)

const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
   if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
     // do whatever...
   }
   return next(action);
});

Feedback

Found something inaccurate or plain wrong? Was this content helpful to you? Let me know!

šŸ“§ codez@deedx.cz