microsoft / microsoft/BotFramework-WebChat
Scrolling behaviour together with the webchat/join - event: The Chatbot doesn't scroll correctly.
@compulim is already working on this.
Since Apr 19, 2021.
- Dominant language
- HTML
- Stars
- 1.8k
- Forks
- 1.6k
- Avg merge
- 22h 58m
- Merged PRs (30d)
- 2
Description
Screenshots
Version
latest (current version: 4.13.0)
Describe the bug
When using the welcome - event in combination with the autoScrollSnapOnActivity - option, the welcome message will not be seen completly.
Steps to reproduce
- create a backend which answers to the webchat/join event with a long message
- 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>
- open the chatbot in a small window
Expected behavior
The welcome - message should be seen completly. But the chatbot scrolls to the bottom of the message.
Additional context
Not 100% sure if this behaviour is intended or a bug. But I feel like this would be an intuitive addition to the scrolling - behaviour feature.
I have read the following information:
Due to the limitation of chat adapter, we recommend content author not to send initial activities (a.k.a. welcome messages) longer than a page.
But for us it's just not feasible to follow this recommendation.
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.