Commit Graph
2666 Commits
Author SHA1 Message Date
Rodopho Cammarosano de Lima (rcdl) ef41ffbb45 [FIX] web_editor: update z-index in CSS classes
Due to a change in Bootstrap, the tablepicker, the toolbar and the q-web
branching selector were hidden by modal dialogs.

In Odoo 15.0, the included Bootstrap version was 4.3.1, in which
.modal's z-index is set at 1050.

In Odoo 16.0, the included Bootstrap version is 5.1.3, in which .modal's
z-index is set at 1055.

Therefore, the previous z-index value of 1051 is now updated to 1056.

task# 3002456

closes odoo/odoo#107431

X-original-commit: 263137bcd38f788ff96d13d0810df4da13b72a19
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-07 22:48:45 +01:00
luvi 60ac6be0d3 [IMP] web_editor: use of the useSpellcheck hook
This commit makes use of the spellcheck hook to only enable the spellcheck attribute
on the textarea element when needed (on focused element). Since form view are now
always displaying a textarea, instead of relying on a readonly state, the textarea
used by the HtmlField always displayed red underline on typos.

This means the UI can become difficult to read if there are multiple red lines in
the text.  Now, it is only present on focused textarea thanks to the useSpellcheck
hook.

This change can be noticeable in many apps, including notes from records and the
Knowledge editor.

A test has been added to verify that the hook enables/disables the attribute on the
contenteditable element used by the html editor..

task #2861428

closes odoo/odoo#106866

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
2022-12-07 18:29:10 +01:00
Sébastien Geelen (sge) defce6b833 [FIX] web_editor: fix commands in inline
Some commands from the powerBox command bar were not working
properly in the e-shop product "terms and conditions" section.

This was due to the isolation of Odoo fields
inside the odoo editor as a all.
Those fields do not always have an editable block element
to apply the command on.

We disable some commands that should not be apear in this context.

We also remove a redundant command (separator) in website pages.

task-2962067

closes odoo/odoo#107174

X-original-commit: 3776faa178314c4df889f4c04cc3931f8bef225c
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-07 15:32:04 +01:00
Benjamin Vray 4cd383175f [FIX] web_editor: prevent horizontal overflow caused by m2m widget
When a vertical overflow is triggered in the snippets menu, a vertical
scrollbar is added making the snippets menu slightly smaller. Most
widgets properly adapt their width, however the many2many dropdown
widget does not, causing a horizontal overflow and its associated
scrollbar.

Steps to reproduce the bug :

- Drag and drop the "text-image" snippet in a page.
- Click on the image in this snippet.
- Set the "visibility" option to "Conditionally".
- A horizontal scrollbar appears in the editor panel.

This commit adapts the CSS of the m2m widget to solve the issue.

task-2779530

closes odoo/odoo#107305

X-original-commit: de96c25a5ad94c524e129053ebbfcb10b020d069
Signed-off-by: Guillaume-gdi <gdi@odoo.com>
2022-12-06 14:34:42 +01:00
qsm-odoo dc140ef115 [FIX] web_editor, website: add cover/contain option for grid images
As a fix, this introduces a new option for images in grid mode. When an
image is alone in a column which later becomes a grid item, or when an
image is directly added as a grid item via the dedicated option, the
image used `object-fit: cover` so that when the image is resized as a
grid item, it fits the dimensions of the selected grid area.

This confused some users as the image did not appear the same depending
on the screen size. Indeed, if an image is set to take 5 columns as
width and 3 rows as height, it does not ensure the ratio in pixels to
stay the same depending on the screen size: the grid is always made of
12 columns (so the width of each column depends on the screen width),
while the rows are always 50px tall. We could enforce the ratio of grid
items to stay the same or limit the ratio loss by reducing the 50px
height on smaller breakpoints but that would actually increase another
problem: for colored text grid items, their text would more easily
overflow their fixed area.

In the end, using the grid mode is about compromises, even if it allows
to achieve nice things and to have more freedom. This commit although
adds a new option to mitigate the issue for images: users now have the
possibility to switch the default "cover" mode of grid images to
"contain": in that mode, the whole image will always be visible (and
thus keeps the same ratio) and is just "contained" in the grid area
which is selected as dimension.

