[🐛] MessageList is not updated even though messages received over WS

[Jolville]

Issue

New messages (sometimes) aren't being rendered after reconnection events. We've looked into this on our side a fair bit and added some logging to check this wasn't a connection issue, and we can see connection:onmessage() - onmessage callback logs, but the message list component doesn't show them.

Steps to reproduce

Steps to reproduce the behavior:

This doesn't happen consistently, but we were able to reproduce by

1. Creating a channel with two members
2. Opening the channel on two devices
3. Turning off mobile data on device A
4. Sending some messages from device B
5. Turning mobile data on device A back on, while simultaneously sending a message from device B.
6. Send more messages from device B

Occasionally, the messages sent from device B while device A was offline, as well as after it was back online, are never shown, until the component is unmounted/remounted by closing the screen.

Expected behavior

Messages should be shown.

Project Related Information

Customization

Click To Expand

No custom components, but here is how we're rendering the channel:

<Chat client={client}>
  <Channel<StreamType>
    channel={channel}
    allowThreadMessagesInChannel={false}
    deletedMessagesVisibilityType="never"
    keyboardVerticalOffset={headerHeight}
    thread={thread}
    hasCommands={false}
    threadList={isInThreadView}
    messageActions={({ quotedReply }) => [quotedReply]}
    MessageFooter={MessageFooter}
    myMessageTheme={{
      colors: {
        grey_gainsboro: Colors.primary[500],
        black: Colors.secondary.lime[100],
      },
      overlay: {
        messageActions: {
          actionContainer: {
            backgroundColor: Colors.neutral[900],
            borderRadius: 16,
          },
        },
        reactionsList: {
          reactionList: {
            backgroundColor: Colors.neutral[900],
          },
        },
      },
      messageSimple: {
        card: {
          footer: {
            title: {
              color: Colors.primary[500],
            },
            description: {
              color: Colors.primary[500],
            },
          },
        },
        content: {
          containerInner: {
            borderColor: Colors.primary[500],
          },
          markdown: {
            text: {
              fontSize: FontSize.PARAGRAPH_S,
              fontFamily: FontFamily.ATLAS_GROTESK_LIGHT,
            },
            listItemBullet: {
              color: Colors.secondary.lime[100],
            },
            listItemNumber: {
              color: Colors.secondary.lime[100],
            },
          },
        },
      },
    }}
  >
    {isInThreadView ? (
      <Thread />
    ) : (
      <>
        <MessageList onThreadSelect={setThread} hideStickyDateHeader />
        <MessageInput
          giphyActive={false}
          additionalTextInputProps={{
            selectionColor: Colors.primary[300],
          }}
        />
      </>
    )}
  </Channel>
</Chat>

Offline support

• [ ] I have enabled offline support.
• [ ] The feature I'm having does not occur when offline support is disabled. (stripe out if not applicable)

Environment

Click To Expand

package.json:

{
	"react-native": "0.71.14",
    "stream-chat": "~8.13.1",
    "stream-chat-expo": "^5.19.3",
    "stream-chat-react-native-core": "^5.19.3"
}

react-native info output:

 OUTPUT GOES HERE

• Platform that you're experiencing the issue on:
  • [ ] iOS
  • [ ] Android
  • [ ] iOS but have not tested behavior on Android
  • [ ] Android but have not tested behavior on iOS
  • [x] Both
• stream-chat-react-native version you're using that has this issue:
  • [email protected]
• Device/Emulator info:
  • [x] I am using a physical device
  • iOS/17.0.2

Additional context

We're also seeing some connection:_errorFromWSEvent() - WS failed with code 1006/connection:_errorFromWSEvent() - WS failed with code undefined logs from our customers around the same time they were reporting this issue (the connection does seem to re-establish fine though)

Screenshots

N./A

---

[khushal87]

Hey @Jolville, is this working fine now?

[Jolville]

@khushal87 sorry this was closed automatically after I referenced it in a PR in a private repo.

I've just bumped our stream package in the hopes that its fixed by https://github.com/GetStream/stream-chat-react-native/pull/2479 - will give it a test and get back to you

[khushal87]

Yes, please give it a look and let us know. Thanks 😄

[khushal87]

Hey @Jolville, can this be closed?

[abulnes-designli]

Hi, I'm using version ^5.27.1,, and the problem is still appearing; the messages are shown after I click on the go-to last message button.