Fix the back/forward button on topbar (#3719)

* Check only webcontent type === 'window' instead of using webContents.getFocusedWebContents(), as other webview can capture focus

Signed-off-by: Hung-Han (Henry) Chen <chenhungh@gmail.com>

* Update test

Signed-off-by: Hung-Han (Henry) Chen <chenhungh@gmail.com>

src/renderer/components/layout/__tests__/topbar.test.tsx

@@ -50,11 +50,12 @@ const goForward = jest.fn();
 jest.mock("@electron/remote", () => {
   return {
     webContents: {
-      getFocusedWebContents: () => {
-        return {
+      getAllWebContents: () => {
+        return [{
+          getType: () => "window",
           goBack,
           goForward
-        };
+        }];
       }
     }
   };

src/renderer/components/layout/topbar.tsx

@@ -69,11 +69,11 @@ export const TopBar = observer(({ children, ...rest }: Props) => {
   };
 
   const goBack = () => {
-    webContents.getFocusedWebContents()?.goBack();
+    webContents.getAllWebContents().find((webContent) => webContent.getType() === "window")?.goBack();
   };
 
   const goForward = () => {
-    webContents.getFocusedWebContents()?.goForward();
+    webContents.getAllWebContents().find((webContent) => webContent.getType() === "window")?.goForward();
   };
 
   useEffect(() => {

src/renderer/remote-helpers/history-updater.ts

@@ -26,7 +26,25 @@ import { navigation } from "../navigation";
 
 export function watchHistoryState() {
   return reaction(() => navigation.location, () => {
-    broadcastMessage("history:can-go-back", webContents.getFocusedWebContents()?.canGoBack());
-    broadcastMessage("history:can-go-forward", webContents.getFocusedWebContents()?.canGoForward());
+    const getAllWebContents = webContents.getAllWebContents();
+
+    const canGoBack = getAllWebContents.some((webContent) => {
+      if (webContent.getType() === "window") {
+        return webContent.canGoBack();
+      }
+
+      return false;
+    });
+
+    const canGoForward = getAllWebContents.some((webContent) => {
+      if (webContent.getType() === "window") {
+        return webContent.canGoForward();
+      }
+
+      return false;
+    });
+
+    broadcastMessage("history:can-go-back", canGoBack);
+    broadcastMessage("history:can-go-forward", canGoForward);
   });
 }