opw-3069234

closes odoo/odoo#107172

X-original-commit: faf19ef7f87fc043fb9a814516e01b8eeafd9b61
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2022-12-06 13:34:59 +01:00
Soukéina Bojabza 7f8321aab0 [FIX] web_editor: display grid mode mobile view for higher screen sizes
When we are in grid mode, if we decrease the screen size small enough,
the display is back to `flex` and the columns are displayed one above
another (-> mobile view). However, the columns in normal mode do that
for screen sizes higher than the breakpoint set for the ones in grid
mode, which is inconsistent. Moreover, as the images have their
`object-fit` property set to `cover`, they become really deformed and
therefore do not look good.

This commit solves these issues by increasing the breakpoint at which
the grid mode switches to the mobile view, that is, from `md` to `lg`.

opw-3069234

X-original-commit: 1ec3c4726ea92452dfe091eac96bcc9f3fdfa589
Part-of: odoo/odoo#107172
2022-12-06 13:34:59 +01:00
Antoine Guenet e0aae26c4d [FIX] web_editor: show the correct alignment in toolbar when in link
The `align` command applies the alignment to the closest block of the
selected node. Bootstrap sets the default alignment of `.btn` to
`center` but we don't support links with a width that is larger than
their contents so that alignment is not visible. For these two reasons,
we want the toolbar to show the alignment of a link's closest block
rather than that of the link itself.

closes odoo/odoo#107155

X-original-commit: a3bb5b0c4b010b7583af1440cb65e889586636c8
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-05 10:07:52 +01:00
Antoine Guenet c94c19cc3c [FIX] web_editor: properly apply alignment to links
When the selection was in a link, the alignment buttons didn't work.
That is because they are supposed to align the parent paragraph, which
is temporarily in a contenteditable=false context when the selection is
in a link. This restores the context before applying an editor command,
and restores it afterwards.

task-3083748

X-original-commit: 0a4eb266b198e5e02a3325d063d07c0dd8af0148
Part-of: odoo/odoo#107155
2022-12-05 10:07:52 +01:00
Antoine Guenet f3ad331f64 [FIX] web_editor: check if closestElement returns element
`getInSelection` had a check that depended on `closestElement` returning
an element (and not `undefined` or `null`).

closes odoo/odoo#107061

X-original-commit: 0eeff8266ab1c3bdd15d4587aaf83e299811c3fa
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-02 10:11:23 +01:00
Antoine Guenet 73815629ef [FIX] web_editor: prevent toolbar flicker on preview icon color change
If you clicked on a pictogram, then previewed various colors for it by
hovering colors in the colorpicker of the toolbar, the toolbar started
flickering uncomfortably. That's because the selection was changed
at every color change, which was unnecessary.

closes odoo/odoo#107041

X-original-commit: f0ff5dc4bdaf5a1704f1af55d46b253e234712a4
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-02 10:11:15 +01:00
Antoine Guenet 6a9f783872 [FIX] web_editor: do not open text toolbar on change icon color
If you clicked on a pictogram, then changed its color with the text
colorpicker in the toolbar, the toolbar was replaced with the regular
text toolbar, even though what was being edited was the pictogram.
That's because the information of the last media clicked was lost in the
process.

task-3045166

X-original-commit: fa1c7e68eaa544445621ca7e7e2c647ffe857447
Part-of: odoo/odoo#107041
2022-12-02 10:11:15 +01:00
Nicolas Bayet acacdff5af [FIX] web_editor: reset the options of the editor
Before this commit, when the editor was reset through updateWidget, the
options were not updated.

closes odoo/odoo#107029

X-original-commit: ffd77cf6aee37f8912e1367f8f9ca2f6344e9577
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-12-01 18:31:10 +01:00
Antoine Guenet 091dfca6fb [IMP] web_editor: align editor columns with editable bounds
Columns added with the "columns" Powerbox commands should be aligned
with the editable element's bounds.

task-3001988

