Skip to main content

Upgrade your deployment script from Chaperone to Embed

This article will provide you with the necessary instructions to upgrade from the Chaperone script to the Embed script.

In order to ensure you and your chatters have the best Ada experience possible, if you are currently using our old Chaperone script, we strongly encourage you to upgrade to the new Embed script.

Please note that the upgrade from Chaperone to the Embed script applies only to Ada in web applications, and not mobile applications. No upgrade is currently required for Ada bots embedded within mobile applications, as these embeds do not use Chaperone.

Checking if you are on Chaperone or Embed

There are two different methods to check if you are using Chaperone or Embed. The first uses the Console tab, and the second, the Elements tab. If you have a preference, select accordingly. If you do not have a preference, the first method may be slightly faster, but either will do.

Method 1 - Console Tab

  1. Navigate to the website in which you have the Ada bot setup.

  2. Open your browser’s developer tools (Firefox, Chrome).

  3. In the Console tab, paste the following snippet and press Enter/Return:

    Boolean(window.adaEmbed && !window.AdaChaperone);
    
  4. If the return value is true, then you are using the new Embed script and no upgrade is required. If the return value is false, then you are likely using Chaperone and will need to upgrade to the Embed script.

    Screen_Shot_2019-11-19_at_10.56.23_AM.png

Method 2 - Elements Tab

  1. Navigate to the website in which you have the Ada bot setup.

  2. Open your browser’s developer tools (Firefox, Chrome).

  3. Click on the Elements tab and search for: https://static.ada.support/embed.js

  4. If you find an exact match, then you are using the new Embed script and no upgrade is required. If you do not find an exact match, then you are likely using Chaperone and will need to upgrade to the Embed script.

    Note

    The Chaperone script will look similar, usually something like this: https://static.ada.support/embed.1450fb69.min.js

    Screen_Shot_2019-11-19_at_10.56.09_AM.png

Upgrading from Chaperone to Embed

Note

The following is intended to be used by a technical member of your team.

The API for the Embed script has been improved in order to provide easier instantiation of your bot. If in the section above you determined that you are using Chaperone, you will need to follow the steps below to upgrade.

  1. Locate the Chaperone script in your code. It is likely located in the <head> of your document. It should look something like this:

    <script src="https://static.ada.support/embed.<hash>.min.js"></script>
  2. Replace this with the new Embed script:

    <script async id="__ada" data-handle=<YOUR_BOT_HANDLE> src="https://static.ada.support/embed.js"></script>

    Be sure to use your own bot handle with the data-handle attribute.

  3. Find the line of code where you instantiate AdaChaperone in your application. It is likely located after the closing </body> tag. It will look something like this:

    <script type="text/javascript">
      const adaBot = new AdaChaperone(<YOUR_BOT_HANDLE>);
    </script>
    
  4. If your AdaChaperone instantiation only includes a bot handle and nothing else, and if you are not calling any methods on the AdaChaperone instance, you can delete this code. You are done!

    If the above is not true (ie. you are passing configuration options to AdaChaperone, or are calling methods on the instance such as setMetaFields or reset), you will need to do additional configuration. These steps will vary on a case-by-case basis; however, in general:

    • Options contained in AdaChaperone will need to be set using the new Embed window.adaSettings object. For example, if your Chaperone code looked liked this:

      <script type="text/javascript">
        const adaBot = new AdaChaperone(<YOUR_BOT_HANDLE>, {
          "customStyles": "...",
          "language": "fr"
        });
      </script>
      

      You would need to move customStyles and language into the window.adaSettings object like this:

      window.adaSettings = {
        "styles": "...",
        "language": "fr"
      }
      

      Note

      customStyles has been renamed to styles.

    • Methods will need to be called on the new adaEmbed window object instead of on the AdaChaperone instance. For example, if you were setting meta fields like this:

      adaBot.setMetaField("email", "joe-schmoe123@gmail.com");
      adaBot.setMetaField("name", "Joe Schmoe");
      

      You would need to instead either set the meta fields in your adaSettings object (this useful for setting initial values):

      window.adaSettings = {
        metaFields: {
          "email": "joe-schmoe123@gmail.com",
          "name": "Joe Schmoe"
        }
      }
      

      Or you could set values on the fly with the setMetaFields method:

      adaEmbed.setMetaFields({
        "email": "joe-schmoe123@gmail.com",
        "name": "Joe Schmoe"
      });
      

Have any questions? Contact your Ada team—or email us at help@ada.support.