Try-on JavaScript API

The try-on has a JavaScript API for opening and closing its window from your store’s code. In most cases, the data-reverbs-trigger attribute does the job without JavaScript. See Install modes.

What each try-on exposes

Try-on	Object	Know when it’s ready
Rooms (furniture, flooring and walls)	`window.reverbsWidget`	`window.reverbsWidgetReady` or the `reverbs:ready` event
Fashion and eyewear	`window.reverbsWidgetFashion`	The `reverbs:fashion:init` event
Sizing	No API to open it from code.

Room try-on

window.reverbsWidgetReady

A Promise created when the try-on script starts running.

Resolves with the try-on itself (the same object as window.reverbsWidget) once it finishes loading and looking up the page’s product.
Rejects with a { code, message, userId } object when the try-on can’t load. Use message in your error log.

It only exists after the Provei script starts running. Since the script loads asynchronously, check whether it exists yet and, if it doesn’t, wait for the reverbs:ready event:

function quandoOProvadorEstiverPronto(callback) {
  if (window.reverbsWidgetReady) {
    window.reverbsWidgetReady.then(callback, function (erro) {
      console.warn("Provador indisponível:", erro.message);
    });
    return;
  }
  window.addEventListener("reverbs:ready", function (event) {
    callback(event.detail.widget);
  }, { once: true });
}

window.reverbsWidget.open()

Opens the try-on window. Takes no arguments and returns nothing.

It does nothing when:

the product on the page isn’t in the Provei catalog or isn’t active;
the window uses the Dentro da página (Inside the page) format;
the try-on is already open.

window.reverbsWidget.close()

Closes the try-on window. Does nothing if it’s already closed. Shoppers can also close it with the X, the Esc key, or by clicking outside the window.

window.reverbsWidgetOwnerId

The ID of the account that owns the try-on loaded on the page, as a string. Use it to check which account is installed.

Example

<button type="button" id="ver-no-ambiente">Ver no meu ambiente</button>

<script>
  document.getElementById("ver-no-ambiente").addEventListener("click", function () {
    if (window.reverbsWidget && typeof window.reverbsWidget.open === "function") {
      window.reverbsWidget.open();
    }
  });
</script>

Fashion and eyewear try-ons

The fashion and eyewear try-ons use window.reverbsWidgetFashion, with the same open() and close() methods and the same rules: it only opens on catalog products that are active, and it doesn’t open in the Dentro da página format.

There is no readiness Promise. Look up the object at click time:

<script>
  document.getElementById("experimentar").addEventListener("click", function () {
    var provador = window.reverbsWidgetFashion;
    if (provador && typeof provador.open === "function") {
      provador.open();
    }
  });
</script>

To know when it has finished loading, listen for reverbs:fashion:init. See Try-on events.

Good practices

Call open() in response to a shopper action, such as a click. Opening it unprompted gets in the way of the purchase.
Don’t call methods that aren’t on this page. Other properties of these objects can change without notice.
To react to the cart, shopper identification or errors, use the try-on events.

Frequently asked questions

Does calling open() generate a try-on?

No. open() only shows the try-on window. The shopper still has to upload a photo, and only a generated try-on uses credits.

Why does open() do nothing?

The try-on only opens on product pages that are in the Provei catalog and active. It also doesn't open in the Dentro da página (Inside the page) format or when it's already open.

Does the API work with the fashion try-on?

Yes, under a different name. For the fashion and eyewear try-ons, use window.reverbsWidgetFashion.open() and window.reverbsWidgetFashion.close().

Provei support answers by email and WhatsApp.