Skip to main content

Text setting may be rendered as unsafe HTML

Investigates merchant-configurable text rendered as HTML without sanitization.

DetailValue
Check IDTEXT_SETTING_HTML_SMUGGLING
SeverityHigh
How it runsAgent review
Caution

Metafields and metaobjects outside your app-owned namespace are lower-trust input, even when your app is the only app that writes them, because other installed apps can overwrite them. HTML or script stored in a shared namespace isn't trusted content. To find these values, see SHARED_NAMESPACE_METAFIELD_RENDER.

Anchor to Vulnerable exampleVulnerable example

app/components/BannerPreview.tsx

type Props = { settings: { headline: string } };

export function BannerPreview({ settings }: Props) {
// A merchant-editable text setting rendered as raw HTML.
// A value like <img src=x onerror=...> runs on the client.
return (
<div dangerouslySetInnerHTML={{ __html: settings.headline }} />
);
}

Anchor to How to fixHow to fix

Render settings as text or sanitize with a strict allowlist.

app/components/BannerPreview.tsx

type Props = { settings: { headline: string } };

export function BannerPreview({ settings }: Props) {
// Render the setting as text. If the feature really needs rich
// text, sanitize with a strict allowlist on the server before
// it is stored.
return <div>{settings.headline}</div>;
}

Anchor to RelatedRelated

Was this page helpful?