pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] web_editor: adapt wysiwyg tests to older summernote version

Browse Source 
These modifications crystalize the behavior of the old editor, even
if it makes less sense than the behavior of the saas-12.2 one.

In some cases, the only reasonable adaptation we could do for 13.0
was to delete the tests, as these tests relied on mechanisms of
the newer version of summernote introduced in saas-12.2 which
cannot be easily replicated in the older version from 12.0 that
we are reintroducing in this PR.

It is sad to see these tests go, but we knew this was going to be
something we would lose in reverting back to the older editor.

That being said, since these tests were not present back in 12.0,
we are simply back to the 12.0 state of things, not worse. Don't
weep for them though, they will be back in Odoo 14.

Part of PR 35677.

Co-authored-by: Nicolas Bayet <nby@odoo.com>
Co-authored-by: Antoine Guenet <age@odoo.com>
Co-authored-by: Christophe Matthieu <chm@odoo.com>
Co-authored-by: David Monjoie <dmo@odoo.com>
This commit is contained in:
Gorash
2019-08-21 19:11:31 +00:00
committed by David Monjoie
co-authored by Nicolas Bayet Antoine Guenet David Monjoie
parent 912996fe90
commit 1eb1c2b029
6 changed files with 15 additions and 9576 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mass_mailing/static/tests/mass_mailing_html_tests.js
+1 -87
View File
@@ -64,7 +64,7 @@ QUnit.module('field html', {
}, function () {
QUnit.test('save arch and html', async function (assert) {
assert.expect(6);
assert.expect(4);
var form = await testUtils.createView({
View: FormView,
@@ -85,19 +85,6 @@ QUnit.test('save arch and html', async function (assert) {
' />'+
'</form>',
res_id: 1,
mockRPC: function (route, args) {
if (args.method === "write") {
var values = args.args[1];
assert.strictEqual(values.body_html,
'<div class="field_body" style="background-color:red;"><p>c<b>od</b>e to edit</p></div>',
"should save the content");
assert.strictEqual(values.body_arch,
'<div class="field_body"><p>c<b>od</b>e to edit</p></div>',
"should save the content");
}
return this._super.apply(this, arguments);
},
});
var $fieldReadonly = form.$('.oe_form_field[name="body_html"]');
var $fieldEdit = form.$('.oe_form_field[name="body_arch"]');
@@ -113,79 +100,6 @@ QUnit.test('save arch and html', async function (assert) {
assert.strictEqual($fieldReadonly.css('display'), 'none', "should hide the readonly mode");
assert.strictEqual($fieldEdit.css('display'), 'block', "should display the edit mode");
var $iframe = $fieldEdit.find('iframe');
await testUtils.nextTick();
await $iframe.data('loadDef');
await testUtils.nextTick();
var doc = $iframe.contents()[0];
var $content = $('#iframe_target', doc);
// select the text
var pText = $content.find('.note-editable p').first().contents()[0];
Wysiwyg.setRange(pText, 1, pText, 3);
// text is selected
await testUtils.nextTick();
await testUtils.dom.triggerEvents($content.find('.note-toolbar .note-font .note-btn-bold'),['mousedown','click']);
await testUtils.dom.click(form.$buttons.find('.o_form_button_save'));
form.destroy();
});
QUnit.test('save and edit arch wysiwyg', async function (assert) {
assert.expect(4);
testUtils.mock.patch(FieldHtml, {
commitChanges: function () {
assert.step("FieldHtml");
return this._super.apply(this, arguments);
},
});
testUtils.mock.patch(MassMailingFieldHtml, {
commitChanges: function () {
assert.step("MassMailingFieldHtml");
return this._super.apply(this, arguments);
},
});
var form = await testUtils.createView({
View: FormView,
model: 'mailing.mailing',
data: this.data,
arch: '<form>' +
' <header style="min-height:31px;">' +
' <button name="action_put_in_queue" type="object" class="oe_highlight" string="Send Now"/>' +
' </header>' +
' <field name="body_arch" class="oe_edit_only" widget="mass_mailing_html"' +
' options="{' +
' \'snippets\': \'template.assets\',' +
' \'cssEdit\': \'template.assets\',' +
' \'inline-field\': \'body_html\'' +
' }"' +
' />' +
'</form>',
res_id: 1,
intercepts: {
execute_action: function (event) {
event.data.on_success();
},
},
});
await testUtils.dom.click($('[name=action_put_in_queue]'));
await testUtils.form.clickEdit(form);
var $fieldEdit = form.$('.oe_form_field[name="body_arch"]');
var $iframe = $fieldEdit.find('iframe');
await $iframe.data('loadDef');
await testUtils.nextTick();
await testUtils.dom.click($('[name=action_put_in_queue]'));
assert.verifySteps(["MassMailingFieldHtml", "FieldHtml", "MassMailingFieldHtml"]);
testUtils.mock.unpatch(FieldHtml);
testUtils.mock.unpatch(MassMailingFieldHtml);
form.destroy();
});
addons/web_editor/static/tests/field_html_tests.js
+14 -468
View File
@@ -137,14 +137,14 @@ QUnit.module('web_editor', {}, function () {
assert.strictEqual(range.sc, pText,
"should select the text");
$field.find('.note-toolbar .note-bg-color button:first').mousedown().click();
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button:first'));
assert.ok($field.find('.note-bg-color').hasClass('show') && $field.find('.note-bg-color .dropdown-menu').hasClass('show'),
assert.ok($field.find('.note-back-color-preview').hasClass('show'),
"should display the color picker");
$field.find('.note-toolbar .note-bg-color button[data-value="#00FFFF"]').mousedown().click();
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button[data-value="#00FFFF"]'));
assert.ok(!$field.find('.note-bg-color').hasClass('show') && !$field.find('.note-bg-color .dropdown-menu').hasClass('show'),
assert.ok(!$field.find('.note-back-color-preview').hasClass('show'),
"should close the color picker");
assert.strictEqual($field.find('.note-editable').html(),
@@ -167,11 +167,11 @@ QUnit.module('web_editor', {}, function () {
Wysiwyg.setRange(fontContent, 5, pText, 2);
// text is selected
$field.find('.note-toolbar .note-bg-color button:first').mousedown().click();
$field.find('.note-toolbar .note-bg-color button[data-value="bg-gamma"]').mousedown().click();
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button:first'));
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button[data-value="bg-gamma"]'));
assert.strictEqual($field.find('.note-editable').html(),
'<p>t<font style="background-color: rgb(0, 255, 255);">oto t</font><font class="bg-gamma">oto&nbsp;to</font>to</p><p>tata</p>',
'<p>t<font style="background-color: rgb(0, 255, 255);">oto t</font><font style="" class="bg-gamma">oto&nbsp;</font><font class="bg-gamma" style="">to</font>to</p><p>tata</p>',
"should have rendered the field correctly in edit");
form.destroy();
@@ -215,7 +215,7 @@ QUnit.module('web_editor', {}, function () {
var pText = $field.find('.note-editable p').first().contents()[0];
Wysiwyg.setRange(pText, 1);
$field.find('.note-toolbar .note-insert button:has(.fa-file-image-o)').mousedown().click();
await testUtils.dom.click($field.find('.note-toolbar .note-insert button:has(.fa-file-image-o)'));
// load static xml file (dialog, media dialog, unsplash image widget)
await defMediaDialog;
@@ -266,7 +266,7 @@ QUnit.module('web_editor', {}, function () {
var pText = $field.find('.note-editable p').first().contents()[0];
Wysiwyg.setRange(pText, 1);
$field.find('.note-toolbar .note-insert button:has(.fa-file-image-o)').mousedown().click();
await testUtils.dom.click($field.find('.note-toolbar .note-insert button:has(.fa-file-image-o)'));
// load static xml file (dialog, media dialog, unsplash image widget)
await defMediaDialog;
@@ -315,82 +315,8 @@ QUnit.module('web_editor', {}, function () {
Wysiwyg.setRange(pText, 1, pText, 10);
// text is selected
await testUtils.dom.click($field.find('.note-toolbar .note-bg-color button:first').mousedown());
await testUtils.dom.click($field.find('.note-toolbar .note-bg-color button[data-value="bg-gamma"]').mousedown());
await testUtils.form.clickSave(form);
form.destroy();
});
QUnit.module('inline-style');
QUnit.test('convert style to class on edit', async function (assert) {
assert.expect(5);
this.data['note.note'].records[0].body = '<p class="pull-right" style="float: right;">toto ' +
'<img data-class="fa fa-star" data-style="color: red;" src="/web_editor/font_to_img/61445/rgb(255,0,0)/13" style="border-style:none;vertical-align:middle;height: auto; width: auto;">' +
'toto toto</p><p>tata</p>';
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'style-inline\': true}"/>' +
'</form>',
res_id: 1,
mockRPC: function (route, args) {
if (args.method === "write") {
assert.strictEqual(args.args[1].body,
'<p class="pull-right" style="margin:0px;font-size:13px;font-family:&quot;Lucida Grande&quot;, Helvetica, Verdana, Arial, sans-serif;float:right;">' +
'toto ' +
'<img ' +
'data-class="fa fa-star" ' +
'data-style="color: red;" ' +
'style="border-style:none;vertical-align:middle;color: red; height: auto; width: auto;" ' +
'data-src="/web_editor/font_to_img/61445/rgb(255,0,0)/13"' +
'>' +
'toto toto' +
'</p>' +
'<p style="margin:0px;font-size:13px;font-family:&quot;Lucida Grande&quot;, Helvetica, Verdana, Arial, sans-serif;">' +
'tata' +
'</p>',
"should save the content");
}
if (route.indexOf("/web_editor/font_to_img/61445/rgb(") !== -1) {
assert.strictEqual(route,
'/web_editor/font_to_img/61445/rgb(255,0,0)/13',
"should use the image in function of the font and the color");
return Promise.resolve('#');
}
return this._super.apply(this, arguments);
},
});
var $field = form.$('.oe_form_field[name="body"]');
assert.strictEqual($field.children('.o_readonly').html(),
'<p class="pull-right" style="float: right;">' +
'toto ' +
'<img data-class="fa fa-star" data-style="color: red;" ' +
'style="border-style:none;vertical-align:middle;height: auto; width: auto;" ' +
'data-src="/web_editor/font_to_img/61445/rgb(255,0,0)/13">' +
'toto toto' +
'</p>' +
'<p>tata</p>',
"should have rendered a div with correct content in readonly");
await testUtils.form.clickEdit(form);
$field = form.$('.oe_form_field[name="body"]');
assert.strictEqual($field.find('.note-editable').html(),
'<p class="pull-right">' +
'toto ' +
'<span class="fa fa-star o_fake_not_editable" style="color: red;" contenteditable="false"></span>' +
'toto toto' +
'</p>' +
'<p>tata</p>',
"should have rendered the field correctly in edit (remove inline style that used class)");
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button:first'));
await testUtils.dom.click($field.find('.note-toolbar .note-back-color-preview button[data-value="bg-gamma"]'));
await testUtils.form.clickSave(form);
@@ -433,96 +359,10 @@ QUnit.module('web_editor', {}, function () {
form.destroy();
});
QUnit.module('cssEdit');
QUnit.test('rendering with iframe for edit mode', async function (assert) {
assert.expect(4);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'cssEdit\': \'template.assets\'}"/>' +
'</form>',
res_id: 1,
});
var $field = form.$('.oe_form_field[name="body"]');
assert.strictEqual($field.children('.o_readonly').html(),
'<p>toto toto toto</p><p>tata</p>',
"should have rendered a div with correct content in readonly");
await testUtils.form.clickEdit(form);
$field = form.$('.oe_form_field[name="body"]');
var $iframe = $field.find('iframe');
await $iframe.data('loadDef');
var doc = $iframe.contents()[0];
var $content = $('#iframe_target', doc);
await testUtils.nextTick();
assert.strictEqual($content.find('.note-editable').html(),
'<p>toto toto toto</p><p>tata</p>',
"should have rendered a div with correct content in edit mode");
assert.strictEqual(doc.defaultView.getComputedStyle(doc.body).backgroundColor,
'rgb(255, 0, 0)',
"should load the asset css");
$content.find('.note-toolbar .note-bg-color button:first').mousedown().click();
await testUtils.nextTick();
assert.ok($content.find('.note-bg-color').hasClass('show') && $content.find('.note-bg-color .dropdown-menu').hasClass('show'),
"should display toolbar dropdown menu in iframe");
form.destroy();
});
QUnit.test('save immediately before iframe is rendered in edit mode', async function (assert) {
assert.expect(1);
var form = await testUtils.createAsyncView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'cssEdit\': \'template.assets\'}"/>' +
'</form>',
res_id: 1,
});
testUtils.form.clickEdit(form);
await testUtils.nextTick();
testUtils.form.clickSave(form);
await testUtils.nextTick();
assert.ok(true, "No traceback encountered. The wysiwyg was cut while not loaded.");
form.destroy();
});
QUnit.test('save immediately before iframe is rendered in edit mode with style-inline', async function (assert) {
QUnit.test('save immediately before iframe is rendered in edit mode', async function (assert) {
assert.expect(1);
var form = await testUtils.createAsyncView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'cssEdit\': \'template.assets\', \'style-inline\': true}"/>' +
'</form>',
res_id: 1,
});
testUtils.form.clickEdit(form);
await testUtils.nextTick();
testUtils.form.clickSave(form);
await testUtils.nextTick();
assert.ok(true, "No traceback encountered. The wysiwyg was cut while not loaded.");
form.destroy();
});
QUnit.test('use colorpicker and save', async function (assert) {
assert.expect(1);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
@@ -530,268 +370,15 @@ QUnit.test('save immediately before iframe is rendered in edit mode', async func
'<field name="body" widget="html" style="height: 100px" options="{\'cssEdit\': \'template.assets\'}"/>' +
'</form>',
res_id: 1,
mockRPC: function (route, args) {
if (args.method === "write") {
assert.strictEqual(args.args[1].body,
'<p>t<font class="bg-gamma">oto toto&nbsp;</font>toto</p><p>tata</p>',
"should save the content");
}
return this._super.apply(this, arguments);
},
});
await testUtils.form.clickEdit(form);
var $field = form.$('.oe_form_field[name="body"]');
var $iframe = $field.find('iframe');
await $iframe.data('loadDef');
await testUtils.nextTick();
var doc = $iframe.contents()[0];
var $content = $('#iframe_target', doc);
var $editable = $content.find('.note-editable');
// select the text
var pText = $editable.find('p').first().contents()[0];
Wysiwyg.setRange(pText, 1, pText, 10);
// text is selected
await testUtils.dom.click($content.find('.note-toolbar .note-bg-color button:first').mousedown());
await testUtils.dom.click($content.find('.note-toolbar .note-bg-color button[data-value="bg-gamma"]').mousedown());
await testUtils.form.clickSave(form);
await testUtils.nextTick();
assert.ok(true, "No traceback encountered. The wysiwyg was cut while not loaded.");
form.destroy();
});
QUnit.module('wrapper');
// todo add test wrapper
QUnit.module('snippet (without iframe)');
QUnit.test('rendering with snippet panel', async function (assert) {
var done = assert.async();
assert.expect(1);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'snippets\': \'web_editor.snippets\'}"/>' +
'</form>',
res_id: 1,
});
testUtils.mock.intercept(form, "snippets_loaded", function () {
assert.strictEqual(form.$('.oe_form_field #oe_snippets').length, 1,
"should display the snippet panel");
form.destroy();
done();
});
await testUtils.form.clickEdit(form);
});
QUnit.test('drag&drop snippet', async function (assert) {
assert.expect(1);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'snippets\': \'web_editor.snippets\'}"/>' +
'</form>',
res_id: 1,
});
var defSnippets = testUtils.makeTestPromise();
testUtils.mock.intercept(form, "snippets_loaded", function () {
defSnippets.resolve();
});
await testUtils.form.clickEdit(form);
var $field = form.$('.oe_form_field[name="body"]');
var $editable = $field.find('.note-editable');
await defSnippets;
var $hr = $field.find('.oe_snippet_thumbnail:first');
testUtils.dom.dragAndDrop($hr, $editable.find('p'));
assert.strictEqual($editable.data('wysiwyg').getValue().replace(/\s+/g, ' '),
'<div class=\"s_hr pt32 pb32\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>toto toto toto</p><p>tata</p>',
"should drop the snippet");
form.destroy();
});
// todo add test snippet + customize snippet
QUnit.module('snippet & cssEdit');
QUnit.test('rendering with snippet panel', async function (assert) {
var done = assert.async();
assert.expect(1);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'snippets\': \'web_editor.snippets\', \'cssEdit\': \'template.assets\'}"/>' +
'</form>',
res_id: 1,
});
testUtils.mock.intercept(form, "snippets_loaded", function () {
var doc = form.$('iframe').contents()[0];
var $content = $('#iframe_target', doc);
assert.strictEqual($content.find('#oe_snippets').length, 1,
"should display the snippet panel");
form.destroy();
done();
});
await testUtils.form.clickEdit(form);
});
QUnit.test('drag&drop snippet', async function (assert) {
assert.expect(1);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'snippets\': \'web_editor.snippets\', \'cssEdit\': \'template.assets_all_style\'}"/>' +
'</form>',
res_id: 1,
});
var defSnippets = testUtils.makeTestPromise();
testUtils.mock.intercept(form, "snippets_loaded", function () {
defSnippets.resolve();
});
await testUtils.form.clickEdit(form);
await defSnippets;
var doc = form.$('iframe').contents()[0];
var $content = $('#iframe_target', doc);
var $editable = $content.find('.note-editable');
var $hr = $content.find('.oe_snippet_thumbnail:first');
var from = $hr.offset();
var to = $editable.find('p').offset();
$hr.trigger($.Event("mousedown", {
which: 1,
pageX: from.left + 1,
pageY: from.top + 1
}));
$hr.trigger($.Event("mousemove", {
which: 1,
pageX: to.left,
pageY: to.top
}));
$hr.trigger($.Event("mouseup", {
which: 1,
pageX: to.left,
pageY: to.top
}));
assert.strictEqual($editable.data('wysiwyg').getValue().replace(/\s+/g, ' '),
'<div class=\"s_hr pt32 pb32\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>toto toto toto</p><p>tata</p>',
"should drop the snippet");
form.destroy();
});
QUnit.test('drag&drop snippet options', async function (assert) {
var done = assert.async();
assert.expect(6);
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'snippets\': \'web_editor.snippets\', \'cssEdit\': \'template.assets_all_style\'}"/>' +
'</form>',
res_id: 1,
});
var defSnippets = testUtils.makeTestPromise();
testUtils.mock.intercept(form, "snippets_loaded", function () {
defSnippets.resolve();
});
var defActivateSnippet;
testUtils.mock.intercept(form, "snippet_focused", function (e) {
defActivateSnippet.resolve(e.target);
});
await testUtils.form.clickEdit(form);
defSnippets.then(function () {
var doc = form.$('iframe').contents()[0];
var $content = $('#iframe_target', doc);
var $editable = $content.find('.note-editable');
function dropSnippet() {
defActivateSnippet = testUtils.makeTestPromise();
var $hr = $content.find('.oe_snippet_thumbnail:first');
var from = $hr.offset();
var to = $editable.find('p').offset();
$hr.trigger($.Event("mousedown", {
which: 1,
pageX: from.left + 1,
pageY: from.top + 1
}));
$hr.trigger($.Event("mousemove", {
which: 1,
pageX: to.left,
pageY: to.top
}));
$hr.trigger($.Event("mouseup", {
which: 1,
pageX: to.left,
pageY: to.top
}));
}
dropSnippet();
defActivateSnippet.then(function (snippet) {
assert.strictEqual($editable.data('wysiwyg').getValue().replace(/\s+/g, ' '),
'<div class=\"s_hr pt32 pb32 built focus\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>toto toto toto</p><p>tata</p>',
"should drop the snippet");
assert.strictEqual(snippet.$target.index(), 0,
'should show the snippet editor for the first dropped block');
dropSnippet();
defActivateSnippet.then(function (snippet) {
assert.strictEqual($editable.data('wysiwyg').getValue().replace(/\s+/g, ' '),
'<div class=\"s_hr pt32 pb32 built\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> ' +
'</div><div class=\"s_hr pt32 pb32 built focus\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> ' +
'</div><p>toto toto toto</p><p>tata</p>',
"should drop the snippet");
assert.strictEqual(snippet.$target.index(), 1,
'should show the snippet editor for the second dropped block');
assert.strictEqual($('.oe_active .oe_overlay_options .btn:visible', doc).length, 4,
'should show the snippet editor buttons');
defActivateSnippet = testUtils.makeTestPromise();
$editable.find('hr:first').trigger('click');
defActivateSnippet.then(function (snippet) {
assert.strictEqual(snippet.$target.index(), 0,
'should show the snippet editor for the first dropped block');
form.destroy();
done();
});
});
});
});
});
QUnit.module('translation');
QUnit.test('field html translatable', async function (assert) {
@@ -824,47 +411,6 @@ QUnit.test('save immediately before iframe is rendered in edit mode', async func
await testUtils.form.clickEdit(form);
var $button = form.$('.oe_form_field_html .o_field_translate');
assert.strictEqual($button.length, 1, "should have a translate button");
$button.click();
form.destroy();
_t.database.multi_lang = multiLang;
});
QUnit.test('field html translatable in iframe', async function (assert) {
assert.expect(2);
var multiLang = _t.database.multi_lang;
_t.database.multi_lang = true;
this.data['note.note'].fields.body.translate = true;
var form = await testUtils.createView({
View: FormView,
model: 'note.note',
data: this.data,
arch: '<form>' +
'<field name="body" widget="html" style="height: 100px" options="{\'cssEdit\': \'template.assets\'}"/>' +
'</form>',
res_id: 1,
mockRPC: function (route, args) {
if (route === '/web/dataset/call_button' && args.method === 'translate_fields') {
assert.deepEqual(args.args, ['note.note', 1, 'body'], "should call 'call_button' route");
return Promise.resolve();
}
return this._super.apply(this, arguments);
},
});
await testUtils.form.clickEdit(form);
var $field = form.$('.oe_form_field[name="body"]');
var $iframe = $field.find('iframe');
await $iframe.data('loadDef');
await testUtils.nextTick();
var doc = $iframe.contents()[0];
var $content = $('#iframe_target', doc);
var $button = $content.find('.o_field_translate');
assert.strictEqual($button.length, 1, "should have a translate button");
await testUtils.dom.click($button);
form.destroy();
addons/web_editor/static/tests/wysiwyg_keyboard_tests.js
-4423
View File
File diff suppressed because it is too large Load Diff
addons/web_editor/static/tests/wysiwyg_snippets_tests.js
-413
View File
@@ -1,413 +0,0 @@
odoo.define('web_editor.wysiwyg_snippets_tests', function (require) {
"use strict";
var testUtils = require('web.test_utils');
var weTestUtils = require('web_editor.test_utils');
var MediaDialog = require('wysiwyg.widgets.MediaDialog');
QUnit.module('web_editor', {}, function () {
QUnit.module('wysiwyg', {}, function () {
QUnit.module('Snippets', {}, function () {
QUnit.test('drag&drop', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<p>toto toto toto</p><p>tata</p>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
var $hr = wysiwyg.snippets.$('.oe_snippet_thumbnail:first');
testUtils.dom.dragAndDrop($hr, $editable.find('p'));
assert.strictEqual($editable.html().replace(/\s+/g, ' '),
'<p>toto toto toto</p><div class=\"s_hr pt32 pb32\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>tata</p>',
"should drop the snippet");
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
assert.strictEqual($editable.html().replace(/\s+/g, ' '),
'<p>toto toto toto</p><div class=\"s_hr pt32 pb32 built focus\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>tata</p>',
"should build and focus the snippet");
wysiwyg.destroy();
done();
});
});
});
QUnit.test('begin drag&drop must hide popovers', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value:
'<div class="s_hr pt32 pb32"> ' +
'<hr class="s_hr_1px s_hr_solid w-100 mx-auto"> ' +
'<img class="img-fluid o_we_custom_image" data-src="/web_editor/static/src/img/transparent.png"> ' +
'</div>' +
'<h1>test</h1>' +
'<p><b>test</b></p>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
$editable.find('.s_hr img').mousedown().click();
assert.strictEqual($('.note-popover:visible').length, 1, "should display the image popover");
var $hr = wysiwyg.snippets.$('.oe_snippet_thumbnail:first');
testUtils.dom.dragAndDrop($hr, $editable.find('h1'), {
disableDrop: true,
});
assert.strictEqual($('.note-popover:visible').length, 0, "should hide the image popover");
testUtils.dom.dragAndDrop($hr, $editable.find('h1'), {
continueMove: true,
});
wysiwyg.destroy();
done();
});
});
QUnit.test('change size option must hide popovers', function (assert) {
var done = assert.async();
assert.expect(4);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value:
'<div class="s_hr pt32 pb32"> ' +
'<hr class="s_hr_1px s_hr_solid w-100 mx-auto"> ' +
'<img class="img-fluid o_we_custom_image" data-src="/web_editor/static/src/img/transparent.png"> ' +
'</div>' +
'<h1>test</h1>' +
'<p><b>test</b></p>',
},
}).then(async function (wysiwyg) {
var $editable = wysiwyg.getEditable();
await testUtils.dom.click($editable.find('.s_hr img').mousedown());
assert.strictEqual($('.note-popover:visible').length, 1, "should display the image popover");
var $handle = $('#oe_manipulators .o_handle.s');
testUtils.dom.dragAndDrop($handle, $editable.find('b'), {
disableDrop: true,
});
assert.ok($handle.hasClass('o_active'), "should active the handle");
assert.notOk($handle.hasClass('pb32'), "should change the padding bottom");
assert.strictEqual($('.note-popover:visible').length, 0, "should hide the image popover");
await testUtils.dom.dragAndDrop($handle, $editable.find('b'), {
continueMove: true,
});
wysiwyg.destroy();
done();
});
});
QUnit.test('clean the dom before save, after drag&drop', function (assert) {
var done = assert.async();
assert.expect(1);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<p>toto toto toto</p><p>tata</p>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
var $hr = wysiwyg.snippets.$('.oe_snippet_thumbnail:first');
testUtils.dom.dragAndDrop($hr, $editable.find('p'));
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
wysiwyg.save().then(function (result) {
var isDirty = result.isDirty;
var html = result.html;
assert.strictEqual(html.replace(/\s+/g, ' '),
'<p>toto toto toto</p><div class=\"s_hr pt32 pb32 built cleanForSave\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div><p>tata</p>',
"should clean the snippet");
wysiwyg.destroy();
done();
});
});
});
});
QUnit.test('clean the dom before save', function (assert) {
var done = assert.async();
assert.expect(1);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<div class="s_hr pt32 pb32"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
// add dirty flag to remove warning because the cleaned dom is different of the initial value and no dirty flag
$editable.find('.s_hr').keydown();
// trigger change to avoid warning because the DOM change on clean without trigger onchange by snippet or edition
$editable.trigger('content_changed');
wysiwyg.save().then(function (result) {
assert.strictEqual(result.html.replace(/\s+/g, ' '),
'<div class=\"s_hr pt32 pb32 cleanForSave\"> <hr class=\"s_hr_1px s_hr_solid w-100 mx-auto\"> </div>',
"should clean the snippet");
wysiwyg.destroy();
done();
});
});
$editable.find('.s_hr').mousedown().click();
});
});
QUnit.test('remove snippet', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<div class="s_hr pt32 pb32"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
$('.note-btn-bold').removeClass('o_disabled');
$('#oe_manipulators .oe_overlay_options .oe_snippet_remove').click();
assert.ok($('.note-btn-bold').hasClass('o_disabled'));
wysiwyg.save().then(function (result) {
assert.strictEqual(result.html.replace(/\s+/g, ' '), '', "should remove the snippet");
wysiwyg.destroy();
done();
});
});
$editable.find('.s_hr').mousedown().click();
});
});
QUnit.test('move a snippet', function (assert) {
var done = assert.async();
assert.expect(1);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<div class="s_hr pt32 pb32"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><h1>test</h1><p><b>test</b></p>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
var first = true;
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
if (first) {
first = false;
var $hr = $('#oe_manipulators .oe_overlay_options .oe_snippet_move');
testUtils.dom.dragAndDrop($hr, $editable.find('b'));
} else {
wysiwyg.save().then(function (result) {
assert.strictEqual(result.html.replace(/\s+/g, ' '),
'<h1>test</h1><div class="s_hr pt32 pb32 move cleanForSave"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><p><b>test</b></p>',
"should move the snippet on the bottom");
wysiwyg.destroy();
done();
});
}
});
$editable.find('.s_hr').mousedown().click();
});
});
QUnit.test('clone a snippet', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<div class="s_hr pt32 pb32"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><h1>test</h1><p><b>test</b></p>',
},
}).then(async function (wysiwyg) {
var $editable = wysiwyg.getEditable();
testUtils.mock.intercept(wysiwyg, "snippet_focused", async function () {
await testUtils.dom.click($('#oe_manipulators .oe_overlay_options .oe_snippet_clone'));
assert.strictEqual($editable.html().replace(/\s+/g, ' '),
'<div class="s_hr pt32 pb32 focus"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><div class="s_hr pt32 pb32 clone"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><h1>test</h1><p><b>test</b></p>',
"should duplicate the snippet");
wysiwyg.save().then(function (result) {
assert.strictEqual(result.html.replace(/\s+/g, ' '),
'<div class="s_hr pt32 pb32 cleanForSave"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><div class="s_hr pt32 pb32 clone cleanForSave"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><h1>test</h1><p><b>test</b></p>',
"should duplicate the snippet");
wysiwyg.destroy();
done();
});
});
await testUtils.dom.click($editable.find('.s_hr').mousedown());
});
});
QUnit.test('customize snippet', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<h1>test</h1><div class="s_hr pt32 pb32"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><p><b>test</b></p>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
$('#oe_manipulators .oe_overlay_options .oe_options a:first').click();
var $option = $('#oe_manipulators .oe_overlay_options a[data-select-class="align-items-center"]');
// assert.strictEqual($option.size(), 1, "should display the snippet option");
$option.click();
assert.strictEqual($editable.html().replace(/\s+/g, ' '),
'<h1>test</h1><div class="s_hr pt32 pb32 focus align-items-center"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><p><b>test</b></p>',
"should customized the snippet");
$('#oe_manipulators .oe_overlay_options .oe_options a:first').click();
$('#oe_manipulators .oe_overlay_options a[data-select-class="align-items-end"]').click();
assert.strictEqual($editable.html().replace(/\s+/g, ' '),
'<h1>test</h1><div class="s_hr pt32 pb32 focus align-items-end"> <hr class="s_hr_1px s_hr_solid w-100 mx-auto"> </div><p><b>test</b></p>',
"should twice customized the snippet");
wysiwyg.destroy();
done();
});
$editable.find('.s_hr').mousedown().click();
});
});
QUnit.test('background-image', function (assert) {
var done = assert.async();
assert.expect(2);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value:
'<h1>Big Title</h1>' +
'<section class="test_option_all pt32 pb32">' +
' <div class="container">' +
' <div class="row">' +
' <div class="col-lg-10 offset-lg-1 pt32 pb32">' +
' <h2>Title</h2>' +
' <p class="lead o_default_snippet_text">Content</p>' +
' </div>' +
' </div>' +
' </div>' +
'</section>',
},
mockRPC: function (route, args) {
if (route.indexOf('/web_editor/static/src/img/') === 0) {
return Promise.resolve();
}
return this._super(route, args);
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
var defMediaDialogInit = testUtils.makeTestPromise();
var defMediaDialogSave = testUtils.makeTestPromise();
testUtils.mock.patch(MediaDialog, {
init: function () {
this._super.apply(this, arguments);
this.opened(defMediaDialogInit.resolve.bind(defMediaDialogInit));
},
save: function () {
Promise.resolve(this._super.apply(this, arguments)).then(function () {
defMediaDialogSave.resolve();
});
},
});
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
$('#oe_manipulators .oe_overlay_options .oe_options a:first').click();
$('#oe_manipulators .oe_overlay_options a.snippet-option-background[data-choose-image]').click();
defMediaDialogInit.then(function () {
$('.o_select_media_dialog .o_we_existing_attachments .o_existing_attachment_cell').click();
$('.o_select_media_dialog .modal-footer .btn-primary').click();
});
defMediaDialogSave.then(function () {
var $snippet = $editable.find('.test_option_all');
assert.ok($snippet.hasClass('oe_custom_bg'), "should use custom background");
var background = $snippet.css('background-image') || '';
assert.strictEqual(background.replace(/[^(\("'\/]+\/\/[^\("'\/]+/, ''),
'url("/web_editor/static/src/img/transparent.png")',
"should change the background image");
testUtils.mock.unpatch(MediaDialog);
wysiwyg.destroy();
done();
});
});
$editable.find('h2').mousedown().click();
});
});
QUnit.test('update content', function (assert) {
var done = assert.async();
assert.expect(1);
return weTestUtils.createWysiwyg({
wysiwygOptions: {
snippets: true,
value: '<div class="s_hr pt32 pb32"> ' +
'<img class="img-fluid o_we_custom_image test_option_all" data-src="/web_editor/static/src/img/transparent.png"> ' +
'</div>',
},
}).then(function (wysiwyg) {
var $editable = wysiwyg.getEditable();
testUtils.mock.intercept(wysiwyg, "snippet_focused", function () {
var $snippetOption = $('#oe_manipulators .oe_overlay_options:visible');
wysiwyg.$el.siblings('.note-image-popover').find('.note-media .note-icon-trash').mousedown().click();
assert.ok($snippetOption.is(':hidden'), "should remove the snippet editor because the target are removed");
wysiwyg.destroy();
done();
});
$editable.find('img').mousedown().click();
});
});
});
});
});
});
addons/web_editor/static/tests/wysiwyg_tests.js
-4182
View File
File diff suppressed because it is too large Load Diff
addons/web_editor/views/editor.xml
-3
View File
@@ -183,9 +183,6 @@
<script type="text/javascript" src="/web_editor/static/tests/test_utils.js"/>
<script type="text/javascript" src="/web_editor/static/tests/field_html_tests.js"/>
<script type="text/javascript" src="/web_editor/static/tests/wysiwyg_tests.js"/>
<script type="text/javascript" src="/web_editor/static/tests/wysiwyg_keyboard_tests.js"/>
<script type="text/javascript" src="/web_editor/static/tests/wysiwyg_snippets_tests.js"/>
</xpath>
</template>