Troubleshooting

Which policy directive is stopping it, and how each failure looks

A content policy blocks things silently from the visitor's point of view and loudly in the console, which makes it one of the easier failures to diagnose once you know that the widget touches four directives rather than one. Each blocks at a different point, so the symptom tells you which.

The symptom

Nothing renders, or the launcher renders unstyled, or the launcher works and the panel never appears. The console carries a policy violation naming a directive.

What it usually is

In rough order of how often each one turns out to be the answer. Work down rather than across: each carries a way to tell whether it is yours before you change anything.

  • 1

    script-src does not allow the loader origin

    Why
    The tag is a third-party script, so the policy has to permit the origin it is served from before anything else can happen.
    How to confirm it is this one
    The console violation names script-src and quotes the loader URL. Nothing else from the widget appears in the console, because nothing else ran.
    Fix
    Add the origin the tag is served from to script-src. This is the only directive that has to be right before you can diagnose the other three.
  • 2

    style-src does not allow inline styles

    Why
    The launcher is styled by a style element the loader creates and fills in, inside its shadow root. A policy without unsafe-inline in style-src blocks that element's contents.
    How to confirm it is this one
    The launcher is in the DOM but has no styling, and the console violation names style-src. This is the one people misread as a broken build, because something did render.
    Fix
    Allow inline styles in style-src, or accept an unstyled launcher, which is not a real option. There is no hashed alternative here, because the style content is generated from your own appearance settings and changes with them.
  • 3

    frame-src does not allow the panel

    Why
    The conversation panel is a separate document in an iframe, fetched from the same origin as the loader the first time a visitor opens it.
    How to confirm it is this one
    The launcher renders and behaves correctly, and clicking it produces a policy violation naming frame-src or child-src. Nothing appears above the launcher.
    Fix
    Add the same origin to frame-src. Note that this failure only shows up on the first click, so a policy change can look fine for days before anybody hits it.
  • 4

    connect-src does not allow the configuration request

    Why
    The loader fetches its configuration from the API before it renders anything, and that request is governed by connect-src on your page.
    How to confirm it is this one
    The console violation names connect-src, and the network tab shows the configuration request blocked rather than failed.
    Fix
    Add the origin the tag was served from to connect-src. The loader resolves the API from its own script origin unless you have told it otherwise, so in the ordinary case this is the same host as script-src.
  • 5

    img-src blocks a custom launcher icon

    Why
    A custom launcher icon is an image element inside the shadow root, so it is governed by img-src on your page rather than by anything we control.
    How to confirm it is this one
    The launcher renders and is styled correctly but the icon is missing, and the violation names img-src and the icon URL.
    Fix
    Allow the host the icon is served from, or use one of the built-in icons, which are drawn as vector paths and need no image permission at all.

If none of those fit

What happens inside the panel is governed by the headers we serve with it, not by your page policy, so a violation naming something inside the conversation is not yours to fix. If you see one, the origin in the violation will be the panel's own, not yours.

Questions

Can I use a nonce instead of allowing inline styles?
Not for the launcher styles. They are generated from the appearance settings at runtime and change whenever you change a colour, so there is no stable hash and no nonce is available to script-created style content in the way there is for markup you author.
Is a policy worth the trouble given all this?
Yes, and the four lines above are the whole cost. A policy is one of the few controls that limits the damage of a compromised third-party script anywhere on your page, and this is a third-party script.
My policy is report-only and I still see violations. Is it blocking?
No. Report-only violations appear in the console with the same shape as enforced ones and block nothing. Check which header your site sends before changing anything, because chasing a report-only violation is a common waste of an afternoon.

Keep reading

Try it on your own material

Upload a document or point it at your site, paste one line of HTML, then ask it something only your business could answer.