1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
|
/** @odoo-module */
import {
changeOption,
insertSnippet,
goBackToBlocks,
registerWebsitePreviewTour,
} from "@website/js/tours/tour_utils";
const snippets = [
{
id: "s_popup",
name: "Popup",
groupName: "Content",
},
{
id: "s_media_list",
name: "Media List",
groupName: "Content",
},
];
const checkScrollbar = function (hasScrollbar) {
return {
content: `Check that the page ${hasScrollbar ? "has" : "does not have"} a vertical scrollbar.`,
trigger: `:iframe ${hasScrollbar ? "body:not(.modal-open)" : "body.modal-open"}`,
run: function () {
const style = window.getComputedStyle(this.anchor);
if (!hasScrollbar && (style.overflow !== "hidden" || parseFloat(style.paddingRight) < 1)) {
console.error("error The vertical scrollbar should be hidden");
} else if (hasScrollbar && (style.overflow === "hidden" || parseFloat(style.paddingRight) > 0)) {
console.error("error The vertical scrollbar should be displayed");
}
},
};
};
const toggleBackdrop = function () {
return changeOption('SnippetPopup', 'we-button[data-name="popup_backdrop_opt"] we-checkbox', 'backdrop');
};
registerWebsitePreviewTour("snippet_popup_and_scrollbar", {
url: "/",
edition: true,
}, () => [
...insertSnippet(snippets[1]), // Media List
...insertSnippet(snippets[0]), // Popup
checkScrollbar(false),
{
content: 'Click on the s_popup snippet',
trigger: ':iframe .s_popup .modal',
run: "click",
},
toggleBackdrop(), // hide Popup backdrop
checkScrollbar(true),
goBackToBlocks(),
{
content: "Drag the Content snippet group and drop it at the bottom of the popup.",
trigger: '#oe_snippets .oe_snippet[name="Content"] .oe_snippet_thumbnail:not(.o_we_ongoing_insertion)',
run: "drag_and_drop :iframe #wrap .s_popup .oe_drop_zone:last",
},
{
content: "Click on the s_media_list snippet.",
trigger: ':iframe .o_snippet_preview_wrap[data-snippet-id="s_media_list"]',
run: "click",
},
checkScrollbar(false),
{
content: "Select the Media List snippet in the Popup.",
trigger: ":iframe #wrap .s_popup .modal-content .s_media_list",
run: "click",
},
{
content: "Remove the Media List snippet in the Popup.",
trigger: ":iframe .oe_overlay.oe_active .oe_snippet_remove",
run: "click",
},
checkScrollbar(true),
toggleBackdrop(), // show Popup backdrop
checkScrollbar(false),
{
content: "Close the Popup that has now backdrop.",
trigger: ".o_we_invisible_el_panel .o_we_invisible_entry:first",
run: "click",
},
checkScrollbar(true),
{
content: "Open the Cookies Bar.",
trigger: ".o_we_invisible_el_panel .o_we_invisible_entry:last",
run: "click",
},
checkScrollbar(true),
toggleBackdrop(), // show Cookies Bar backdrop
checkScrollbar(false),
toggleBackdrop(), // hide Cookies Bar backdrop
checkScrollbar(true),
{
content: "Open the Popup that has backdrop.",
trigger: ".o_we_invisible_el_panel .o_we_invisible_entry:first",
run: "click",
},
/* task-4185877
checkScrollbar(false),
*/
goBackToBlocks(),
{
content: "Drag the Content snippet group and drop it at the bottom of the popup.",
trigger: '#oe_snippets .oe_snippet[name="Content"] .oe_snippet_thumbnail:not(.o_we_ongoing_insertion)',
run: "drag_and_drop :iframe #wrap .s_popup .oe_drop_zone:last",
},
{
content: "Click on the s_media_list snippet.",
trigger: ':iframe .o_snippet_preview_wrap[data-snippet-id="s_media_list"]',
run: "click",
},
/* task-4185877
checkScrollbar(true), // The popup backdrop is activated so there should be a scrollbar
*/
{
content: 'Click on the s_popup snippet',
trigger: ':iframe .s_popup .modal',
run: "click",
},
{
content: "Remove the s_popup snippet",
trigger: ".o_we_customize_panel we-customizeblock-options:contains('Popup') we-button.oe_snippet_remove:first",
async run(helpers) {
await helpers.click();
// TODO: remove the below setTimeout. Without it, goBackToBlocks() not works.
await new Promise((r) => setTimeout(r, 1000));
}
},
checkScrollbar(true),
goBackToBlocks(),
{
content: "Drag the Content snippet group and drop it in the Cookies Bar.",
trigger: '#oe_snippets .oe_snippet[name="Content"] .oe_snippet_thumbnail:not(.o_we_ongoing_insertion)',
run: "drag_and_drop :iframe #website_cookies_bar .modal-content.oe_structure",
},
{
content: "Click on the s_media_list snippet.",
trigger: ':iframe .o_snippet_preview_wrap[data-snippet-id="s_media_list"]',
run: "click",
},
{
content: "Select the Media List snippet in the Cookies Bar.",
trigger: ":iframe #website_cookies_bar .modal-content .s_media_list",
run: "click",
},
{
content: "Duplicate the Media List snippet",
trigger: ".o_we_customize_panel we-customizeblock-options:contains('Media List') we-button.oe_snippet_clone:first",
run() {
// TODO: use run: "click", instead
this.anchor.click();
}
},
checkScrollbar(false),
{
content: "Remove the first Media List snippet in the Cookies Bar.",
trigger: ":iframe .oe_overlay.oe_active .oe_snippet_remove",
run: "click",
},
{
content: "Remove the second Media List snippet in the Cookies Bar.",
trigger: ":iframe .oe_overlay.oe_active .oe_snippet_remove",
run: "click",
},
checkScrollbar(true),
]);
|
