Elgato_dark/twenty
1
0
Fork 0
mirror of https://github.com/twentyhq/twenty synced 2026-04-21 13:37:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 17

fix(front-component-renderer): use permissive sandbox default for iframe instead of force-overriding

Browse source 
https://sonarly.com/issue/29143?type=bug

Custom front components that render iframes get a force-applied `sandbox=""` attribute (most restrictive possible), overriding any developer-supplied sandbox value and blocking JavaScript, forms, popups, and same-origin access inside the iframe.

Fix: Changed `createHtmlHostWrapper.ts` with two fixes:

1. **Changed sandbox default value from `''` to `'allow-scripts allow-forms allow-popups'`** — The empty string `sandbox=""` is the most restrictive possible value per HTML spec (blocks all scripts, forms, popups, same-origin access). The new default allows JavaScript execution, form submission, and popups — which are required for any non-trivial iframe embedding (analytics dashboards, OAuth flows, payment widgets). `allow-same-origin` is intentionally excluded from the default to prevent third-party front components from accessing the host application's cookies/storage, maintaining the security boundary.

2. **Reversed the spread order from `{...filterProps(props), ...forcedProps}` to `{...defaultProps, ...filterProps(props)}`** — Previously, forced props were spread last, silently overriding any developer-supplied `sandbox` attribute. Now default props are spread first, so app developers can explicitly set their own sandbox value when needed (e.g., `sandbox="allow-scripts allow-same-origin"` for trusted same-origin content). This follows the standard React "defaults with overrides" pattern.

The constant was renamed from `FORCED_PROPS_BY_TAG` to `DEFAULT_PROPS_BY_TAG` and the local variable from `forcedProps` to `defaultProps` to accurately reflect the new semantics.
This commit is contained in:
Sonarly Claude Code 2026-04-20 20:52:16 +00:00
parent 13afef5d1d
commit dd67109594
1 changed files with 4 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/twenty-front-component-renderer/src/host/utils/createHtmlHostWrapper.ts
View file

@ -166,18 +166,18 @@ const filterProps = <T extends object>(props: T): T => {
type WrapperProps = { children?: React.ReactNode } & Record<string, unknown>;
const FORCED_PROPS_BY_TAG: Record<string, Record<string, unknown>> = {
iframe: { sandbox: '' },
const DEFAULT_PROPS_BY_TAG: Record<string, Record<string, unknown>> = {
iframe: { sandbox: 'allow-scripts allow-forms allow-popups' },
};
export const createHtmlHostWrapper = (htmlTag: string) => {
const isVoid = VOID_ELEMENTS.has(htmlTag);
const forcedProps = FORCED_PROPS_BY_TAG[htmlTag];
const defaultProps = DEFAULT_PROPS_BY_TAG[htmlTag];
return ({ children, ...props }: WrapperProps) =>
React.createElement(
htmlTag,
{ ...filterProps(props), ...forcedProps },
{ ...defaultProps, ...filterProps(props) },
isVoid ? undefined : children,
);
};