closes odoo/odoo#106747

X-original-commit: fb55f688f6be2211ebeea4ba431a06230c40fb6b
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-28 19:49:04 +01:00
Rodopho Cammarosano de Lima (rcdl) 3c12c5e939 [IMP] web_editor: add forceNewWindow to LinkTools
Upon instantiation of a LinkTools object, the forceNewWindow property is
now added to the options object. This allows us to take advantage of the
pre-exisiting mechanism to conditionally display the "open new window"
checkbox in the LinkTools widget
(odoo/addons/web_editor/static/src/xml/wysiwyg.xml:334).

The possibily of not having the checkbox in the DOM demanded a
modification of LinkTools._isNewWindow().

_isFromAnotherHostName(), being used by both LinkDialog and LinkTools,
was moved to their parent class Link.

task# 2789222

closes odoo/odoo#104923

Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-28 14:51:07 +01:00
Nicolas Bayet 0340537152 [FIX] web_editor: check method addNeutralStyle
Because of css limitation, the child of a parent that define a
text-decoration cannot "neutralize" that decoration defined by its
parent with a css property (ie. the text-decoration cannot be
overridden).

When a block define an inline style or any tag that have a class, the
method `formatSelection` tries to "neutralize" the style by calling
`addNeutralStyle`. As it is impossible to "neutralize" the style for
underline nor strikeThrough, there is no method `addNeutralStyle`
defined for those properties.

Before this commit the method `formatSelection` was crashing because
`addNeutralStyle` was not defined.

Task-3002123

closes odoo/odoo#106635

X-original-commit: ce068a3113204dc558e69e88f1d2d778fa446c73
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-28 13:20:47 +01:00
Antoine Guenet b5af8198fa [FIX] web_editor: handle default_focus form attribute for html_field
When rendering a form view that has a truthy `default_focus` attribute,
the renderer looks for the element in its tree that has its `name` as
`id`. However in the case of `html_field` it couldn't find it since
`html_field` failed to apply that `id` to its focusable element (the
editable root). This adds the `id` to the editable root when rendering
the element in `wysiwyg`, and also directly applies `contenteditable` to
it so the `focus` method actually does what we expect it to, even though
we are waiting for `HtmlFieldWysiwygAdapterComponent` to be mounted
before actually instantiating the editor itself.

task-3073096

X-original-commit: 7e14e2a9c055f5b30b7510ffad994fa10196e34d
Part-of: odoo/odoo#106622
2022-11-28 13:20:41 +01:00
vishal padhiyar 1488a35c61 [FIX] web_editor: impossible to add signature at some times
Before this commit:

When we try to add signature from powerbox then sometimes it does not show
the signature.

After this commit:

Now when we try to add signature from powerbox then it will show the signature.

Task-2939080

closes odoo/odoo#106490

X-original-commit: 7d5f61abf8076ff77543844f6355907118e3729d
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-25 10:52:10 +01:00
vishal padhiyar ff366852fe [FIX] web_editor: remove copy paste unwanted newline
Before this commit:

- When you try to paste text beside a text which is in code formate it
  puts the new text in new line with smaller font.

- When we try to paste text in code formate in new line then it will
  give a blank space below the pasted text

After this commit:

- when you try to paste text beside a text which is in code formate it
  puts the pasted text in new line with original fontsize.

- When we paste the text in code formate in new line then it will not give
  a empty line below it,

Task-2683455

closes odoo/odoo#106488

X-original-commit: bf7835e80ffa70236dca4b4b8fb4edb45d42f46a
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-25 10:52:07 +01:00
vishal padhiyar 12f2cd2d34 [FIX] web_editor: stuck after manual link creation
Before this commit:

When we try to create link manually and try to press enter cursor gets stuck.

After this commit:

Now when we create link manually and press enter cursor moves to next line.

Task-2745129

closes odoo/odoo#105968

X-original-commit: 4d14fa559b2ffcb768fa0a0a42b9b9eb2703a050
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-24 17:23:40 +01:00
Nshimiyimana Séna 445d4cd97c [FIX] web_editor: fix codeview toggle
### Steps to reproduce
* Enable Dev mode
* Open an email template
* Open Code View of the template
* Click the green button in the top right corner of the content box

