# Troubleshooting

Use this guide to diagnose and resolve common issues with In-Browser Message campaigns.

## General Debugging Steps

Before investigating a specific issue, run through these checks:

1. **Check the browser console** — Open DevTools (F12) → Console. Look for SDK initialization errors or network request failures.
2. **Check the Personalization API response** — In the Network tab, find the request to the `p13n-api` endpoint. Confirm the response includes the expected campaign payload under `offers`.
3. **Check campaign status in Engage Studio** — Confirm the campaign is **Live** (not Draft, Paused, or Finished).


## Popup Issues

### Popup does not appear

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| Campaign is not Live | Check campaign status in Engage Studio. Launch or Resume the campaign. |
| User does not meet Entry Criteria | In the p13n API response, confirm the section is present in `offers`. If absent, the user does not satisfy the entry criteria. Review the RT Personalization entry criteria in Audience Studio. |
| SDK is not initialized | Confirm `new TreasureSDK(...)` runs without errors in the console and that `trackEvent` is called with the `personalization` option. |
| Wrong WP13n-Token | Confirm the token passed to `personalization.token` matches the token shown in Audience Studio for the linked Personalization. |
| Multiple popups returned — wrong one shown | When multiple popup campaigns are returned, the SDK displays only the one with the **latest `created_at` timestamp**. To control priority, adjust which campaign was created most recently. |
| Page is served over HTTP | RT Personalization 2.0 requires HTTPS. Switch the page to HTTPS. |


### Popup appears but looks broken or unstyled

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| CSS conflicts with page styles | The SDK renders the popup inside a Shadow DOM to isolate styles. If custom CSS is injected via an HTML block in Beefree, verify it does not rely on global page styles. |
| Beefree content uses external fonts that are blocked by CSP | Check the browser console for CSP violations. Add the required font CDN to your site's Content-Security-Policy `font-src` directive. |
| Close button not visible | Confirm `closeButton.enabled` is `true` in the campaign's appearance settings and the close button color has sufficient contrast against the popup background. |


## Inline Campaign Issues

### Inline content does not appear

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| Zone ID does not match any element | Open DevTools → Console and run `document.querySelector('YOUR_SELECTOR')`. If it returns `null`, the selector is invalid or the element does not exist on this page. Update the Zone ID. |
| Element loaded after SDK injection | On SPAs or lazy-loading pages, the target element may not exist in the DOM when the SDK runs. The SDK uses MutationObserver to handle delayed rendering — confirm the SDK version supports this. If still failing, move the `trackEvent` call to after the target element is rendered. |
| Zone ID selector matches multiple elements | `document.querySelector` uses the **first** match. If multiple elements share the selector, only the first is replaced. Use a more specific selector (ID or `data-testid`) to target the correct element. |
| CSS-in-JS dynamic class names | If the page uses styled-components, Emotion, or CSS Modules, auto-generated class names change at each build. Use stable `id` or `data-testid` attributes. Update the Zone ID after any class name changes. |


### Inline content appears but Liquid variables are not resolved

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| Variable name is incorrect | Verify the variable syntax matches the reference exactly — `rt_profile.imported.<name>`, `rt_profile.single.<id>`, `rt_profile.lc.<id>.<col>`, etc. Check for typos. |
| Attribute not included in the Personalization payload | In Audience Studio, confirm the attribute is added to the Personalization section's **payload configuration**. Attributes must be explicitly included in the payload to be returned. |
| Batch attribute not yet computed | Batch attributes are computed on a schedule. If the parent segment was recently set up, wait for the next batch run to complete. |
| Unsupported Liquid construct used | Review the [supported Liquid syntax](/products/marketing-cloud/engage-studio/experiences/personalize-message-content). Replace unsupported constructs (filters, `{% assign %}`, `{% unless %}`) with supported alternatives. |


### HTML content rejected at launch (validation error)

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| Disallowed HTML tag in content | Remove or replace tags that are not permitted: `<script>`, `<iframe>`, `<form>`, `<input>`, `<base>`, `<meta>`, `<link>`, `<svg>`, `<math>`. See the [security restrictions](/products/marketing-cloud/engage-studio/experiences/create-an-inline-campaign) reference. |
| Inline event handler in HTML | Remove all `on*` attributes (`onclick`, `onload`, `onerror`, etc.) from the HTML. |
| `contenteditable` attribute | Remove `contenteditable` from the HTML. |


## SPA and Framework-Specific Issues

### Message appears on first page load but not after client-side navigation

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| `trackEvent` is only called on the initial page load | Call `trackEvent('events', { event_name: 'page_view' })` again after each client-side route change. For React Router, trigger the SDK call in a `useEffect` that runs on route changes. |
| Inline Zone element removed and re-added by the framework | On re-render, the replacement HTML may be overwritten by the framework. Use a stable, framework-managed insertion point that is not re-rendered, or call the personalization API again after re-render. |


### Message flickers or disappears immediately after injection

| **Possible Cause**  | **Solution**  |
|  --- | --- |
| JavaScript framework re-renders the target element | The framework's virtual DOM reconciliation overwrites the injected content. Wrap the target Zone in an element the framework does not manage, or add a stable `ref` to prevent re-rendering. |
| `useState` / `useEffect` triggers a re-render after injection | Move the personalization call to run after all state updates that affect the target element have completed. |


## Web Message Previewer (Chrome Extension)

For Chrome Extension-specific issues, see the [Troubleshooting section in the Web Message Previewer guide](/products/marketing-cloud/engage-studio/experiences/chrome-extension#troubleshooting).