To first provide a bit of background on the process behind delivering web in-app notifications:
When a user triggers the people method that sends an update to Mixpanel's backend, once the update has been ingested and added to a user's profile, the profile is then added to the list of target profiles for the in-app campaign. From there, the notification is effectively "queued-up" while active, and the delivery itself is triggered by the user arriving on the site and triggering a mixpanel.identify() call.
By default, in-app messages can accommodate a delivery upon the loading of a page (there's no issue with calling .identify() upon say, any pageload within an authenticated session alongside the mixpanel.init() call).
With the above in mind, it's not deterministically possible to trigger an in-app notification to be delivered and displayed as soon as a user performs an action (or fails to) as a function (or independent) of time that results in them meeting a targeting criteria. As described above, there is a decent amount of communication between the user's device and Mixpanel that must occur before a campaign is prepared for the respective user to be delivered, and before you can call identify() to check and pull campaigns from our undocumented /decide API.
To get around this issue, Mixpanel recommends placing a 3-second (or more) timeout using setTimeout() in your code to invoke a second mixpanel.identify() allows a sufficient amount of time for the update to be delivered and processed so that /decide will have the campaign ready to be 'pulled'.
One crucial thing to note however - calling identify() sets a flag on the page that effectively disables the default /decide check behavior from subsequent identify() methods for in-app notifications. As such, you will need to manually reset that flag to force another check. To illustrate this -
mixpanel.identify(); // checks for notifications mixpanel.identify(); // doest NOT check for notifications mixpanel._flags.identify_called = false; mixpanel.identify(); //checks for notifications
Given that you can only access flags with the non-minified version of Mixpanel's library, you will need to include the non-minified version of our library on your single page application, and change the CDN URL in your Mixpanel snippet:
which simply involves removing the string '.min' from the URL.
Once that's done, you will call the first identify() to flush the People update to Mixpanel, the method that switches the flag mentioned previously:
mixpanel._flags.identify_called = false;
and create the delay using the timeout mentioned previously before calling the second identify() method to allow time for the property to be added to the user and for the profile to be targeted. Any in-apps your user is targeted with should subsequently appear!