All topics are getting same id when subscribeHeaders is not passed in props to SockJsClient

[akzarma]

This is the strange behaviour I encountered while subscribing to multiple topics.

These are the topics passed:

0: "/topic/settings/update"
1: "/queue/9999999999/notifications"

<SockJsClient
        url={apiUrl}
        topics={this.props.topics}
        onMessage={this.onMessage}
        ref={(client) => { this.clientRef = client; }}
        debug
 />

(Notice that I didn't pass subscribeHeaders first)

I kept some breakpoints to debug in react-stomp/dist/client.js and stompjs/lib/stomp.js to see what ids get assigned to those subscriptions.

This (Above image) is the first call in react-stomp/dist/client.js for the first topic. we can see subscribeHeaders in this.props is nothing but a blank object.

This (Above image) is the first call of subscribe function in stompjs/lib/stomp.js and we get blank object as headers argument.

This (Above image) is the second call in react-stomp/dist/client.js for the second topic (Notice that, this time we get subscribeHeaders out of nowhere)

This (Above image) is the second call of subscribe fn in stompjs/lib/stomp.js for the second topic: (Now, we have headers in parameters so we the second "if" condition will be false hence, giving the same id to te second topic also)

This whole strange problem can be solved by passing "subscribeHeaders={null}" and then each topic starts getting different ids (i.e. "sub-0", "sub-1")

<SockJsClient
        url={apiUrl}
        subscribeHeaders={null} //only works when passed "null". Doesn't work if passed blank object "{}"
        topics={this.props.topics}
        onMessage={this.onMessage}
        ref={(client) => { this.clientRef = client; }}
        debug
 />

[oral0717]

Thank you for share. But 'subscribeHeader={null}' should be 'subscribeHeaders={null}' in the last code.