Trying to create a Toast

Ben Regier

I'm very new to add-ins, and have been going through the tutorials to get a sense for how they work.  I've done the Hello World Button tutorial, which was working, but I want to modify it to show a toast message rather than a modal.  That's not working, and I'm not sure why.  This is the function that I've modified to show a toast instead of a modal:


  function showAddCustomerModal() {

    client.showToast({

      message: 'This is a toast message.',

      style: AddinToastStyle.Info

    });


Anything obvious that I've done wrong?

Ben Lambert

HI Ben,


Your code looks right at a glance (aside from missing the closing bracket for the function itself) - let's get a few more details from you to troubleshoot:

1. Which extension point are you using (constituent tile dashboard, page action, etc.)? 
2. Do you see any errors in the browser console?

Ben Regier

I'm trying it both on the Constituent Page Action (Preview) and on Development Office Home Action (Preview).  I'm also running this in the test RE environment.


The browser console shows a number of errors, mostly in the form of this:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api-js.mixpanel.com/groups/?ip=1&_=1588694194501. (Reason: CORS request did not succeed).


There's also a TypeError: "e is undefined"

 

Ben Lambert

Thanks Ben - we're investigating and will report back asap.

Michael Tims

Hi Ben R.,


I don't believe the mixpanel errors should prevent the toast from displaying.  Could you try changing your code to be the following:


 function showAddCustomerModal() {

    client.showToast({

      message: 'This is a toast message.',

      style: BBSkyAddinClient.AddinToastStyle.Info

    });


Fully-qualifying the AddinToastStyle enum value.


Also, to double check, are you pulling in the sky-addin-client (in helloworldbutton.html) like this?

<script src="https://sky.blackbaudcdn.net/static/sky-addin-client/1/sky-addin-client.umd.min.js"></script>


Thanks.

 

Ben Regier

Using BBSkyAddinClient.AddinToastStyle.Info fixed it on the Constituent Page Action (Preview), but not on Development Office Home Action (Preview).


(For this project, I only need it to work on the Constituent page, so for my purposes this is good enough!  But if you'd like me to try anything else to troubleshoot the Home page, I'd be happy to try things out.)


Thanks for your help.