add builder context

addons/html_builder/static/src/builder/builder_components/builder_context.js

@@ -0,0 +1,22 @@
+import { Component, xml } from "@odoo/owl";
+import { basicContainerBuilderComponentProps, useBuilderComponent } from "./utils";
+import { BuilderComponent } from "./builder_component";
+
+export class BuilderContext extends Component {
+    static template = xml`
+        <BuilderComponent dependencies="props.dependencies">
+            <t t-slot="default"/>
+        </BuilderComponent>
+    `;
+    static props = {
+        ...basicContainerBuilderComponentProps,
+        slots: { type: Object },
+    };
+    static components = {
+        BuilderComponent,
+    };
+
+    setup() {
+        useBuilderComponent();
+    }
+}

addons/html_builder/static/src/builder/builder_components/default_builder_components.js

@@ -10,8 +10,10 @@ import { BuilderColorPicker } from "./builder_colorpicker";
 import { BuilderTextInput } from "./builder_text_input";
 import { BuilderCheckbox } from "./builder_checkbox";
 import { BuilderRange } from "./builder_range";
+import { BuilderContext } from "./builder_context";
 
 export const defaultBuilderComponents = {
+    BuilderContext,
     BuilderRow,
     Dropdown,
     DropdownItem,

addons/html_builder/static/tests/custom_tab/builder_components/builder_context.test.js

@@ -0,0 +1,34 @@
+import { expect, test } from "@odoo/hoot";
+import { xml } from "@odoo/owl";
+import { contains } from "@web/../tests/web_test_helpers";
+import {
+    addActionOption,
+    addOption,
+    defineWebsiteModels,
+    setupWebsiteBuilder,
+} from "../../helpers";
+
+defineWebsiteModels();
+
+test("should pass the context", async () => {
+    addActionOption({
+        customAction: {
+            apply: ({ param, value }) => {
+                expect.step(`customAction ${param} ${value}`);
+            },
+        },
+    });
+    addOption({
+        selector: ".test-options-target",
+        template: xml`
+            <BuilderContext action="'customAction'" actionParam="'myParam'">
+                <BuilderButton actionValue="'myValue'">MyAction</BuilderButton>
+            </BuilderContext>
+        `,
+    });
+    await setupWebsiteBuilder(`<div class="test-options-target">b</div>`);
+    await contains(":iframe .test-options-target").click();
+    await contains(".we-bg-options-container button").click();
+    // The function `apply` should be called twice (on hover (for preview), then, on click).
+    expect.verifySteps(["customAction myParam myValue", "customAction myParam myValue"]);
+});