[FIX] web: prevent crash when closing the emoji picker

Currently, the emoji picker uses the `onWillUnmount` hook to detect when
the popover element is closed. The code defined in this hook accesses the
component's DOM and retrieves the scroll offset of the emoji picker's
scroll view. The scroll offset will then be saved and restored the next
time the emoji picker is opened by the user.

Unfortunately, it happens that the emoji picker's scroll view is no longer
in the DOM when the popover is closed and when the callback function
passed to the `onWillUnmount` hook is called. When this happens, the
system will log an error to the console (`TypeError: this.gridRef.el
is null`) and the user will not be able to reopen the emoji picker.

To fix this, we simply check that the emoji picker's scroll view exists
before retrieving the scroll offset of the element in the `onWillUnmount`
hook. This fix will prevent the error while keeping the code simple.

Steps to reproduce the issue:
1. Click on the article emoji
2. Click out of the dropdown to close it
3. Click on the article emoji again

=> The emoji picker no longer appear.

TO BE: The emoji picker should reappear when the user clicks on the emoji.

task-3818728

closes odoo/odoo#160353

X-original-commit: 6ae04b576a3f3b74febf029383c0f6d9ca5744cf
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
Signed-off-by: Julien Banken (jbn) <jbn@odoo.com>
This commit is contained in:
Julien Banken
2024-04-04 08:18:54 +00:00
parent e5b4674d94
commit b1b836856c
@@ -212,7 +212,7 @@ export class EmojiPicker extends Component {
() => [this.searchTerm]
);
onWillUnmount(() => {
if (this.emojis.length === 0) {
if (!this.gridRef.el) {
return;
}
if (this.props.storeScroll) {