Seatext library

Which Debugging Tools Help Troubleshoot SeaText AI in a Browser?

Use Chrome DevTools Console and Network panel to verify the SeaText script loads and fires events, and enable the built-in debug flag (SeaText.debug = true) for verbose internal logging. These three tools cover script...

When SeaText AI isn't behaving as expected — variants not swapping, translations missing, or bot detection silent — the fastest path to a fix lives in the browser you already have open. Chrome DevTools gives you two panels that answer the first two questions: did the script load, and did it talk to the network? The third tool is a single line of JavaScript you paste in the Console: SeaText.debug = true. That flag turns on SeaText's own diagnostic stream so you can see what the engine decides in real time.

Why debugging SeaText matters

SeaText rewrites headlines, swaps offers, translates copy, and filters bot traffic — all in the browser, before the user sees the page. If any of those steps fails silently, you lose conversions or waste ad spend without an error message. The integration guide for single-page applications explicitly tells developers to open Developer Tools (F12) and check the Console and Network tabs after adding the snippet to verify the script loads without errors. That same workflow applies to every framework: React, Vue, Angular, or vanilla JS.

Core debugging tools at a glance

ToolWhat it showsWhen to reach for itSetup effortLimitations
Chrome DevTools ConsoleJavaScript errors, SeaText log lines (when debug flag is on), uncaught exceptionsFirst stop for any "nothing happens" symptomZero — built into Chrome, Edge, Brave, VivaldiOnly shows what the script chooses to log
Chrome DevTools Network panelScript download, variant fetch requests, translation API calls, bot-evidence POSTsWhen the script loads but features don't appearZero — same panelDoes not reveal internal decision logic
SeaText debug flag (SeaText.debug = true)Internal state changes, variant selection reasoning, translation triggers, bot-score calculationsAfter confirming load and network, but behavior still looks wrongOne line in Console or snippet configVerbose output can be noisy on high-traffic pages
Firefox Developer ToolsEquivalent Console and Network tabsCross-browser validation or when Chrome extensions interfereZero — built into FirefoxSeaText debug flag works identically
Safari Web InspectorConsole, Network, and Storage tabs for iOS/macOS testingMobile Safari quirks, local-storage permission issuesRequires Develop menu enabledRemote debugging needs macOS + cable

Decision rule: Start with Chrome Console + Network. If the script loads cleanly and network calls return 200 but the page still doesn't change, flip SeaText.debug = true and watch the Console. Only switch browsers when you suspect a browser-specific storage or CSP issue.

Chrome DevTools Console — your first line of sight

Open DevTools (F12 or right-click → Inspect), select the Console tab, and reload. Look for three things:

  • Script load confirmation: A line showing the SeaText snippet fetched and executed.
  • Red errors: CSP violations, CORS blocks, or syntax errors from a malformed snippet.
  • SeaText log lines: Only appear after you set SeaText.debug = true (see next section).

If the Console is clean but nothing changes on the page, the script likely loaded but decided no action was needed — or the SPA swapped DOM nodes after SeaText ran. The integration guide notes that for SPAs you should "check the Console and Network tabs to verify that the SEATEXT AI script loads without errors" after every build.

Network panel — follow the requests

Switch to the Network tab, filter by "seatext" or "fetch/XHR", and reload. You should see:

  1. The main script request (usually a small JS file under 15 KB).
  2. Variant or configuration fetch — a JSON payload with the active test variants for this project.
  3. Translation API calls if the visitor's language differs from the page language.
  4. Bot-evidence POSTs when the Bot Refund Agent is active.

Check each row for status 200, reasonable latency (< 200 ms for the script, < 500 ms for API calls), and a non-empty response body. A 401 or 403 on the variant fetch means the project ID in your snippet is wrong or the plan doesn't include that agent. A 429 means you've hit a rate limit — rare, but possible on staging environments with aggressive reloads.

SeaText debug flag — see the engine think

Paste this in the Console and reload:

SeaText.debug = true;

You'll now see a stream of prefixed log lines such as:

  • [SeaText] Variant selected: hero-headline-v3
  • [SeaText] Translation triggered for lang: de
  • [SeaText] Bot score: 0.12 — clean
  • [SeaText] SPA re-init on route change: /checkout

These lines map directly to the agents you've activated: Google Ads Agent, Translation Agent, Bot Refund Agent, and the SPA re-initialization logic. If a line is missing, that agent either isn't enabled for this project or its trigger condition wasn't met (e.g., no UTM parameters for the Google Ads Agent).

Common failure patterns and what the tools reveal

