From 2989ef360a9a63b40ef467297b2ba3ec6bf21961 Mon Sep 17 00:00:00 2001
From: Joseph Caburnay <jcb@odoo.com>
Date: Thu, 30 Mar 2023 14:25:07 +0000
Subject: [PATCH] [FIX] point_of_sale: edit list popup failed to show

When trying to add a product that requires specifying lot/serial numbers,
the popup to list the numbers failed to display. This is because there
is no longer `el` in component. We need to explicitly reference the element
we need. This commit introduces a t-ref in the root element of the EditListPopup
to have a reference to it from the useAutoFocusToLast hook to fix the issue.

closes odoo/odoo#117465

X-original-commit: 2a6368e7b72da5a64705cbc3c1f5d44b85677ab0
Signed-off-by: Trinh Jacky (trj) <trj@odoo.com>
Signed-off-by: Joseph Caburnay (jcb) <jcb@odoo.com>
---
 addons/point_of_sale/static/src/js/custom_hooks.js       | 9 ++++++---
 .../static/src/xml/Popups/EditListPopup.xml              | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/addons/point_of_sale/static/src/js/custom_hooks.js b/addons/point_of_sale/static/src/js/custom_hooks.js
index 23c91f118e4..b31b8f4688e 100644
--- a/addons/point_of_sale/static/src/js/custom_hooks.js
+++ b/addons/point_of_sale/static/src/js/custom_hooks.js
@@ -3,7 +3,7 @@ import { OfflineErrorPopup } from "./Popups/OfflineErrorPopup";
 import { ConfirmPopup } from "./Popups/ConfirmPopup";
 import { ErrorTracebackPopup } from "./Popups/ErrorTracebackPopup";
 import { ErrorPopup } from "./Popups/ErrorPopup";
-import { useEnv, onMounted, onPatched, useComponent } from "@odoo/owl";
+import { useEnv, onMounted, onPatched, useComponent, useRef } from "@odoo/owl";
 
 /**
  * Introduce error handlers in the component.
@@ -75,12 +75,15 @@ export function useErrorHandlers() {
     };
 }
 
+/**
+ * Assumes t-ref="root" in the root element of the component that uses this hook.
+ */
 export function useAutoFocusToLast() {
-    const current = useComponent();
+    const root = useRef("root");
     let target = null;
     function autofocus() {
         const prevTarget = target;
-        const allInputs = current.el.querySelectorAll("input");
+        const allInputs = root.el.querySelectorAll("input");
         target = allInputs[allInputs.length - 1];
         if (target && target !== prevTarget) {
             target.focus();
diff --git a/addons/point_of_sale/static/src/xml/Popups/EditListPopup.xml b/addons/point_of_sale/static/src/xml/Popups/EditListPopup.xml
index f7fd964e579..17c6a9b9bc5 100644
--- a/addons/point_of_sale/static/src/xml/Popups/EditListPopup.xml
+++ b/addons/point_of_sale/static/src/xml/Popups/EditListPopup.xml
@@ -2,7 +2,7 @@
 <templates id="template" xml:space="preserve">
 
     <t t-name="EditListPopup" owl="1">
-        <div class="popup popup-text edit-list-popup">
+        <div class="popup popup-text edit-list-popup" t-ref="root">
             <header class="title">
                 <t t-esc="props.title" />
                 <span class="sub-title" t-esc="props.name"/>