You should be met with a traceback.

opw-3045759

closes odoo/odoo#106408

X-original-commit: 01fb9cab941d9055efbeac738490fe53a91ceccf
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-24 13:29:00 +01:00
Arthur Detroux (ard)andqsm-odoo 0a83f41d59 [FIX] web_editor, website: improve perf of color previews
Follow-up of [1].

After [2], color previews on the side panel would be changed by the
wysiwyg adapter. The adapter would add each block individually inside
the iframe and check its current styling to then add the style to the
color preview elements. This was performed many times (as color palettes
all have their own individual rendering of the color previews)
and slowed down the editor.

This commit improves that by relying on the copied variables introduced
at [3]. This removes the "re-render" of the color preview elements,
instead relying on styling rules and CSS variables which are initialized
when the editor is started.

[1]: https://github.com/odoo-dev/odoo/pull/1149#discussion_r900120846
[2]: https://github.com/odoo/odoo/commit/212a8bfdd21269b18054200b9e2585e1c95540d6
[3]: https://github.com/odoo/odoo/commit/a396f791da94d064d58cce15892e74f45d29b7b7

closes odoo/odoo#106366

X-original-commit: 7f5a9d040348048990b25c271875c77d2c314e4d
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
2022-11-24 11:08:39 +01:00
abd-msyukyu-odoo 51b5ee8d5f [FIX] web_editor, knowledge: prevent modification of data-oe-protected
Change class="oe-blackbox" to data-oe-protected="true" (same purpose), because
the name was decided in a rush before 16.0

When the editor history management and sanitization (sanitize.js) handle nodes
of an embedded view, OWL can become corrupted, which will lead to a traceback.

This commit uses the attribute data-oe-protected="true" to prevent
historyRollbacks or sanitization, and ensure that protected elements children
are removed during the cleanForSave operation.

The collaborative DOMPurify sanitization is untouched, for security reasons. To
properly use `data-oe-protected` in collaborative mode, a more complex
mechanism should be put in place to ensure that the protected element children
are properly reconstructed for each client, and that it is not part of the
collaboration. (i.e.: embedded view in knowledge do not support the
collaborative mode currently).

This commit also blocks the selection handling in tables which would be in a
data-oe-protected="true" node.

Task-3012552

closes odoo/odoo#106255

X-original-commit: 394e4fe567bb2eecbd0865de82914aa7396fde63
Related: odoo/enterprise#34245
Signed-off-by: David Beguin (dbe) <dbe@odoo.com>
Signed-off-by: Abeloos Damien (abd) <abd@odoo.com>
2022-11-23 11:26:12 +01:00
Rodopho Cammarosano de Lima (rcdl) 55fbb8d89a [FIX] web_editor: remove dot in powerbox commands
The dot (period) is removed from user-facing strings in powerbox
commands, and the corresponding msgid in .pot files are updated.

task-2901665

closes odoo/odoo#106032

Related: odoo/enterprise#34116
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-18 17:03:53 +01:00
vishal padhiyar e87a3b8d4f [FIX] web_editor: copy paste link keeps the old url
Before this commit:

When we try to copy paste link into another link then url of the old link does
not change and only lable change.

After this commit:

Now when we try to copy paste link into another link then the url of the link
changes with the label.

Task-2768541

closes odoo/odoo#105966

X-original-commit: ea1e410f4174d235609181bdba692a98e7381396
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-18 12:58:00 +01:00
Sébastien Geelen (sge) 0fbcf9a2cb [REM] web,web_editor,sms : remove legacy DPH
Remove the Dynamic Placeholder from the legacy Odoo field.

Introduce in 308f639e295fce07e4f34d6c76b35aab259e21ad
And migrate to be OWL compatible in #101768

Therefore the old code targeting legacy odoo field is unnecessary
and need to be cleaned.

task-3071417