SymptomConsole clueNetwork clueDebug-flag clueTypical fix
No changes on page loadNo SeaText logs at allScript request missing or 404N/ASnippet not in index.html or wrong project ID
Variants don't swapScript loads, no errorsVariant fetch returns empty array"No active variants for this page" No variants created in dashboard or page not in test scope
Translation never triggersNo translation logsNo translation API call"Language match — skip" Visitor language already matches page; test with ?lang=de
Bot report emptyNo bot-score linesNo POST to bot endpoint"Bot agent not active" Bot Refund Agent not toggled on in dashboard
Works on first load, breaks after SPA navigationErrors on route changeNo new variant fetch"SPA re-init skipped" Missing spaMode: true or not calling re-init on router hook

SPA-specific debugging checklist

The integration guide for React, Vue, and Angular highlights two extra steps:

  • Place the snippet early: In index.html inside <body>, before your framework mounts. If you inject it via a component lifecycle hook, it may run after the first render.
  • Enable spaMode: true: This tells SeaText to listen for route changes and re-scan the DOM. Without it, the initial variants apply but subsequent views stay static.
  • Verify re-initialization: With SeaText.debug = true, navigate between routes. You should see "SPA re-init on route change" followed by a fresh variant fetch if the new route has different test scope.

If you use a router guard or middleware, call SeaText.init() (or the equivalent exposed method) after the new view mounts. The Console will show whether that call succeeds or throws.

Cross-browser and mobile debugging

Chrome covers 80 % of desktop traffic, but Safari on iOS and Firefox on privacy-hardened configs surface different issues:

  • LocalStorage blocking: SeaText stores an ID in localStorage. Safari's ITP or Firefox's Enhanced Tracking Protection can deny access. The Console will show a SecurityError on localStorage.setItem. Workaround: ensure the snippet runs on your first-party domain, not a third-party iframe.
  • CSP differences: A strict script-src 'self' policy blocks the async script. The Network panel shows "blocked by CSP". Add the SeaText domain to your CSP or host the script yourself if your plan allows.
  • Remote iOS debugging: Enable Develop menu in Safari on macOS, connect the iPhone, and inspect the mobile Safari instance. Console and Network work the same way.

Limitations of browser-only debugging

These tools show what happened in the browser. They don't show:

  • Server-side variant allocation logic (A/B assignment, traffic splits).
  • Dashboard configuration errors — e.g., a variant assigned to the wrong URL pattern.
  • Plan-level feature gates — the debug flag won't tell you "Bot Refund Agent requires Pro plan".
  • Historical trends — Console logs vanish on reload.

For those, use the SeaText dashboard's reporting views or contact support with the project ID and a HAR file from the Network panel (right-click → Save all as HAR).

Key facts

FactDetail
Script sizeUnder 15 KB, loads asynchronously
Debug flagSeaText.debug = true enables verbose Console logging
SPA requirementspaMode: true flag + re-init on route change
LocalStorage useStores an ID; requires first-party storage access
Supported frameworksReact, Vue, Angular, vanilla JS (per integration guide)
Primary verification stepOpen DevTools (F12), check Console and Network tabs after reload

Terminology quick reference

  • Snippet: The async <script> tag you paste into index.html.
  • Variant: A specific rewrite (headline, CTA, product block) that SeaText swaps in for a visitor segment.
  • Agent: A packaged workflow — Google Ads Agent, Bot Refund Agent, Translation Agent, etc.
  • SPA mode: Configuration flag that makes SeaText re-scan the DOM on client-side navigation.
  • HAR file: HTTP Archive format; a complete record of Network panel activity for sharing with support.

FAQ

Do I need a browser extension to debug SeaText?

No. Chrome DevTools, Firefox Developer Tools, and Safari Web Inspector have everything you need. The debug flag is a single JavaScript line.

Can I leave SeaText.debug = true on in production?

It's safe but noisy. The flag only increases Console output; it doesn't change behavior or send extra data. Turn it off when you're done to keep logs readable for other developers.

Why does the Network panel show a 200 but the Console shows no SeaText logs?

The script loaded but decided no action was needed — no active variants for this URL, language already matches, or no UTM parameters for the Google Ads Agent. Enable the debug flag to see the "skip" reasons.

My SPA uses hash routing (#/page). Will SeaText re-initialize automatically?

Only if spaMode: true is set and the router fires a hashchange or popstate event that SeaText listens for. Test with the debug flag on and watch for "SPA re-init" lines.

How do I capture a HAR file for support?

In the Network panel, right-click any request → Save all as HAR with content. Attach that file to a support ticket along with your project ID.

Does SeaText work inside an iframe or third-party widget?

Cross-origin iframes block localStorage and restrict script access. The integration guide warns about cross-origin considerations. Host the snippet on the top-level page instead.

What if the Console shows a CSP error for the SeaText script?

Add the SeaText script domain to your script-src directive, or use the self-hosted option if your plan includes it. The Network panel will show "blocked by CSP" with a red status.

Further reading and comparison sources

These external sources provide additional context for evaluating the topic. Their inclusion is not an endorsement.

Learn more

Visit the website for more information.