microsoft / microsoft/BotFramework-WebChat

scrollToBottom - Button appears only sometimes

Open
#3,862 1 comment 1 reaction 1 assignee View on GitHub

@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

scroll - to - bottom button

Version

Latest (4.13.0)

Describe the bug

The scroll to bottom - button seems to work only sometimes.

Steps to reproduce

  1. create a Dialog in the backend, which sends multiple long messages one after another
  2. 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>
  1. 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

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.