From a7f38cde881d1d07b8f753d6d23ffef2fc612e22 Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Fri, 15 Oct 2021 15:38:52 +0100
Subject: [PATCH] fix e2e walkthrough test failures

---
 apps/remix-ide/src/walkthroughService.js             |  8 ++++----
 .../src/lib/remix-ui-vertical-icons-panel.tsx        | 12 ++++++------
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/apps/remix-ide/src/walkthroughService.js b/apps/remix-ide/src/walkthroughService.js
index e02fe226cf..2e5e9a8305 100644
--- a/apps/remix-ide/src/walkthroughService.js
+++ b/apps/remix-ide/src/walkthroughService.js
@@ -6,8 +6,8 @@ export class WalkthroughService {
   }
 
   start (params) {
-    if (!localStorage.getItem('hadTour_initial')) {
-      document.addEventListener('doWalkThrough', (e) => {
+    document.addEventListener('doWalkThrough', (e) => {
+      if (!localStorage.getItem('hadTour_initial')) {
         introJs().setOptions({
           steps: [{
             title: 'Welcome to Remix IDE',
@@ -47,8 +47,8 @@ export class WalkthroughService {
           }
         }).start()
         localStorage.setItem('hadTour_initial', true)
-      })
-    }
+      }
+    })
   }
 
   startFeatureTour () {
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/remix-ui-vertical-icons-panel.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/remix-ui-vertical-icons-panel.tsx
index 1ca097ed94..557b6cfd1f 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/remix-ui-vertical-icons-panel.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/remix-ui-vertical-icons-panel.tsx
@@ -4,7 +4,8 @@ import React, {
   Fragment,
   useEffect,
   useReducer,
-  useRef
+  useRef,
+  useState
 } from 'react'
 
 import './remix-ui-vertical-icons-panel.css'
@@ -24,7 +25,7 @@ export function RemixUiVerticalIconsPanel ({
 }: RemixUiVerticalIconsPanelProps) {
   const scrollableRef = useRef<any>()
   const iconPanelRef = useRef<any>()
-  const udappPanelRef = useRef<any>()
+  // const [first] = useState(localStorage.getItem('firstTime'))
 
   function onThemeChanged (themeType: any) {
     const invert = themeType === 'dark' ? 1 : 0
@@ -90,12 +91,11 @@ export function RemixUiVerticalIconsPanel ({
 
   useEffect(() => {
     const found = iconPanelRef.current!.querySelector('#verticalIconsKindudapp')
-    if (found) {
-      console.log('emit event now as vertical panel is in the viewport', found)
+    if (verticalIconsPlugin.targetProfileForChange && verticalIconsPlugin.targetProfileForChange.udapp) {
       const doWalkThroughEvent = new Event('doWalkThrough')
       document.dispatchEvent(doWalkThroughEvent)
     }
-  })
+  }, [Object.keys(verticalIconsPlugin.targetProfileForChange).length])
 
   return (
     <div id="iconsP" className="h-100">
@@ -178,7 +178,7 @@ export function RemixUiVerticalIconsPanel ({
               .map(p => (
                 <div id="runIcons" data-id="verticalIconsKindUdapp" key={
                   verticalIconsPlugin.targetProfileForChange[p].displayName
-                } ref={udappPanelRef}
+                }
                 >
                   <Icon
                     kind={verticalIconsPlugin.targetProfileForChange[p].kind}