[FIX] test_website, web_editor: adapt tests to new dialog
See merge commit for more information. task-2687506
This commit is contained in:
@@ -122,9 +122,6 @@
|
||||
<field name="key">test_website.test_image_progress</field>
|
||||
<field name="arch" type="xml">
|
||||
<t t-call="website.layout">
|
||||
<t t-set="head">
|
||||
<script defer="defer" type="text/javascript" src="/test_website/static/src/js/mock_image_widget.js"></script>
|
||||
</t>
|
||||
<div id="wrap" class="oe_structure oe_empty"/>
|
||||
</t>
|
||||
</field>
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
odoo.define('test_website.mock_image_widgets', function (require) {
|
||||
'use strict';
|
||||
|
||||
const widgetsMedia = require('wysiwyg.widgets.media');
|
||||
|
||||
widgetsMedia.FileWidget.include({
|
||||
|
||||
//--------------------------------------------------------------------------
|
||||
// Private
|
||||
//--------------------------------------------------------------------------
|
||||
|
||||
_onFileInputChange: function () {
|
||||
function getFileFromB64(fileData) {
|
||||
const binary = atob(fileData[2]);
|
||||
let len = binary.length;
|
||||
const arr = new Uint8Array(len);
|
||||
while (len--) {
|
||||
arr[len] = binary.charCodeAt(len);
|
||||
}
|
||||
return new File([arr], fileData[1], {type: fileData[0]});
|
||||
}
|
||||
|
||||
let files = [
|
||||
getFileFromB64(['image/png', 'image.png', "iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAApElEQVR42u3RAQ0AAAjDMO5fNCCDkC5z0HTVrisFCBABASIgQAQEiIAAAQJEQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAQECBAgAgJEQIAIyPcGFY7HnV2aPXoAAAAASUVORK5CYII="]),
|
||||
getFileFromB64(['image/jpeg', 'image.jpeg', "/9j/4AAQSkZJRgABAQAAAQABAAD//gAfQ29tcHJlc3NlZCBieSBqcGVnLXJlY29tcHJlc3P/2wCEAA0NDQ0ODQ4QEA4UFhMWFB4bGRkbHi0gIiAiIC1EKjIqKjIqRDxJOzc7STxsVUtLVWx9aWNpfZeHh5e+tb75+f8BDQ0NDQ4NDhAQDhQWExYUHhsZGRseLSAiICIgLUQqMioqMipEPEk7NztJPGxVS0tVbH1pY2l9l4eHl761vvn5///CABEIAEsASwMBIgACEQEDEQH/xAAVAAEBAAAAAAAAAAAAAAAAAAAABv/aAAgBAQAAAACHAAAAAAAAAAAAAAAAH//EABUBAQEAAAAAAAAAAAAAAAAAAAAH/9oACAECEAAAAKYAAAB//8QAFQEBAQAAAAAAAAAAAAAAAAAAAAX/2gAIAQMQAAAAngAAAf/EABQQAQAAAAAAAAAAAAAAAAAAAGD/2gAIAQEAAT8ASf/EABQRAQAAAAAAAAAAAAAAAAAAAED/2gAIAQIBAT8AT//EABQRAQAAAAAAAAAAAAAAAAAAAED/2gAIAQMBAT8AT//Z"]),
|
||||
getFileFromB64(['image/vnd.microsoft.icon', 'icon.ico', "AAABAAEAAQEAAAEAIAAwAAAAFgAAACgAAAABAAAAAgAAAAEAIAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAAA=="]),
|
||||
getFileFromB64(['image/webp', 'image.webp', "UklGRhwAAABXRUJQVlA4TBAAAAAvE8AEAAfQhuh//wMR0f8A"]),
|
||||
];
|
||||
|
||||
if (!this.options.multiImages) {
|
||||
if (this.media.classList.contains('o_mock_show_error')) {
|
||||
files = [files[2]];
|
||||
} else {
|
||||
files = [files[0]];
|
||||
}
|
||||
}
|
||||
this.$fileInput = [{'files': files}];
|
||||
return this._super(...arguments);
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -3,34 +3,76 @@ odoo.define('test_website.image_upload_progress', function (require) {
|
||||
|
||||
const tour = require('web_tour.tour');
|
||||
|
||||
const { FileSelectorControlPanel } = require('@web_editor/components/media_dialog/file_selector');
|
||||
const { patch, unpatch } = require('web.utils');
|
||||
|
||||
let patchWithError = false;
|
||||
const patchMediaDialog = () => patch(FileSelectorControlPanel.prototype, 'test_website.mock_image_widgets', {
|
||||
async onChangeFileInput() {
|
||||
const getFileFromB64 = (fileData) => {
|
||||
const binary = atob(fileData[2]);
|
||||
let len = binary.length;
|
||||
const arr = new Uint8Array(len);
|
||||
while (len--) {
|
||||
arr[len] = binary.charCodeAt(len);
|
||||
}
|
||||
return new File([arr], fileData[1], {type: fileData[0]});
|
||||
};
|
||||
|
||||
let files = [
|
||||
getFileFromB64(['image/vnd.microsoft.icon', 'icon.ico', "AAABAAEAAQEAAAEAIAAwAAAAFgAAACgAAAABAAAAAgAAAAEAIAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAAA=="]),
|
||||
getFileFromB64(['image/webp', 'image.webp', "UklGRhwAAABXRUJQVlA4TBAAAAAvE8AEAAfQhuh//wMR0f8A"]),
|
||||
getFileFromB64(['image/png', 'image.png', "iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAApElEQVR42u3RAQ0AAAjDMO5fNCCDkC5z0HTVrisFCBABASIgQAQEiIAAAQJEQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAREQIAICBABASIgQAQECBAgAgJEQIAIyPcGFY7HnV2aPXoAAAAASUVORK5CYII="]),
|
||||
getFileFromB64(['image/jpeg', 'image.jpeg', "/9j/4AAQSkZJRgABAQAAAQABAAD//gAfQ29tcHJlc3NlZCBieSBqcGVnLXJlY29tcHJlc3P/2wCEAA0NDQ0ODQ4QEA4UFhMWFB4bGRkbHi0gIiAiIC1EKjIqKjIqRDxJOzc7STxsVUtLVWx9aWNpfZeHh5e+tb75+f8BDQ0NDQ4NDhAQDhQWExYUHhsZGRseLSAiICIgLUQqMioqMipEPEk7NztJPGxVS0tVbH1pY2l9l4eHl761vvn5///CABEIAEsASwMBIgACEQEDEQH/xAAVAAEBAAAAAAAAAAAAAAAAAAAABv/aAAgBAQAAAACHAAAAAAAAAAAAAAAAH//EABUBAQEAAAAAAAAAAAAAAAAAAAAH/9oACAECEAAAAKYAAAB//8QAFQEBAQAAAAAAAAAAAAAAAAAAAAX/2gAIAQMQAAAAngAAAf/EABQQAQAAAAAAAAAAAAAAAAAAAGD/2gAIAQEAAT8ASf/EABQRAQAAAAAAAAAAAAAAAAAAAED/2gAIAQIBAT8AT//EABQRAQAAAAAAAAAAAAAAAAAAAED/2gAIAQMBAT8AT//Z"]),
|
||||
];
|
||||
|
||||
if (!this.props.multiImages) {
|
||||
if (patchWithError) {
|
||||
files = [files[0]];
|
||||
} else {
|
||||
files = [files[2]];
|
||||
}
|
||||
}
|
||||
await this.props.uploadFiles(files);
|
||||
}
|
||||
});
|
||||
|
||||
const unpatchMediaDialog = () => unpatch(FileSelectorControlPanel.prototype, 'test_website.mock_image_widgets');
|
||||
|
||||
const setupSteps = [{
|
||||
content: "reload to load patch",
|
||||
trigger: ".o_website_preview",
|
||||
run: () => {
|
||||
patchMediaDialog();
|
||||
},
|
||||
}, {
|
||||
content: "enter edit mode",
|
||||
trigger: "a[data-action=edit]"
|
||||
trigger: ".o_edit_website_container a"
|
||||
}, {
|
||||
content: "drop a snippet",
|
||||
trigger: "#oe_snippets .oe_snippet[name='Text - Image'] .oe_snippet_thumbnail:not(.o_we_already_dragging)",
|
||||
extra_trigger: "body.editor_enable.editor_has_snippets",
|
||||
moveTrigger: ".oe_drop_zone",
|
||||
run: "drag_and_drop #wrap",
|
||||
extra_trigger: "body.editor_has_snippets",
|
||||
moveTrigger: "iframe .oe_drop_zone",
|
||||
run: "drag_and_drop iframe #wrap",
|
||||
}, {
|
||||
content: "drop a snippet",
|
||||
trigger: "#oe_snippets .oe_snippet[name='Image Gallery'] .oe_snippet_thumbnail:not(.o_we_already_dragging)",
|
||||
extra_trigger: "body.editor_enable.editor_has_snippets",
|
||||
extra_trigger: "body.editor_has_snippets",
|
||||
moveTrigger: ".oe_drop_zone",
|
||||
run: "drag_and_drop #wrap",
|
||||
run: "drag_and_drop iframe #wrap",
|
||||
}];
|
||||
|
||||
const formatErrorMsg = "format is not supported. Try with: .gif, .jpe, .jpeg, .jpg, .png, .svg";
|
||||
|
||||
tour.register('test_image_upload_progress', {
|
||||
url: '/test_image_progress',
|
||||
url: `/web#action=website.website_preview&path=${encodeURI('/test_image_progress')}`,
|
||||
test: true
|
||||
}, [
|
||||
...setupSteps,
|
||||
// 1. Check multi image upload
|
||||
{
|
||||
content: "click on dropped snippet",
|
||||
trigger: "#wrap .s_image_gallery .img",
|
||||
trigger: "iframe #wrap .s_image_gallery .img",
|
||||
}, {
|
||||
content: "click on add images to open image dialog (in multi mode)",
|
||||
trigger: 'we-customizeblock-option [data-add-images]',
|
||||
@@ -38,11 +80,9 @@ tour.register('test_image_upload_progress', {
|
||||
content: "manually trigger input change",
|
||||
trigger: ".o_select_media_dialog .o_upload_media_button",
|
||||
run: () => {
|
||||
const fileInput = $('.o_select_media_dialog .o_file_input').first();
|
||||
// This will trigger upload of dummy files for test purpose, as a
|
||||
// test can't select local files to upload into the input.
|
||||
// See `mock_image_widgets`.
|
||||
fileInput.change();
|
||||
document.body.querySelector('.o_select_media_dialog .o_file_input').dispatchEvent(new Event('change'));
|
||||
},
|
||||
}, {
|
||||
content: "check upload progress bar is correctly shown (1)",
|
||||
@@ -85,20 +125,17 @@ tour.register('test_image_upload_progress', {
|
||||
// 2. Check success single image upload
|
||||
{
|
||||
content: "click on dropped snippet",
|
||||
trigger: "#wrap .s_text_image .img",
|
||||
trigger: "iframe #wrap .s_text_image .img",
|
||||
}, {
|
||||
content: "click on replace media to open image dialog",
|
||||
trigger: 'we-customizeblock-option [data-replace-media]',
|
||||
}, {
|
||||
content: "manually trigger input change",
|
||||
trigger: ".o_select_media_dialog .o_upload_media_button",
|
||||
in_modal: false,
|
||||
run: () => {
|
||||
const fileInput = $('.o_select_media_dialog .o_file_input').first();
|
||||
// This will trigger upload of dummy files for test purpose, as a
|
||||
// test can't select local files to upload into the input.
|
||||
// See `mock_image_widgets`.
|
||||
fileInput.change();
|
||||
document.body.querySelector('.o_select_media_dialog .o_file_input').dispatchEvent(new Event('change'));
|
||||
},
|
||||
}, {
|
||||
content: "check upload progress bar is correctly shown",
|
||||
@@ -126,7 +163,7 @@ tour.register('test_image_upload_progress', {
|
||||
// 3. Check error single image upload
|
||||
{
|
||||
content: "click on dropped snippet",
|
||||
trigger: "#wrap .s_text_image .img",
|
||||
trigger: "iframe #wrap .s_text_image .img",
|
||||
}, {
|
||||
content: "click on replace media to open image dialog",
|
||||
trigger: 'we-customizeblock-option [data-replace-media]',
|
||||
@@ -135,18 +172,19 @@ tour.register('test_image_upload_progress', {
|
||||
trigger: ".o_select_media_dialog .o_upload_media_button",
|
||||
in_modal: false,
|
||||
run: () => {
|
||||
$("#wrap .s_text_image .img").addClass('o_mock_show_error');
|
||||
const fileInput = $('.o_select_media_dialog .o_file_input').first();
|
||||
patchWithError = true;
|
||||
// This will trigger upload of dummy files for test purpose, as a
|
||||
// test can't select local files to upload into the input.
|
||||
// See `mock_image_widgets`.
|
||||
fileInput.change();
|
||||
document.body.querySelector('.o_select_media_dialog .o_file_input').dispatchEvent(new Event('change'));
|
||||
|
||||
},
|
||||
}, {
|
||||
content: "check upload progress bar is correctly shown",
|
||||
trigger: `.o_we_progressbar:contains('icon.ico'):contains('${formatErrorMsg}')`,
|
||||
in_modal: false,
|
||||
run: function () {}, // it's a check
|
||||
run: function () {
|
||||
patchWithError = false;
|
||||
},
|
||||
}, {
|
||||
content: "there should only have one notification toaster",
|
||||
trigger: ".o_notification",
|
||||
@@ -156,20 +194,21 @@ tour.register('test_image_upload_progress', {
|
||||
if (notificationCount !== 1) {
|
||||
console.error("There should be one noficiation toaster opened, and only one.");
|
||||
}
|
||||
unpatchMediaDialog();
|
||||
}
|
||||
},
|
||||
]);
|
||||
|
||||
|
||||
tour.register('test_image_upload_progress_unsplash', {
|
||||
url: '/test_image_progress',
|
||||
url: `/web#action=website.website_preview&path=${encodeURI('/test_image_progress')}`,
|
||||
test: true
|
||||
}, [
|
||||
...setupSteps,
|
||||
// 1. Check multi image upload
|
||||
{
|
||||
content: "click on dropped snippet",
|
||||
trigger: "#wrap .s_image_gallery .img",
|
||||
trigger: "iframe #wrap .s_image_gallery .img",
|
||||
}, {
|
||||
content: "click on replace media to open image dialog",
|
||||
trigger: 'we-customizeblock-option [data-replace-media]',
|
||||
@@ -179,7 +218,7 @@ tour.register('test_image_upload_progress_unsplash', {
|
||||
run: "text fox",
|
||||
}, {
|
||||
content: "click on unsplash result", // note that unsplash is mocked
|
||||
trigger: ".o_unsplash_attachment_cell"
|
||||
trigger: "img[alt~=fox]"
|
||||
}, {
|
||||
content: "check that the upload progress bar is correctly shown",
|
||||
// ensure it is there so we are sure next step actually test something
|
||||
@@ -193,7 +232,10 @@ tour.register('test_image_upload_progress_unsplash', {
|
||||
in_modal: false,
|
||||
}, {
|
||||
content: "unsplash image (mocked to logo) should have been used",
|
||||
trigger: "#wrap .s_image_gallery .img[data-original-src^='/unsplash/HQqIOc8oYro/fox']",
|
||||
trigger: "iframe #wrap .s_image_gallery .img[data-original-src^='/unsplash/HQqIOc8oYro/fox']",
|
||||
run: () => {
|
||||
unpatchMediaDialog();
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
|
||||
@@ -13,7 +13,7 @@ from odoo import http
|
||||
class TestImageUploadProgress(odoo.tests.HttpCase):
|
||||
|
||||
def test_01_image_upload_progress(self):
|
||||
self.start_tour("/test_image_progress", 'test_image_upload_progress', login="admin")
|
||||
self.start_tour("/web", 'test_image_upload_progress', login="admin")
|
||||
|
||||
def test_02_image_upload_progress_unsplash(self):
|
||||
BASE_URL = self.base_url()
|
||||
@@ -53,4 +53,4 @@ class TestImageUploadProgress(odoo.tests.HttpCase):
|
||||
media_library_search.routing_type = 'json'
|
||||
Web_Editor.media_library_search = http.route(['/web_editor/media_library_search'], type='json', auth="user", website=True)(media_library_search)
|
||||
|
||||
self.start_tour("/", 'test_image_upload_progress_unsplash', login="admin")
|
||||
self.start_tour("/web", 'test_image_upload_progress_unsplash', login="admin")
|
||||
|
||||
@@ -79,6 +79,7 @@ export class MediaDialog extends Dialog {
|
||||
resModel: this.props.resModel,
|
||||
resId: this.props.resId,
|
||||
media: this.props.media,
|
||||
multiImages: this.props.multiImages,
|
||||
selectedMedia: this.selectedMedia,
|
||||
selectMedia: (...args) => this.selectMedia(...args, tab.id, additionalProps.multiSelect),
|
||||
save: this.save.bind(this),
|
||||
|
||||
@@ -9,8 +9,6 @@ var ImageCropWidget = require('wysiwyg.widgets.ImageCropWidget');
|
||||
const LinkPopoverWidget = require('@web_editor/js/wysiwyg/widgets/link_popover_widget')[Symbol.for("default")];
|
||||
const {ColorpickerDialog} = require('web.Colorpicker');
|
||||
|
||||
var media = require('wysiwyg.widgets.media');
|
||||
|
||||
return {
|
||||
Dialog: Dialog,
|
||||
AltDialog: AltDialog,
|
||||
@@ -19,13 +17,5 @@ return {
|
||||
ImageCropWidget: ImageCropWidget,
|
||||
LinkPopoverWidget: LinkPopoverWidget,
|
||||
ColorpickerDialog: ColorpickerDialog,
|
||||
|
||||
MediaWidget: media.MediaWidget,
|
||||
SearchableMediaWidget: media.SearchableMediaWidget,
|
||||
FileWidget: media.FileWidget,
|
||||
ImageWidget: media.ImageWidget,
|
||||
DocumentWidget: media.DocumentWidget,
|
||||
IconWidget: media.IconWidget,
|
||||
VideoWidget: media.VideoWidget,
|
||||
};
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user