[FIX] web_editor: allow fullscreen editor even when inside modal

The new editor of https://github.com/odoo/odoo/pull/29775

 came with a
fullscreen option. When using the toggle when the editor is in inside
a modal, the editor stretched only to match the size of the modal
instead of the viewport.

This is because the 'position: fixed' rule which is used to achieve the
fullscreen layout cannot work if a parent of the element has a CSS
transform applied on it. Indeed in that case, that element acts like the
viewport for 'position: fixed' elements.

closes odoo/odoo#34272

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js

@@ -68,6 +68,8 @@ Wysiwyg.include({
         }
         $(document.body).off('.' + this.id);
 
+        this.$iframe.parents().removeClass('o_wysiwyg_no_transform');
+
         this.$target.insertBefore(this.$iframe);
 
         delete window.top[this._onUpdateIframeId];
@@ -100,6 +102,10 @@ Wysiwyg.include({
                 }
                 self.$iframe.toggleClass('o_fullscreen');
                 self.$iframe.contents().find('body').toggleClass('o_fullscreen');
+
+                // Hack to avoid a parent of the fullscreen iframe to have a
+                // transform (otherwise the position: fixed won't work)
+                self.$iframe.parents().toggleClass('o_wysiwyg_no_transform');
             },
             isFullscreen: function () {
                 if (!self.$iframe) {

addons/web_editor/static/src/scss/wysiwyg_iframe.scss

@@ -10,6 +10,10 @@ iframe.wysiwyg_iframe.o_fullscreen {
     border: 0;
 }
 
+.o_wysiwyg_no_transform {
+    transform: none !important;
+}
+
 body.o_in_iframe {
     background-color: $o-view-background-color;
     overflow: hidden;