search

braze-inc / braze-web-sdk

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

[Bug]: Braze initialization fails #122

Closed ghost closed 2 years ago

ghost commented 2 years ago

Braze Web SDK Version

2.5

Integration Method

Google Tag Manager

Browser

Chrome, Firefox, Safari

Steps To Reproduce

  1. Initialize Braze
  2. Tries to call any method on global appboy
  3. Error is thrown

GTM Implementation:

window.appboyIsReady = window.appboy.initialize(BRAZE_KEY, {
  baseUrl: "https://sdk.fra-01.braze.eu/api/v3",
  minimumIntervalBetweenTriggerActionsInSeconds: 5,
  enableHtmlInAppMessages: true,
  doNotLoadFontAwesome: true,
});

var appboyInitRetries = 0;

function appboyInit() {
  try {
    window.appboy.openSession();
    window.appboyIsReady = true;
  } catch (e) {
    window.appboyIsReady = false;

    setTimeout(function () {
      appboyInitRetries++;
      if (appboyInitRetries < 10) {
        appboyInit();
      }
    }, 500);
  }

  if (window.appboyIsReady) {
    window.dispatchEvent(new Event("BrazeInitialized"));
  }
}

appboyInit();

Expected Behavior

Braze wouldn't throw an initialization error.

Actual Incorrect Behavior

Error is thrown now only for openSession, but anything called on global appboy even after waiting it to be ready. We've also tried to initialize appboy every time the errors had been caught but that didn't solve the issue either.

Verbose Logs

{
  "name": "Error",
  "message": "Appboy must be initialized before calling methods.",
  "fileName": "https://js.appboycdn.com/web-sdk/2.5/appboy.min.js",
  "lineNumber": 220,
  "stack": "e@https://js.appboycdn.com/web-sdk/2.5/appboy.min.js:220:244\ngd@https://js.appboycdn.com/web-sdk/2.5/appboy.min.js:231:163\nc@https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js:1:1192\nh@https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js:1:1489\nexitIntentAction@https://cdn.getyourguide.com/tf/assets/compiled/HomeDesktop-a3a000d7.js:1:107931\nmouseleave@https://cdn.getyourguide.com/tf/assets/compiled/HomeDesktop-a3a000d7.js:1:117898\nHt@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:11498\nn@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:13298\n1/</br/i._wrapper@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:45075\ni@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:290372\nEventListener.handleEvent*mr/</<@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:297075\nHe/</</<@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:261018\nbr@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:45101\nse@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:13577\n$r@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:45475\ny@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:54304\nl@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:53598\n1/</uo@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:57606\n1/</t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:34693\nt</enrichRenderUpdateFailureForSentry/t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:250971\nr@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65116\n1/</dn.prototype.get@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27016\ndn@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:26934\n1/</Cn.prototype.$mount/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65140\n1/</Cn.prototype.$mount@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65287\ninit@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:19763\n1/</l/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:53192\nl@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:53469\n1/</uo@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:57606\n1/</t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:34693\nt</enrichRenderUpdateFailureForSentry/t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:250971\nr@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65116\n1/</dn.prototype.get@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27016\ndn@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:26934\n1/</Cn.prototype.$mount/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65140\n1/</Cn.prototype.$mount@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65287\ninit@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:19763\n1/</l/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:53192\nl@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:53469\n1/</uo@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:57917\n1/</t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:34676\nt</enrichRenderUpdateFailureForSentry/t.prototype._update@https://cdn.getyourguide.com/tf/assets/compiled/app-90963379.js:1:250971\nr@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65116\n1/</dn.prototype.get@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27016\n1/</dn.prototype.run@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27903\nln@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:26007\n1/</ne/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12592\nZt@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:11989\npromise callback*Gt@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12080\nne@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12657\n1/</dn.prototype.update/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27831\n1/</dn.prototype.update@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27840\n1/</t.prototype.$forceUpdate@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:34904\nl@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:21552\n1/</Fe/d<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:21703\n1/</P/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:2606\npromise callback*1/</Fe/t<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:21812\nFe@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:22195\n1/</Ve/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:24332\nVe@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:24662\n1/</t.prototype._init/t._c@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:32747\n647/b<@https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js:1:6804\n1/</t.prototype._render@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:35638\nr@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:65126\n1/</dn.prototype.get@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27016\n1/</dn.prototype.run@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27903\nln@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:26007\n1/</ne/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12592\nZt@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:11989\npromise callback*Gt@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12080\nne@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:12657\n1/</dn.prototype.update/<@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27831\n1/</dn.prototype.update@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:27840\n1/</ft.prototype.notify@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:5033\nset@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:7547\n1/</vn/hn.set@https://cdn.getyourguide.com/tf/assets/compiled/vendors-framework-b1beabc3.js:1:28572\n647/mounted/<@https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js:1:5342\nrequestIdleCallback handler*mounted@https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js:1:5265\n"
}

Additional Information

The error is happening to few of our customers, which makes it seem it's not an application issue. There's was no changes related to Braze loading or initilization since it started on the 16th at noon.

davidbielik commented 2 years ago

Hi @joaomarcelofm-gyg the stack trace show you are calling some window.appboy method from within https://cdn.getyourguide.com/tf/assets/compiled/Home-beffc979.js before initialize has been called (as described by the error message).

Your script susceptible to a race condition where that Home-beffc979.js might run prior to Google Tag Manager running.

Also, I would recommend using our official Google Tag Manager templates: https://tagmanager.google.com/gallery/#/?filter=braze

Let me know if you have any additional detail to share, and we can re-open this.

ghost commented 2 years ago

@davidbielik, the error doesn't happen only once. Even after initialization by GTM, the error keeps on happening. It'd be strange if the error happened on Home-beffc979.js that it would keep on happening after initialization has been executed.

I sometimes see the following message, would this be related?

Appboy: Could not open indexedDB AppboyServiceWorkerAsyncStorage v5: undefined
davidbielik commented 2 years ago

@joaomarcelofm-gyg can you please open a support ticket by emailing support@braze.com?

We can dig into this, but will need more information like steps to reproduce, what website it's happening on, etc., and don't want to collect potentially private information in github.