diff --git a/addons/html_builder/static/src/builder/builder_components/builder_context.js b/addons/html_builder/static/src/builder/builder_components/builder_context.js new file mode 100644 index 0000000000000..4779bf0e07844 --- /dev/null +++ b/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` + + + + `; + static props = { + ...basicContainerBuilderComponentProps, + slots: { type: Object }, + }; + static components = { + BuilderComponent, + }; + + setup() { + useBuilderComponent(); + } +} diff --git a/addons/html_builder/static/src/builder/builder_components/default_builder_components.js b/addons/html_builder/static/src/builder/builder_components/default_builder_components.js index d02c82aa91913..61f8dbb798906 100644 --- a/addons/html_builder/static/src/builder/builder_components/default_builder_components.js +++ b/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, diff --git a/addons/html_builder/static/tests/custom_tab/builder_components/builder_context.test.js b/addons/html_builder/static/tests/custom_tab/builder_components/builder_context.test.js new file mode 100644 index 0000000000000..5c94a0ecba7f1 --- /dev/null +++ b/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` + + MyAction + + `, + }); + await setupWebsiteBuilder(`
b
`); + 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"]); +});