diff --git a/apps/builder/app/shared/content-model.test.tsx b/apps/builder/app/shared/content-model.test.tsx index 58fa198a02bf..3bbc20b5136e 100644 --- a/apps/builder/app/shared/content-model.test.tsx +++ b/apps/builder/app/shared/content-model.test.tsx @@ -489,6 +489,22 @@ test("edge case: support a > img", () => { ).toBeTruthy(); }); +test("support video > source", () => { + expect( + isTreeSatisfyingContentModel({ + ...renderData( + + + + + + ), + metas: defaultMetas, + instanceSelector: ["bodyId"], + }) + ).toBeTruthy(); +}); + describe("component content model", () => { test("restrict children with specific component", () => { expect( diff --git a/apps/builder/app/shared/content-model.ts b/apps/builder/app/shared/content-model.ts index 97751828708a..aa7260cb93a5 100644 --- a/apps/builder/app/shared/content-model.ts +++ b/apps/builder/app/shared/content-model.ts @@ -114,7 +114,10 @@ const getElementChildren = ( let elementChildren: string[] = tag === undefined ? ["transparent"] : elementsByTag[tag].children; if (elementChildren.includes("transparent") && allowedCategories) { - elementChildren = allowedCategories; + // merge categories from parent and current element when transparent occured + elementChildren = elementChildren.flatMap((category) => + category === "transparent" ? allowedCategories : category + ); } // introduce custom non-interactive category to restrict nesting interactive elements // like button > button or a > input