From 20240cd328fd7f989a8663eb53ecc8cdde21bfa5 Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Fri, 26 Apr 2024 19:31:36 -0500
Subject: [PATCH] try to fix scroll-to by using `scrollTo` instead of
 `scrollIntoView`

---
 .../Invocation/Graph/WorkflowInvocationSteps.vue      | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/client/src/components/Workflow/Invocation/Graph/WorkflowInvocationSteps.vue b/client/src/components/Workflow/Invocation/Graph/WorkflowInvocationSteps.vue
index c161ba38df4c..febb69008e06 100644
--- a/client/src/components/Workflow/Invocation/Graph/WorkflowInvocationSteps.vue
+++ b/client/src/components/Workflow/Invocation/Graph/WorkflowInvocationSteps.vue
@@ -61,15 +61,10 @@ watch(
         // on full page view, scroll to the active step card in the steps section
         if (props.isFullPage) {
             if (nodeId !== undefined && card) {
-                // scroll to the input steps header
-                if (isAnInput) {
-                    const inputHeader = stepsDiv.value?.querySelector(`.invocation-inputs-header`);
-                    inputHeader?.scrollIntoView({ behavior: "smooth" });
-                }
-
                 // scroll to the active step card
                 const stepCard = stepsDiv.value?.querySelector(`[data-index="${props.activeNodeId}"]`);
-                stepCard?.scrollIntoView();
+                const portletHeaderDiv = stepCard?.querySelector(".portlet-header");
+                stepsDiv.value?.scrollTo({ top: portletHeaderDiv?.getBoundingClientRect().top });
             }
         }
         // clear any job being shown
@@ -88,7 +83,7 @@ function showJob(jobId: string | undefined) {
         <!-- Input Steps grouped in a separate portlet -->
         <div v-if="workflowInputSteps.length > 1" class="ui-portlet-section w-100">
             <div
-                class="portlet-header portlet-operations invocation-inputs-header"
+                class="portlet-header portlet-operations"
                 role="button"
                 tabindex="0"
                 @keyup.enter="expandInvocationInputs = !expandInvocationInputs"