closes odoo/odoo#105920

Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-17 13:57:30 +01:00
Nicolas Bayet ad36d893e8 [FIX] web_editor: prevent disconnection from peer to peer
Before this commit, once a user was disconnected from internet (eg.
network failure, laptop screen closed), the code disconnected the user
from the peer to peer network and upon reconnection to the internet
network, the code did not try to reconnect to the peer to peer network.

This created a network partion in the peer to peer network each time
a user disconnected and reconnected to the internet network.

When there is a partition in the peer to peer network, the last subnet
to write to the record erased the changes of another subnet without
notification.

This commit prevent the code to disconnect from the peer to peer network
when there is any disconnection signal triggered.

closes odoo/odoo#105900

X-original-commit: 8bce8cd53d1c6da89fce8c2f8b64615168d45a0d
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-17 13:57:25 +01:00
Antoine Guenet d23f06ae78 [FIX] web_editor: properly copy editor content
When copying some list items in the editor and pasting it back into it,
we lost their parent list, leading to paragraphs being pasted rather
than a list. This restores the list.

task-3050150

closes odoo/odoo#105386

X-original-commit: 2333d8470df2fac80247e6f39d740a29f1eeb561
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-14 15:21:12 +01:00
Antoine Guenet 0aa4b317cd [FIX] web_editor: handle the cut clipboard event within the editor
The feature of not altering pasted content that was copied from the
editor was not enabled for content _cut_ from the editor.

X-original-commit: d79ed0298a8366ca51b1ca54fe725c7a55860254
Part-of: odoo/odoo#105386
2022-11-14 15:21:12 +01:00
Antoine Guenet c7cb454a67 [FIX] web_editor: allow pasting nested lists
The class that Odoo adds to nested list items to display them nicely was
not whitelisted for pasting so pasting nested lists ended up looking
ugly.

task-3050150

closes odoo/odoo#105378

X-original-commit: edfc8f318529a7e513c5ef1631461a5dc0258d4f
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-14 15:21:02 +01:00
Younn Olivier a377708436 [FIX] web_editor: fix pasting youtube videos from the editor
Before this commit, following this flow in the Website Builder:
- Enter edit mode,
- Drop a snippet with text,
- Paste a youtube video link,
- Click on the "Embed Youtube Video" option of the powerbox,
=> There is a traceback.

This is coming from the bad function calls in the Wysiwyg to create a
video node.
When [1] reworked the MediaDialog in owl, a first implementation was
done exporting some utils (saveVideos, videoSpecificMediaClasses). But
this implementation was not kept and later changed to use static methods
and properties on the VideoSelector class (createElements and
mediaSpecificClasses).

Unfortunately, the outdated util methods used in the Wysiwyg were not
changed, and it was breaking the youtube video instertions.

This commit changes the Wysiwyg to use the existing
VideoSelector.createElements and VideoSelector.mediaSpecificClasses
static method and property to fix this flow.

[1]: https://github.com/odoo/odoo/commit/31cc10b91dc7762e23b4bde9b945be0c4ce3fe3b

task-2687506

closes odoo/odoo#105475

X-original-commit: 4923c20c29170407d43908f983f2a168241f4817
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Signed-off-by: Younn Olivier (yol) <yol@odoo.com>
2022-11-09 18:06:56 +01:00
Jorge Pinna Puissant 4f24e34b39 [IMP] test_lint, *: eslint remove caughtErrorsIgnorePattern from no-unused-vars
Unused catch block arguments are now forbidden even when prefixed with an
underscore:  if the argument on the catch block is not needed, the use of the
optional catch binding is enforced.

Part-of: odoo/odoo#105433
2022-11-09 16:08:07 +01:00
Sébastien Geelen (sge) edfa446fd5 [FIX] web_editor: block commandbar in non html field
Prevent the PowerBox command bar to open in (non html) Odoo field
embedded inside the editable zone.

task-3040872

closes odoo/odoo#105372

X-original-commit: cab3a9b9b89a6b1c0d430e5374feb2f963e466fc
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Signed-off-by: Geelen Sébastien (sge) <sge@odoo.com>
2022-11-09 08:14:53 +01:00
Aaron Bohy 9db9dbd38a [FIX] web(_editor): protect RPCs from component destruction
The rpc service has a protection (when used via useService) that
prevents the returned promise from being resolved/rejected if the
component has been destroyed meanwhile.

