braze-inc / braze-web-sdk

Public repo for the Braze Web SDK
https://www.braze.com
Other
73 stars 25 forks source link

Question: Tracking in-app message clicks/dismissals (v2.5.2) #84

Closed asherstoppard closed 4 years ago

asherstoppard commented 4 years ago

Good Afternoon,

We're looking to fire some external calls to GA when a user interacts with an in-app message. To do this we've been looking to implement the subscribeToClickedEvent and subscribeToDismissedEvent message events.

We've implemented the below example but we never receive a callback from the two events:

appboy.initialize(apiKey, { enableLogging })

appboy.subscribeToInAppMessage(message => {
  interceptInAppMessages(message)
  /**
   * Subscription guid's are created but callback's never receive data
   * when clicking or dismissing the modal
   */
  message.subscribeToDismissedEvent(handleDismissedEvent)
  message.subscribeToClickedEvent(handleClickedEvent)
  appboy.display.showInAppMessage(message)
});
appboy.subscribeToContentCardsUpdates(handleContentCards)

appboy.openSession()
appboy.changeUser(userId)
appboy.requestContentCardsRefresh()

Just wondering if we're missing any additional configuration?

Many thanks, Asher Stoppard.

wesleyorbin commented 4 years ago

Hi @asherstoppard! Thanks for reaching out. I am unable to reproduce locally. Can you try using the following code and checking your console for the logs?

appboy.subscribeToInAppMessage(message => {
  message.subscribeToDismissedEvent(() => console.log('dismissed'));
  message.subscribeToClickedEvent(() => console.log('clicked'));
  appboy.display.showInAppMessage(message);
});

Let me know if that works for you.

asherstoppard commented 4 years ago

Hi @wesleyorbin, thanks for getting back so quickly, really appreciate it.

So I've tried with console logs and get the following, hopefully it helps:

appboy.subscribeToInAppMessage(message => {
  interceptInAppMessages(message);

  const dismissGuid = message.subscribeToDismissedEvent(()=> console.log('dismissed')); // never hit
  const clickedGuid = message.subscribeToClickedEvent(()=> console.log('clicked')); // never hit

  console.log(dismissGuid) // "4b56d46c-449c-67ec-c7eb-5190e85338d6"
  console.log(clickedGuid) // "94f15b76-c3b8-697e-2871-a2fec7815e58"
  console.log('subscribed'); // "subscribed"
  appboy.display.showInAppMessage(message);
});

Is there anything required in the in-app message configuration for this to work? It's such a simple integration I can't think of anything else that could be causing an issue.

Many thanks, Asher Stoppard.

wesleyorbin commented 4 years ago

Hi @asherstoppard! Can you try one more time after removing the interceptInAppMessages function? Just want to be sure that it's not interfering with the click/dismiss subscriptions somehow. You shouldn't need any setup to get this code to work.

froodian commented 4 years ago

One thing to test might be that you are actually clicking or dismissing the message itself - note that if your in-app messages have buttons, button clicks signal through their button objects (message.buttons[0].subscribeToClickedEvent, message.buttons[1].subscribeToClickedEvent), and the clicked event you're currently subscribing to is invoked only for clicks on buttonless messages.

Another sidenote for code defensiveness and analytics accuracy is that subscribeToInAppMessage may also be invoked with control messages which don't have the full interface that InAppMessage does, and should simply be passed to showInAppMessage to log their enrollment. e.g.

appboy.subscribeToInAppMessage(message => {
  if (message instanceof appboy.ab.InAppMessage) {
    const dismissGuid = message.subscribeToDismissedEvent(()=> console.log('dismissed')); // never hit
    const clickedGuid = message.subscribeToClickedEvent(()=> console.log('clicked')); // never hit
    console.log(dismissGuid) // "4b56d46c-449c-67ec-c7eb-5190e85338d6"
    console.log(clickedGuid) // "94f15b76-c3b8-697e-2871-a2fec7815e58"
    console.log('subscribed'); // "subscribed"
  }
  appboy.display.showInAppMessage(message);
});
asherstoppard commented 4 years ago

@wesleyorbin @froodian Apologies on the delay getting back to you!

You were absolutely right, I missed the documentation for button click event subscriptions :+1: It's all working correctly now. Really appreciate the help.

I've also made the appropriate changes to subscribeToInAppMessage.

Thanks again 🙂