microsoft / microsoft/BotFramework-WebChat
scrollToBottom - Button appears only sometimes
Open
@compulim is already working on this.
Since Apr 26, 2021.
backlog
Bot Services
bug
customer-replied-to
customer-reported
ExemptFromDailyDRIReport
front-burner
needs-scope
- Dominant language
- HTML
- Stars
- 1.8k
- Forks
- 1.6k
- Avg merge
- 22h 58m
- Merged PRs (30d)
- 2
Description
Screenshots

Version
Latest (4.13.0)
Describe the bug
The scroll to bottom - button seems to work only sometimes.
Steps to reproduce
- create a Dialog in the backend, which sends multiple long messages one after another
- use this frontend - example (with your token):
<!DOCTYPE html>
<html>
<head>
<script crossorigin="anonymous" src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<style>
html,
body {
height: 100%;
}
body {
margin: 0;
}
#webchat {
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="webchat" role="main"></div>
<script>
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: { language: window.navigator.language }
}
});
}
return next(action);
});
window.WebChat.renderWebChat(
{
directLine: window.WebChat.createDirectLine({
token: 'INSERT_TOKEN_HERE'
}),
userID: 'YOUR_USER_ID',
username: 'Web Chat User',
locale: 'de-de',
store,
styleOptions: {
bubbleBackground: 'rgba(0, 255, 255, .1)',
autoScrollSnapOnActivity: true,
}
},
document.getElementById('webchat')
);
</script>
</body>
</html>
- Start the dialog, which was created in step one multiple times.
Expected behavior
The scroll - to bottom - button should appear always when the dialog is started.
Additional context
For me it looks like a race condition. Maybe the button only appears when the message is sent after a specific time?
[Bug]
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.