However, as the FormView still uses the legacy BasicModel, all rpcs
done by its model do not go through our new rpc service. As a
consequence, before this commit, they did not benefit from the
protection. This caused a non deterministic issue in the main flow
tour.

This commit implements a similar protection as the rpc service, but
specialized for the BasicRelationalModel, which redirects all RPCs
done by the BasicModel.

This change highlighted two scenarios where we sometimes performed
RPCs (or could perform RPCs) on a destroyed component. This commit
fixes those as well.

X-original-commit: f613e916d5e8b465fc360e340094c09037450ff1
Part-of: odoo/odoo#105332
2022-11-08 15:56:08 +01:00
Antoine Guenet e3a364122d [FIX] web_editor: restore deleteForward versions of deleteBackward tests
Tests for `deleteBackward` with a non-collapsed selection should always
be repeated using `deleteForward` to ensure the behavior is indeed the
same for both. This was not the case for some of the tests.

task-3032817

closes odoo/odoo#105217

X-original-commit: 183246102406ccb4730ee2e11c8d42ccca6dce6b
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-08 09:41:07 +01:00
Antoine Guenet 8c42506648 [FIX] web_editor: properly handle deleteRange where tables are involved
Tables have their own custom selection in Odoo Editor, so rectangular
cell selection is supported. Selecting a whole row/column/table then
pressing delete/backspace removes the whole row/column/table. But just
selecting some cells should only empty them, which we failed to do,
resulting sometimes in broken tables.

The code to remove selected rows/columns/table was triggered when
pressing backspace/delete, which failed to account for cases where we
need to delete the range without pressing those keys (for instance when
typing a character). This moves that code to `deleteRange` so as to make
it the standard behavior when deleting a range that includes table
cells.

task-3032817

X-original-commit: fad5d2d7e241e22382a2f3dc0fd68eca741e59a7
Part-of: odoo/odoo#105217
2022-11-08 09:41:07 +01:00
Antoine Guenet e5c504e8b1 [FIX] web_editor: test the real browser flow for delete/backspace range
deleteBackward and deleteForward tests were just directly calling the
editor's implementation, without triggering events that are sometimes
crucial to the behavior. This is at least preventable in cases where the
selection isn't collapsed, by triggering the keydown event and calling
the document's `execCommand` function with the "delete" command.

task-3032817

X-original-commit: cd7c647f45487e8d8a763875a30e327422af4e68
Part-of: odoo/odoo#105217
2022-11-08 09:41:06 +01:00
Romain Derie 8fd7eda342 [FIX] web_editor: restore "load more" image button as button style
With commit [1] the "load more" button of the media dialog went from a
btn-primary style to a btn-secondary style, which is displayed a link.
It was done in an Odoo global effort of making each and every screen
having only one (sometimes two at most) primary action to help the UX,
as explained at [2].
But in this case, it seems to more misses with the UX than helping the
user as that button really becomes invisible without it. We already were
afraid of that but still merge it, see [2] again.
Indeed, in secondary style this button is barely visible due to the
unsplash and undraw image results which have an "author" text like on
top of the image which looks like the "load more" style.

This commit is using the `btn-odoo` class to show it as a button and not
a link to avoid people not seeing it.
`btn-odoo` is chosen instead of `btn-primary` as this is how "secondary
important actions" are designed now in Odoo.

Note that in community, it looks like a btn-primary but that's not
related to this PR.

[1]: https://github.com/odoo/odoo/commit/ff0b2d441252560a076a3609d81c369f0ce42d19
[2]: https://github.com/odoo/odoo/pull/98706#issuecomment-1236804203

closes odoo/odoo#105193

X-original-commit: f204d3a6ed5b5de08c7921a0bcd5188d78b0cf8b
Signed-off-by: Romain Derie (rde) <rde@odoo.com>
2022-11-07 17:59:45 +01:00
Antoine Guenet 82a2b7ff15 [FIX] web_editor: properly drop images in editor
This addresses issues with image dropping and pasting.

