If we applied a link eg. on:
```
<span>hello <b>world</b></span>
```
The system actually gets the "label": hello worldworld because there is
3 nodes:
text node: hello
element node: `<b>world</b>`
text node: world
Also since "hello worldworld" is different than "hello world",
instead of just keeping existing nodes and adding the link, the system
would replace the selected range by:
`<span><a>hello worldworld</a></span>'
instead of:
`<span><a>hello </a><b><a>world</a></b></span>`
This commit ignores element nodes when creating a new link, since when
getting the label of the link from the selection, only the text nodes
insides the element nodes have any interest.
There was a second issue because if we had:
```
<i><a href="hello">world</a></i>!
```
and tried to put a link over "world!", the code would decide: "world" is
inside a link so we will just update that link.
Thus we would get:
```
<i><a href="hello">world!</a></i>!
```
instead of:
```
<i><a href="hello">world</a></i><a href="hello">!</a>
```
opw-1848351
closes#25187
When a t-field element was in an editable t-ignore environement,
modifying it was leaving the edit mode style attached to it. This
was because of:
1) When the t-field element was changed, it was marked dirty but
also its parent editable container. Fixing this, only solves
the case where only the t-field (and not one of its neighbors)
is changed but it was worth fixing anyway.
2) Before saving an element, the potential 'o_editable' and
summernote classes were not removed of its descendant and were
thus saved.
Bug found with task-38069, merged in stable as it might occur there
too.
The copy-paste feature of summernote was messy and led most of the time
to breaking the template you were trying to edit. While it is difficult
to solve as it mostly comes from the lib itself and that the lib is in
a complicated state as Odoo had to overridde part of its internal code
for its own purposes, this commit hopes to solve the problem by updating
only the copy-paste feature to the latest summernote version.
Of course, as summernote changed a lot meanwhile, it was not possible to
just take the up-to-date summernote file. This commit refactores the
up-to-date summernote clipboard code so that it fits the old summernote
version Odoo is using.
Note: the main problems occurred while using Windows/Mac and not Linux.
opw-1837818
The editor is performing text selection check when clicking on the
window. However, when clicking outside the iframe an editor is running
in, a crash may occur as the editor was trying to check a range outside
of its environment (the iframe).
Related to opw-1837818
This commit improves link creation in web editor.
Before this commit, anything with a @ would be considered as valid email which
is obviously not the case. It would then be prefixed by 'mailto:'.
This was causing 2 issues:
- URL with @ symbol in it would have 'mailto:' added as prefix, like google
maps coordinates.
eg: mailto:http://www.google.com/maps/whatever/@312211.22,321321
- Incorrect emails would go through (eg: @@@, ko@k@k@, mail@mail)
Now, we will try to detect and identify valid emails from invalid emails from
URLs. It will also handle 'mailto:' directly typed in the input.
This commit comes with it's counterpart in enterprise https://github.com/odoo/enterprise/pull/1859
This closes#11984, closes#22936
Note that there is a WIP in master to use this new is_email function
everywhere we try to validate emails. It will aim to uniformize email
validation in odoo's javascript that are often performed with different mean
here and there, some more permissive than others, some only checking for @.
On latest chromium (as of version 64), accessing rules of a stylesheet
is forbidden for cross-domain.
This commit catch and ignores the error when that happened.
chromium commit: https://chromium.googlesource.com/chromium/src/+/a4ebe08c91
opw-813480
opw-815860
closes#23009
Deleting/replacing an image through summernote gave unexpected results.
As modifiying the related function may be tricky, this commit instead
wrap them to solve the specific erratic behavior: if the range is in/
matches an image, then simply remove the image and move the cursor to
its previous location.
When saving a modified mass mailing, the editor will do a number of
things to improve the mail readability accross mail client.
One of those is replacing font awesome icons by image, but firefox acts
differently than other browser. On a display:none iframe, doing
.css('color') or .height() on an element returns respectively
`undefined` and 0.
This caused an error when getting the color that we could solve by
doing a fallback for firefox like this:
window.parent.getComputedStyle($font[0]).color
But to get the height() of an element, it seems we always need the
iframe displayed.
With this change, when the iframe is hidden and the browser is firefox,
the code try to display the iframe (with "visibility:hidden;height:1px")
when this part of the code happen.
note: backport of 10.0 13c326caaa
opw-807180
closes#22701
When clicking on a link in the editor, the "center" alignment button
was always marked as active whatever the real alignment of the link.
This was because it considered the alignment of the text inside the
link instead of the link's one inside its parent.
Sometimes the formatting buttons had no effect or formatted more than
they should (like a whole column when triple clicking on a paragraph
only). This was because of the `listBetween` function implementation.
This is supposed to return all the nodes between one element and another
one... but the logic is wrong without saying from which *point* to start
and which *point* to end. For example, when asking the list between an
element and its parent, the result is very wrong as there is no way to
go from the beginning of an element to the beginning of its parent using
the `walkPoint` function as the `listBetween` function is doing.
Ideally, the function should be entirely fixed but this can be tricky.
For now, the function is just extended to allow to specify points
instead of nodes, and those are used by the `formatBlock` function to
solve the current problem.
... hopefully.
This *must* be forward-ported.
Depending on the browser, the triple-click behavior is different. This
is especially problematic on Chrome, where blank characters at the start
of the neighbor of the clicked element are selected.
A weak attempt to solve that was made by commit https://github.com/odoo/odoo/commit/b85bd358234684974f9af63bc5f28cfabb527767
This commit hopes to solve all the issues once and for all by fully
reimplementing the triple-click for all browsers. The concept is simple:
when a triple-click occurs, select the whole *inner* content of the
deepest DOM *element* that was clicked.
For some unknown reasons, the editor sometimes crashes when dropping a
snippet. As a temporary fix, the non-critical line that causes the
problem is try/catch protected by this commit.
Changing the `deleteContents` method of the editor is tricky. This
commit however dares to add a behavior: if the range does not
represent a selection but only the cursor position and is then asked
to delete its content... it should not do anything as nothing is
selected.
Summernote uses `document.execCommand` to apply most styles when
editing, leveraging the implementation to the browser.
Summernote is configured to use HTML styling (`'styleWithSpan': false`),
and in this case, browsers such as Firefox use HTML attributes for
styling text align, while Chrome still uses CSS for that. In fact,
`document.execCommand` is browser-inconsistent... but so is the
`styleWithSpan` option. Indeed, setting the option to `true` will make
Firefox use CSS property for alignment too... but not Internet Explorer.
So we might consider changing this option's value but this would not
solve the current problem.
Indeed, any CSS `text-align` style in Firefox takes precedence above
the element's `align` attribute, so when users were trying to align text
on stuff that was pre-aligned, they were unable to do so.
We can better explain the situation with this example:
A user tries to left-align in Firefox a `p.text-center` element, and
produces this:
```html
<p class="text-center" align="left"/>
```
(`align` attribute is ignored because of the `text-center` class)
On Chrome, this would be produced with the same steps:
```html
<p class="text-center" style="text-align:left"/>
```
With this patch, we actually make that HTML look like expected by the
user, no matter the browser he's using, by forcing the editor to use
the text-align CSS property. Note that the implementation is quite
ugly but had to take care of compatibility.
See https://github.com/odoo/odoo/pull/20900
(thanks to @Yajo for original PR)
Before this commit, it was not possible to save a page
containing a snippet with a SVG tag.
To support SVG elements, we need to use 'Element.getAttribute'
and 'Element.setAttribute' as mentionned in the documentation:
https://developer.mozilla.org/en-US/docs/Web/API/Element/className
For more information, see GH-14485
In the case where:
- you are too fast editing a mass mailing, trigger an onchange (e.g. mailing_model) and then save
You can use the edit/save shortcuts to make yourself believe you are Flash Gordon
- your internet is too slow (Down: 4Mb/s, Up: 500kb/s, Latency: 20ms)
Before ths commit, the onchange will return *before* the field (the iframe actually) is loaded.
This onchange contains a signal *in* the body_html of the field to allow communication with the iframe.
If you save before the iframe is loaded, this body_html keyword will be saved.
After this commit we deactivate the save button until the iframe is loaded.
We could have gone for a python user error on the value of the body_html too.
But it would have added a supplementary click and potential reloading
OPW 783616
When following these steps on Firefox:
- Select all text in a bold link (triple click)
- Type some text
The typed text did not replace the selected text but was instead put
at the front of it.
When an element is placed multiple times in a page, it is saved only
once. Unfortunately, when a view was divided in multiple editable
parts (XML branding), only one of those parts were saved.
When editing the content of a <label/> which has XML branding (first
DOM element which is editable in its hierarchy), a <p/> element was
added inside. This behavior is there to automatically add <p/> elements
in empty editable <div/> / <section/> elements on edition. This should
however not apply on <label/> elements.
Creating and editing mass mailing in multiple language is managed with
the change 05daa15.
But currently the language the mass mailing is sent in, is the language
of the "Process Mass Mailing Queue" (root user if not changed) so all
the recipients will receive the mail in the root user language has at
the time the given batch of mails is sended.
So this is different from what someone could expect by it being
translatable. In any case the recipients list could be based on a lead,
a partner a mass mailing contact or other and a language could not be
determinable in stable (a mass mailing contact does not have a language
for example).
If the system worked, there is also a usability downside in the meaning
that someone could duplicate a mail and not check all translation and
not be aware that the mail he see is maybe not the mail that will be
received (if translations have not all been completed).
In stable to have the same behavior in any case and lessen the usability
burden of users thinking erroneously the mass mailing may be sent in
several languages depending on a not-existing heuristic, this changeset
remove the translatability of mass mailing content.
This has the following effect:
no translation editing appear,
the mass mailing is edited and sent in one and the same language,
If someone want to send a mass mailing in several language, currently in
Odoo it would then require to:
duplicate the mass mailing,
change the domains of recipients base on choosen heuristic,
edit the duplicated mass mailing in the choosen language
opw-746445
opw-746776
closes#17718
Backport of 10.0 commit: 5331a87f81
The snippet options are attached to `closest`, `all` and `is` functions
to be able to find/check DOM they are associated to. Their behavior
depend on the snippet option type: the search in the DOM is either done
in the body, the editable parts, the editable children only, ....
The problem is that when searching from a given DOM element, jQuery
won't match the elements whose selector contains this given DOM element.
Or in code terms, jQuery find function behavior is:
`$('A').find('A B')` <=> `$('A A B')` (not `$('A B')`)
This was indeed a problem on the job position apply form pages where the
main editable element is the <form/> element itself. Indeed, the snippet
options' selectors which began by 'form' were not able to match. Worse,
the selector is used for a jQuery search for drag & drop and saving but
not for initialization (where it is used as a `is` check on clicked
elements). So, some DOM were able to be modified by options but not
properly (re)configured before saving.
opw-705902
opw-741305
In 4e0e376b0 an iframe for the readonly preview was added when
displaying html fields.
In e5112ee00 this iframe was only used if style-inline was set in the
widget options.
This brought an incompatibility if the not iframed preview contained an
iframe (eg. a youtube video which is then resize to a 30px height) which
is solved by this commit.
opw-725161
closes#16955
There was an issue when selecting a video tag:
- a tag inside the video tag would be selected instead of the video tag
so video could not be removed or modified (modifying it would add a
video or image inside the video itself and so on).
- the selection was not conveyed to the editor so it would be lost
consequently due to some code who restored it to what was saved on
the editor.
This fix solves this by changing how the video tag was selected and
saving the selected range on the editor.
opw-724701
When adding a font-awesome icon to a mail template, the icon is
converted to an image once the template is saved. To do that, the
code checks all the `.fa-XXX` definitions in the stylesheets to know
which content the image have to use. The problem is that this was
not considering the font-awesome aliases. Indeed, the `fa-facebook-f`
icon was able to be used while its alias `fa-facebook` was not working.
When using the iframed editor with multilang selector (present if there
is another lang installed than en_US) an "English" language was present
before each translation language.
opw-696891
The transcoder (which transforms stylesheet rules to inline style) did
some compression of the padding and margin css properties to not always
have margin-top + margin-right + margin-bottom + margin-left.
This could cause an issue when the value of margin or padding contained
an initial or inherit value because browsers (at least firefox and
google chrome) doesn't allow it. Thus the preview could for example have
bigger veritcal spaces arround `<p />` tag than what was seen when
editing.
With this fix instead of invalid:
margin:initial initial initial initial
we have:
margin:initial
And instead of invalid:
margin:initial 5px 6px 7px
we have:
margin-top: initial; margin-right: 5px; margin-bottom: 6px; margin-left: 7px;
opw-706535
When changing of record, through the pager or the breadcrumb, the URL of the iframe
must change, as the model and id of the record is included in the URL
This wasn't done before this revision, and it could
lead to an INTERNAL SERVER ERROR in case of a deletion
followed by the loading of another record: the URL
of the iframe was still set to the former record,
and this URL crashed as the record no longer existed.
e.g.
- Create a new mass mailing, subject 1, add a random block in the content then save
- From this newly created mass mailing, Create a new mass mailing
(directly with the create button)
Subject 2, add a random black in the content and save
- Delete the second mass mailing
- Return in the mass mailing kanban view through the breadcrumb
- Open the mass mailing 1
- You had an internel server error, due to the fact the URL of the iframe
was still the one of the second mass mailing.
opw-710239
In mass mailing there is several possibilities of states when rendering
the widget with a possibly new value:
1. we are not in edition
a. we are in same language than user language => the editor content
can be updated
b. we are in a different language => the content cannot be updated
2. we are in edition
a. we are editing translation : the editor content cannot be updated
b. we are not editing translation (editor language == en_US)
i. we are requesting editor update (by having magic value
`on_change_model_and_list`) => the editor can be updated
ii. we are in same language than user language => the editor content
can be updated
iii. we are in a different language => the editor content cannot be
updated
In summary:
- if language is the same than the user, we can update the value
- if value is magic `on_change_model_and_list` and we are not translating,
we can update the editor
Before this commit, this worked as expected but for 2.a.ii. which if the
user language was not en_US would for example prevent editor updating.
closes#15583closes#15414
opw-708032
inspired by a27e24c6d1
note: the fix is a fix for 9.0 and saas-11 only.
When editing translations, you were not able to copy/paste texts before
this commit. Indeed, in some contexts, in some browsers, copy/pasting
text was creating a new paragraph inside the translation, preventing it
to be saved.
This commit simply adds code to remove these paragraphs each time text
is changed.
A more elegant solution will be found for master with website and
editor improvements.
An italic node would be taken as a basic node containing text and thus
would be merged unexpectedly.
For example with the following content : "<i>hello</i> world" removing a
letter of 'world' would merge the text node with hello making it italic.
opw-703722
In some case (for example the one solved with b51d21c5) we can have
write done on a field text in read only mode.
With 98ed53ce if :
- such a case happened (in b51d21c5 the fix only worked after the given
field was written one time) or a similar instance,
- and the user was in debug mode,
- and the widget used was TextFieldHtmlSimple
this could lead to an issue with the code trying to toggle the code view
mode whilst the editor is closed.
With 98ed53ce when a form view is saved when a html field is in code
view mode, the change is not lost.
This new backend tour check that when saving in or not in code view, the
content is saved effectively.
The test not in code view would ensure issues like #14381#14351#14394
are detected on runbot.
closes#14475
opw-693052
note: the old test system is used so this test is only for up to saas-11
The intended scenario when using the code view is the following:
1) click on code view button to use code view
2) make changes
3) click on code view button to get back to wysiwyg view
4) save from the wysiwyg view
If the 3rd step was not done:
- for the inline editor, we lose the changes that have been done in
code view,
- for the iframe editor, we lose the entirety of the content.
At one time the user was forced to go back to wysiwyg before being able
to save, but this have been removed hence the present usability issue.
With this fix, when the editor content is saved, if the user is in code
view he is automatically set back to wysiwyg view.
fixes#14648closes#14475
opw-678677
opw-693052
When editing the website, adding a gallery, choosing the grid mode
and then adding images, an extra, empty, image was
added to the grid, in the first position, making it looking weird
or at least not aligned.
This was due to the `start` method of the widget, which
is trying to focus the image in the images browser when
you double click on an image (in the big image building block
for instance) and set an image without url in the case
where `o.url` was undefined, and the url of one of the records
was also undefined.
opw-692205
This reverts commit 897290dd3f.
It seems it breaks other use case, since this was fixing more a
usability thing (need to click back on code view to save code view
changes) it is better to revert than to add drawback.
A better fix should be introduced, or the solution would be to not fix
it and have a warning indicating what needs to be done.
opw-693052
The scenario when using the code view is the following :
- click on code view button to use code view
- make changes
- click on code view button to get back to wysiwyg view
- save from the wysiwyg view
If the 3rd step is not done:
- for the inline editor, we lose the changes that have been done in code
view,
- for the iframe editor, we lose the entirety of the content.
At one time the user was forced to go back to wysiwyg before being able
to save, but this have been removed hence the present usability issue.
With this fix, when the editor content is saved, if the user is in code
view he is automatically set back to wysiwyg view.
closes#14339
opw-693052
The widget html is used for plain text and html content.
Need to check if the content is a valid html code, if is not wrap with p tag every lines.
opw-692158
* Tip are never destroyed when change view mode
* unbind methods
* mail: memory leak with unbind methods
* web: memory leak because 'ui-autocomplete' is never destroyed
* web_editor: memory leak for wrong unbind on destroy
* web: memory leak: must remove fileupload handler
* bus: memory leak: correctly debind handlers on window in bus.Bus
* remove handlers on switch buttons and views $buttons
* remove handlers on breadcrumbs
* web: memory leak: correctly debind handlers
* im_odoo_support: memory leak: remove fileupload handler odoo_support
Note: part of this commit was actually authored by aab
There is a hackish feature in the web_editor which forces the
contenteditable to true on links which are clicked and removes it
anywhere else in the page so that only the link is editable after
click. This allows to add text at the end of a link without adding it
outside of the link by mistake.
The feature was badly implemented because, if the link was editable
without having any parent which is editable, the contenteditable was
forced to true, then immediatly forced to false when forcing to false
every page element. This was the case for lots of t-field. By example
the product categories in eCommerce are t-field links which are in non
editable <li/> elements...
qsm-odoo