Fix: Clearing sketch DOM elements after redirecting to the home page (#4965)

* fix: clear the previous DOM elements after page redirect

* fix: removed await delay since it can take awhile to destroy the sketch

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* fix: added E2E test which actually caught a logic bug, moved the logic to the correct location

* fix: removing unused import

* fix: push main back...

* fix: restoring code to old state

* fix: moved cleanup code

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

e2e/playwright/sketch-tests.spec.ts

@@ -1405,3 +1405,46 @@ test.describe(`Click based selection don't brick the app when clicked out of ran
     })
   })
 })
+
+// Regression test for https://github.com/KittyCAD/modeling-app/issues/4372
+test.describe('Redirecting to home page and back to the original file should clear sketch DOM elements', () => {
+  test('Can redirect to home page and back to original file and have a cleared DOM', async ({
+    context,
+    page,
+    scene,
+    toolbar,
+    editor,
+    homePage,
+  }) => {
+    // We seed the scene with a single offset plane
+    await context.addInitScript(() => {
+      localStorage.setItem(
+        'persistCode',
+        ` sketch001 = startSketchOn('XZ')
+|> startProfileAt([256.85, 14.41], %)
+|> lineTo([0, 211.07], %)
+`
+      )
+    })
+    await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
+
+    const [objClick] = scene.makeMouseHelpers(634, 274)
+    await objClick()
+
+    // Enter sketch mode
+    await toolbar.editSketch()
+
+    await expect(page.getByText('323.49')).toBeVisible()
+
+    // Open navigation side bar
+    await page.getByTestId('project-sidebar-toggle').click()
+    const goToHome = page.getByRole('button', {
+      name: 'Go to Home',
+    })
+
+    await goToHome.click()
+    await homePage.openProject('testDefault')
+    await expect(page.getByText('323.49')).not.toBeVisible()
+  })
+})

src/clientSideScene/ClientSideSceneComp.tsx

@@ -124,6 +124,14 @@ export const ClientSideScene = ({
         'mouseup',
         toSync(sceneInfra.onMouseUp, reportRejection)
       )
+      sceneEntitiesManager
+        .tearDownSketch()
+        .then(() => {
+          // no op
+        })
+        .catch((e) => {
+          console.error(e)
+        })
     }
   }, [])
 

src/components/RouteProvider.tsx

@@ -9,6 +9,7 @@ export function RouteProvider({ children }: { children: ReactNode }) {
   const [first, setFirstState] = useState(true)
   const navigation = useNavigation()
   const location = useLocation()
+
   useEffect(() => {
     // On initialization, the react-router-dom does not send a 'loading' state event.
     // it sends an idle event first.