CSS/Style Issues with Usersnap Screens

This section shows you how to configure your settings if you encounter CSS or Style issues when creating screens with Usersnap.

CSS/Style Issues in Rendered Screen

There may be instances when your Usersnap screens are not correctly rendered or lack CSS/style information. This is usually if your site is behind a firewall or requires basic authentication. It can also be that your static resources are protected.

Usersnap's rendering engine needs access to your site's static resources (images + stylesheets) to be able to render your screens accurately. You can find instructions here on how to fix this.

Known issue with frontend framework Material UI

The Modal component of Material UI is by default set to prevent the focus from leaving the modal. Unfortunately, this also blocks the user from typing in our widget if a Modal is currently open.

To disable Modal’s automatically restoring focus, set the ‘disableEnforceFocus’ prop to true. See here for more information.

Cross-origin Content

Cross-origin content is not captured and rendered in the Usersnap screen. This is because the browser does not allow the Usersnap widget to capture cross-origin content.

In this case, we suggest uploading a normal screenshot of the webpage to your Usersnap dashboard or using our browser extensions to create a screen which shows the cross-origin content.

Custom html elements

Unfortunately Usersnap does not support the usage of custom html elements. Although there aren't concrete plans for the future to support its usage, there is always the possibility of using the browser extension instead.

Updated 3 months ago

CSS/Style Issues with Usersnap Screens

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.