Skip to content

Commit 9643ee5

Browse files
dabo-odooFrancoisGe
dabo-odoo
authored and
FrancoisGe
committed
[IMP] html_builder: Tests for NavbarLinkPopover and MenuDataPlugin
1 parent 85f7e56 commit 9643ee5

File tree

1 file changed

+198
-0
lines changed

1 file changed

+198
-0
lines changed

‎addons/html_builder/static/tests/website_builder/menu_data.test.js

Lines changed: 198 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,198 @@
1+
import { describe, expect, test } from "@odoo/hoot";
2+
import { waitFor, waitForNone, click } from "@odoo/hoot-dom";
3+
import { defineWebsiteModels } from "../website_helpers";
4+
import { setupEditor } from "@html_editor/../tests/_helpers/editor";
5+
import { setSelection } from "@html_editor/../tests/_helpers/selection";
6+
import { patchWithCleanup, mockService, onRpc } from "@web/../tests/web_test_helpers";
7+
import { MAIN_PLUGINS } from "@html_editor/plugin_sets";
8+
import { MenuDataPlugin } from "@html_builder/website_builder/plugins/menu_data_plugin";
9+
import { MenuDialog } from "@website/components/dialog/edit_menu";
10+
11+
defineWebsiteModels();
12+
13+
describe("NavbarLinkPopover", () => {
14+
test("should open a navbar popover when the selection is inside a top menu link and close outside of a top menu link", async () => {
15+
const { el } = await setupEditor(
16+
`<ul class="top_menu">
17+
<li>
18+
<a class="nav-link" href="exists">
19+
<span>Top Menu Item</span>
20+
</a>
21+
</li>
22+
</ul>
23+
<p>Outside</p>`,
24+
{
25+
config: { Plugins: [...MAIN_PLUGINS, MenuDataPlugin] },
26+
}
27+
);
28+
expect(".o-we-linkpopover").toHaveCount(0);
29+
// selection inside a top menu link
30+
setSelection({ anchorNode: el.querySelector(".nav-link > span"), anchorOffset: 0 });
31+
await waitFor(".o-we-linkpopover");
32+
// remove link button replaced with sitemap button
33+
expect(".o-we-linkpopover:has(i.fa-chain-broken)").toHaveCount(0);
34+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
35+
// selection outside a top menu link
36+
setSelection({ anchorNode: el.querySelector("p"), anchorOffset: 0 });
37+
await waitForNone(".o-we-linkpopover");
38+
expect(".o-we-linkpopover").toHaveCount(0);
39+
});
40+
41+
test("should open a navbar popover when the selection is inside a top menu link and stay open if selection move in the same link", async () => {
42+
const { el } = await setupEditor(
43+
`<ul class="top_menu">
44+
<li>
45+
<a class="nav-link" href="exists">
46+
<span>Top Menu Item</span>
47+
</a>
48+
</li>
49+
</ul>`,
50+
{
51+
config: { Plugins: [...MAIN_PLUGINS, MenuDataPlugin] },
52+
}
53+
);
54+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(0);
55+
// open navbar link popover
56+
setSelection({ anchorNode: el.querySelector(".nav-link > span"), anchorOffset: 0 });
57+
await waitFor(".o-we-linkpopover");
58+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
59+
// selection in the same link
60+
setSelection({ anchorNode: el.querySelector(".nav-link > span"), anchorOffset: 1 });
61+
await waitFor(".o-we-linkpopover");
62+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
63+
});
64+
65+
test("should open a navbar popover when the selection is inside a top menu dropdown link", async () => {
66+
const { el } = await setupEditor(
67+
`<ul class="top_menu">
68+
<li>
69+
<a class="nav-link" href="exists">
70+
<span>Top Menu Item</span>
71+
</a>
72+
</li>
73+
<div class="dropdown">
74+
<a class="dropdown-toggle" data-bs-toggle="dropdown"></a>
75+
<div class="dropdown-menu">
76+
<li>
77+
<a class="dropdown-item" href="exists">
78+
<span>Dropdown Menu Item</span>
79+
</a>
80+
</li>
81+
</div>
82+
</div>
83+
</ul>`,
84+
{
85+
config: { Plugins: [...MAIN_PLUGINS, MenuDataPlugin] },
86+
}
87+
);
88+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(0);
89+
// selection in dropdown menu
90+
setSelection({ anchorNode: el.querySelector(".dropdown-item > span"), anchorOffset: 0 });
91+
await waitFor(".o-we-linkpopover");
92+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
93+
});
94+
});
95+
96+
describe("MenuDialog", () => {
97+
test("after clicking on edit link button, a MenuDialog should appear", async () => {
98+
const { el } = await setupEditor(
99+
`<ul class="top_menu">
100+
<li>
101+
<a class="nav-link" href="exists">
102+
<span data-oe-id="5">Top Menu Item</span>
103+
</a>
104+
</li>
105+
</ul>`,
106+
{
107+
config: { Plugins: [...MAIN_PLUGINS, MenuDataPlugin] },
108+
}
109+
);
110+
patchWithCleanup(MenuDialog.prototype, {
111+
setup() {
112+
super.setup();
113+
this.website.pageDocument = el.ownerDocument;
114+
},
115+
});
116+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(0);
117+
// open navbar link popover
118+
setSelection({ anchorNode: el.querySelector(".nav-link > span"), anchorOffset: 0 });
119+
await waitFor(".o-we-linkpopover");
120+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
121+
// click the link edit button
122+
await click(".o_we_edit_link");
123+
// check that MenuDialog is open and that name and url have been passed correctly
124+
await waitFor(".o_website_dialog");
125+
expect("input.form-control:not(#url_input)").toHaveValue("Top Menu Item");
126+
expect("#url_input").toHaveValue("exists");
127+
});
128+
});
129+
130+
describe("EditMenuDialog", () => {
131+
test("after clicking on edit menu button, an EditMenuDialog should appear", async () => {
132+
onRpc(({ method, model, args, kwargs }) => {
133+
expect(model).toBe("website.menu");
134+
expect(method).toBe("get_tree");
135+
expect(args[0]).toBe(1);
136+
return {
137+
fields: {
138+
id: 4,
139+
name: "Top Menu",
140+
url: "#",
141+
new_window: false,
142+
is_mega_menu: false,
143+
sequence: 0,
144+
parent_id: false,
145+
},
146+
children: [
147+
{
148+
fields: {
149+
id: 5,
150+
name: "Top Menu Item",
151+
url: "exists",
152+
new_window: false,
153+
is_mega_menu: false,
154+
sequence: 10,
155+
parent_id: 4,
156+
},
157+
children: [],
158+
is_homepage: true,
159+
},
160+
],
161+
is_homepage: false,
162+
};
163+
});
164+
const { el } = await setupEditor(
165+
`<ul class="top_menu">
166+
<li>
167+
<a class="nav-link" href="exists">
168+
<span>Top Menu Item</span>
169+
</a>
170+
</li>
171+
</ul>`,
172+
{
173+
config: { Plugins: [...MAIN_PLUGINS, MenuDataPlugin] },
174+
}
175+
);
176+
mockService("website", {
177+
get currentWebsite() {
178+
return {
179+
id: 1,
180+
metadata: {
181+
lang: "en_EN",
182+
},
183+
};
184+
},
185+
});
186+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(0);
187+
// open navbar link popover
188+
setSelection({ anchorNode: el.querySelector(".nav-link > span"), anchorOffset: 0 });
189+
await waitFor(".o-we-linkpopover");
190+
expect(".o-we-linkpopover:has(i.fa-sitemap)").toHaveCount(1);
191+
// click on edit menu button
192+
await click(".js_edit_menu");
193+
// check that EditMenuDialog is open with correct values
194+
await waitFor(".o_website_dialog");
195+
expect(".oe_menu_editor").toHaveCount(1);
196+
expect(".js_menu_label").toHaveText("Top Menu Item");
197+
});
198+
});

0 commit comments

Comments
 (0)