[FIX] web_editor: fix LinkPopover in iframe on Firefox
Prior to this commit and on Firefox 109, clicking on a link while in edit mode on the website app would trigger a traceback. This is caused by the fact that the LinkPopover widget is contained inside the iframe while use the ClipboardJS global defined in the top window. Indeed, ClipboardJS checks if the target (the button to copy the link) is an HTMLElement. To do so, it uses the "instanceof" keyword. However, the __proto__ (what is used for computing instanceof) of the target is different depending on the browser. For Chrome, the HTMLElement's __proto__ depends on which "document" it was created. On Firefox, when attaching an element to a parent, it will switch __proto__ to the one from the frame from which it is attached. To fix this, we use the ClipboardJS from the element's instance window. In any case, using instanceof when working with iframe is a bad idea, see [1]. In this case, the fix is made because ClipboardJS is an external library. Steps to reproduce: - Download Firefox 109+ - Go on Website and switch to edit mode - Click on a Link : A traceback appears. [1]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/instanceof#instanceof_and_multiple_realms closes odoo/odoo#111266 X-original-commit: 732848f2b52bea4ebae18cb5adedf581d5112aa6 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com> Signed-off-by: Arthur Detroux (ard) <ard@odoo.com>
This commit is contained in:
committed by
qsm-odoo
parent
e72fb7aec0
commit
c2932dfcfe
@@ -38,7 +38,15 @@ const LinkPopoverWidget = Widget.extend({
|
||||
this.$fullUrl = this.$('.o_we_full_url');
|
||||
|
||||
// Copy onclick handler
|
||||
const clipboard = new ClipboardJS(
|
||||
// ClipboardJS uses "instanceof" to verify the elements passed to its
|
||||
// constructor. Unfortunately, when the element is within an iframe,
|
||||
// instanceof is not behaving the same across all browsers.
|
||||
const containerWindow = this.container.ownerDocument.defaultView;
|
||||
let _ClipboardJS = ClipboardJS;
|
||||
if (this.$copyLink[0] instanceof containerWindow.HTMLElement) {
|
||||
_ClipboardJS = containerWindow.ClipboardJS;
|
||||
}
|
||||
const clipboard = new _ClipboardJS(
|
||||
this.$copyLink[0],
|
||||
{text: () => this.target.href} // Absolute href
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user