Escape JSON-LD payloads before inlining them in a script tag (#23865)

Fixes the one code scanner alert of the three that turned out to be a
real vulnerability.

## The problem

`JsonLd` inlined `JSON.stringify` output straight into a `<script>`
body:

```tsx
<script dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }} type="application/ld+json" />
```

The HTML parser scans a script body for `</script` and `<!--` before any
JSON parsing happens, so a string value containing `</script>` closes
the tag and everything after it is parsed as markup. `JSON.stringify`
does not escape it.

## Why it is reachable

The breadcrumb payloads are not all static. Two values come from outside
the repo:

- `app.name` on `/apps/[slug]` — served by the marketplace API, which
syncs it from the `displayName` field of an npm package manifest
(`marketplace-catalog-sync.service.ts`).
- `partner.name` on `/partners/profile/[slug]` — served by the partners
API from partner-submitted profiles.

Listing and vetting gate both, but that is a human review step, not an
escaping control. There is no CSP backstop either: `next.config.ts` only
sets `frame-ancestors 'none'`, no `script-src`.

Everywhere else these names render as React text and are escaped. This
was the only raw sink in `twenty-website`.

## Verification

Rendered the exact markup the component emits in headless Chromium with
a name of `Evil App</script>``&lt;img src=x onerror=...&gt;'``:

- before: the `ld+json` block is terminated early, an `<img>` element is
created, and the handler runs (page title changes).
- after: the script block stays intact, no element is created, and
`JSON.parse` of the payload deep-equals the input.

## The fix

Escape `<`, `>` and `&` as JSON unicode sequences (`<` and friends).
They parse back to the identical string, so consumers see unchanged
structured data, but nothing in the payload can start a tag or a
comment.

U+2028/U+2029 are deliberately not escaped: they matter when a payload
lands in a JavaScript context, and this one is parsed as JSON. Leaving
them out keeps the source pure ASCII rather than carrying invisible
separators.

Covered by unit tests for the breakout attempt, the comment-opening
case, round-trip equality, and the untouched-payload case.

---
_Generated by [Claude
Code](https://claude.ai/code/session_018sRaaxTucSdufjk6txdQE9)_

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/23865?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->
This commit is contained in:
Félix Malfait
2026-08-06 14:36:13 +02:00
committed by GitHub
parent f4d5500fc4
commit c7f443662f
3 changed files with 56 additions and 1 deletions
@@ -1,3 +1,5 @@
import { serializeJsonLd } from './serialize-json-ld';
export type JsonLdProps = {
data: Record<string, unknown>;
};
@@ -6,7 +8,7 @@ export function JsonLd({ data }: JsonLdProps) {
return (
<script
// eslint-disable-next-line react/no-danger
dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }}
dangerouslySetInnerHTML={{ __html: serializeJsonLd(data) }}
type="application/ld+json"
/>
);
@@ -0,0 +1,35 @@
import { serializeJsonLd } from './serialize-json-ld';
describe('serializeJsonLd', () => {
it('should escape markup that would close the script tag', () => {
const serialized = serializeJsonLd({
name: 'Evil App</script><img src=x onerror=alert(1)>',
});
expect(serialized).not.toContain('</script');
expect(serialized).not.toContain('<img');
expect(serialized).toContain('\\u003c');
});
it('should escape sequences that open an HTML comment', () => {
expect(serializeJsonLd({ name: '<!--' })).not.toContain('<!--');
});
it('should keep the payload parseable and unchanged', () => {
const data = {
'@context': 'https://schema.org',
'@type': 'BreadcrumbList',
itemListElement: [
{ name: 'Ben & Jerry <Partner>', item: 'https://twenty.com/a?b=1&c=2' },
],
};
expect(JSON.parse(serializeJsonLd(data))).toEqual(data);
});
it('should leave payloads without HTML significant characters untouched', () => {
const data = { '@type': 'FAQPage', name: 'Plain name' };
expect(serializeJsonLd(data)).toBe(JSON.stringify(data));
});
});
@@ -0,0 +1,18 @@
// JSON.stringify output is inlined into a <script> body, where the HTML parser
// still scans for "</script" and "<!--" before any JSON parsing happens. Names
// reaching this payload come from the marketplace and partners APIs, so they
// could otherwise close the tag and inject markup. Escaping as JSON unicode
// sequences parses back to the same string while staying inert in HTML.
const HTML_SIGNIFICANT_CHARACTERS_PATTERN = /[<>&]/g;
const HTML_SIGNIFICANT_CHARACTER_ESCAPES: Record<string, string> = {
'<': '\\u003c',
'>': '\\u003e',
'&': '\\u0026',
};
export const serializeJsonLd = (data: Record<string, unknown>): string =>
JSON.stringify(data).replace(
HTML_SIGNIFICANT_CHARACTERS_PATTERN,
(character) => HTML_SIGNIFICANT_CHARACTER_ESCAPES[character],
);