1. The code to compute the position of the drop was not always run so
that resulted in a sometimes wrong position (dropping at current range
instead).
2. Images dropped internally within a same document should not be
converted to base64.
3. Dropping an image should apply to it the `img-fluid` class so as not
to break the document's layout.

task-2954499

closes odoo/odoo#105137

X-original-commit: 9c258bf18c17a55f1d22c8a7d1b74f5dd51ee73d
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-07 13:50:10 +01:00
Antoine Guenet 6509afcae5 [FIX] web_editor: include descendants in getTraversedNodes
The `getTraversedNodes` function sometimes failed to include descendants
of traversed nodes, which should logically be included. Eg,
`<div>[<img>]</div>` where the selection is expressed as `div 0 div 1`:
the iterator is set on the common ancestor, which is the `div`, so it
stops immediately, only returning the `div`. Here we add its ancestors
in every case.

X-original-commit: 0e765277871a57c367d09fc05bb13a9d6670d11d
Part-of: odoo/odoo#105137
2022-11-07 13:50:10 +01:00
Antoine Guenet b8290bcdd9 [FIX] web_editor: prevent wrong selection after discard link dialog
When discarding the link dialog, we need to restore the selection in the
editable area. This failed because the selection was recomputed when the
dialog was actually removed from the DOM. This is the same case as a
couple of lines above the restoration of the selection, where we need to
wait for the element to be removed before triggering a focus on the
inserted link.

task-3000250

closes odoo/odoo#104847

X-original-commit: 6b86f6c91fc69bec59f39377e322d79242466d42
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-07 13:50:01 +01:00
Sébastien Geelen (sge) edbf08661d [FIX] web_editor: improve link unit tests
Change isolation link unit tests to cover both deleteBackward methods :
- deleteBackward via direct contenteditable command
- deletebackward via input event ( mobile )

task-3054245

closes odoo/odoo#105066

X-original-commit: 123051fc8b61e27fc8e39f0fed02a58186fca7e3
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-07 10:06:31 +01:00
Sébastien Geelen (sge) 1176e0cab0 [FIX] web_editor: fix isolated link
Sometimes the link isolation was broken when
the editor rollbacked some browser behavior :
the content editable was reset on the all editable.
And thus the cursor was able to get out of the
isolated link creating issues.

task-2957000

X-original-commit: 0a04ef6c2617741b90c151c367c1731ed180ad70
Part-of: odoo/odoo#105066
2022-11-07 10:06:30 +01:00
Sébastien Geelen (sge) 6c0488d9dc [FIX] web_editor: fix selection rendering causing rollbacks in tests
We avoid listening to mutation during test selection "[]" rendering.
Those rendering would be registered by the editor and sometimes wrongly
put the editor in rollback mode.

X-original-commit: cb9348e3f7a95d787337b5c3c8fbba5cf6c9e7c4
Part-of: odoo/odoo#105066
2022-11-07 10:06:30 +01:00
Antoine Guenet 6bc057394b [FIX] web_editor: prevent zws in url on paste
Paste a url in the editor from the URL bar of the browser. If you then
select it all and paste another URL in its stead, the zws inserted by
the sanitizer when deleting the selection ends up in the URL.
This is because the sanitizer moves downward into the DOM tree,
therefore change the link URL before removing the zws in its text child
node. To make sure this can't ever happen, we now remove zws from URLs
when parsing them from the link's text content.

task-3054233

closes odoo/odoo#105045

X-original-commit: c4c9627297c0e3e3977cbfd51129227f8ec1ce3c
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-07 10:06:26 +01:00
Soukéina Bojabza c75f5d11f0 [FIX] web_editor: reallow the grid images to be replaced
In commit [1], a check was added to see if a media is editable in order
to prevent its edition if it is not the case. However, this also had as
effect to block the edition of some grid images. Indeed, as the columns
in grid mode containing only an image have their `contenteditable`
property set to `false`, the images don't pass the check because their
parent is therefore not editable.

