Getting Started

Our JavaScript SDK offers an API to programmatically interact with Appetize devices. This allows you to automate interactions with the device, verify app behavior, and more.

Installation

First, load the JavaScript SDK by adding the following snippet to the head section of your page:

<script>
(function () {const n = window,i = document,o = i.getElementsByTagName("script")[0],t = i.createElement("script");
(t.src = "https://js.appetize.io/embed.js"), (t.async = 1), o.parentNode.insertBefore(t, o);
const s = new Promise(function (e) {t.onload = function () {e();};});n.appetize = {getClient: function (...e) {
return s.then(() => n.appetize.getClient(...e));},};})();
</script>

Embed your app

Add an iframe with an Appetize embed URL:

<iframe
    id="appetize"
    src="https://appetize.io/embed/<PUBLIC KEY>"
    width="378px" 
    height="800px" 
    frameborder="0" 
    scrolling="no"></iframe>

We gave the iframe an id of appetize, but it can be anything you wish.

Get the Client

The easiest way to get the client is by calling window.appetize.getClient(selector).

This will return an Appetize client instance for the embed e.g.

const client = await window.appetize.getClient("#appetize")

We also support getting the client with an initial configuration - for scenarios where the initial embed link might not be known on launching of the page (no src specified on the iframe) by making use of window.appetize.getClient(selector, config).

This will return an Appetize client instance with the initial configuration applied e.g.

const client = await window.appetize.getClient("#appetize", {    
    publicKey: '{publicKey}',
    device: 'iphone13pro',
    osVersion: '15.0'
    ...
})

The base URL can be changed with a data-appetize-url attribute, e.g. data-appetize-url="https://sampledomain.appetize.io"

Starting a Session

You can start a session programmatically:

const session = await client.startSession()
console.log('session started!')

or wait for the user to click "Tap to Play":

client.on("session", session => {
    console.log('session started!')
})

Next we'll cover various ways you can configure the embed, such as the device or OS version.