This commit removes the `contenteditable` property from these columns
in order to make their images pass the check and therefore allow their
edition.

Tests are also added, ensuring that these grid images can be correctly
replaced.

[1]: https://github.com/odoo/odoo/commit/ddade4346347266b7f699d05865578dc96e2bf98

opw-3028116

Fixes #103234

closes odoo/odoo#104899

X-original-commit: d8c374e3e6b31bf88aa42952aadf3379936f7600
Related: odoo/design-themes#617
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2022-11-03 23:35:10 +01:00
vishal padhiyar e774cac767 [FIX] web_editor: fix attributes missing from cleanForSave
Before this commit:

When we try to add html data in translated email templates then it does not
remove those extra classes from the html code.

After this commit:

Now those extra classes will remove from the html code.

Task-2985072

closes odoo/odoo#104859

X-original-commit: 5e192a3ccd93c3aafda26abdcfae50ab8f0e053e
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-03 19:40:55 +01:00
Nicolas Bayet e3ed896fbd [FIX] web_editor: prevent some class to be used in history
When a change was added within a field like adding a class (eg. o_dirty,
o_transform_removal, or oe_edited_link), it triggered the
`_observeOdooFieldChanges` mechanism that replace all identical fields
from the first mutated field in the set of identical fields.

The bug appeared when there were two identical in the pages
- field A: first to appear in the document
- field B: second to appear in the document

When clicking on a link inside field B, multiples class could be added
(o_dirty, o_transform_removal, or oe_edited_link) within the fields.
Field A and field B were mutated. This activated the mechanism
`_observeOdooFieldChanges` and replaced the innerHTML of field B with
innerHTML of field A.
That replacement of innerHTML made the reference of the anchor node
in the link tool being outdated and changes made inside that link tool
ineffective.

Step to reproduce:

- Install website
- Go to any page and enter edit mode
- Click on the navbar and in the right panel select Vertical header
- Activate the CTA option in that navbar right panel (should already be)
- Click on the CTA button
- Try to edit the URL in the right panel or any link option (style etc)

The link will not update properly and the history undo create a new
link.

This commit add the ability in the editor to prevent classes from being
taken into consideration in the filterMutationRecords and in undo/redo
and when receiving external steps.

closes odoo/odoo#104872

X-original-commit: e07e149e01646cc2e59c8ac205a5047fd74ae0ba
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-03 16:43:39 +01:00
Dhaval Baraiya 2f8cb75f0d [FIX] web_editor: specify a custom color in the text input of the color picker.
Before this commit:

It's impossible to specify a custom color in the text input of the color picker
for the selected text.

After this commit:

It's possible to specify a custom color in the text input of the color picker
for the selected text.

Task-2896109

closes odoo/odoo#104560

X-original-commit: f1f3fcef6cc471fc01da574da26712e643315da6
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2022-11-03 13:10:46 +01:00
Sébastien Geelen (sge) aeb4b57f85 [FIX] web_editor: dynamic placeholder bug
The dynamic placeholder result was not added in the
editable dom in some situation. When the editor was
in rollback mode `true` after a `commitChange`
( maybe because of a `_toInline` called) the result
of the dynamic placeholder was rollback.

task-3044924

closes odoo/odoo#104343

X-original-commit: e9bd4f020ff4a5dd4240fde9caef0bded9a2e28c
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Signed-off-by: Geelen Sébastien (sge) <sge@odoo.com>
2022-10-28 09:17:40 +02:00
Joseph Caburnay c412f11c02 [REF] web,web_*: import owl features using "@odoo/owl" module
In @odoo-module files, we do the following conversion:

`const { ... } = owl;` -> `import { ... } from "@odoo/owl"`.

While in legacy odoo module (odoo.define):

`const { ... } = owl;` -> `const { ... } = require("@odoo/owl");`.

closes odoo/odoo#104260

Task-id: 3032274
Related: odoo/enterprise#33298
Signed-off-by: Géry Debongnie <ged@odoo.com>
Signed-off-by: Joseph Caburnay (jcb) <jcb@odoo.com>
2022-10-27 14:41:17 +02:00