Fixes dev tools inspect element functionality

Resolves brave#10249

Auditors:

Test Plan:

app/browser/reducers/tabsReducer.js

@@ -256,6 +256,11 @@ const tabsReducer = (state, action, immutableAction) => {
         tabs.toggleDevTools(action.get('tabId'))
       })
       break
+    case appConstants.APP_INSPECT_ELEMENT:
+      setImmediate(() => {
+        tabs.inspectElement(action.get('tabId'), action.get('x'), action.get('y'))
+      })
+      break
     case appConstants.APP_LOAD_URL_REQUESTED:
       setImmediate(() => {
         tabs.loadURL(action)

app/browser/tabs.js

@@ -525,6 +525,13 @@ const api = {
     }
   },
 
+  inspectElement: (tabId, x, y) => {
+    const tab = getWebContents(tabId)
+    if (tab && !tab.isDestroyed()) {
+      tab.inspectElement(x, y)
+    }
+  },
+
   setActive: (tabId) => {
     let tab = getWebContents(tabId)
     if (tab && !tab.isDestroyed()) {

js/actions/appActions.js

@@ -867,6 +867,21 @@ const appActions = {
     })
   },
 
+  /**
+   * Dispatches a message to inspect desired element on the page
+   * @param {number} tabId - The tabId
+   * @param {number} x - horizontal position of the element
+   * @param {number} y - vertical position of the element
+   */
+  inspectElement: function (tabId, x, y) {
+    dispatch({
+      actionType: appConstants.APP_INSPECT_ELEMENT,
+      tabId,
+      x,
+      y
+    })
+  },
+
   /**
    * Dispatches a message when a tab is being cloned
    * @param {number} tabId - The tabId of the tab to clone

js/actions/webviewActions.js

@@ -20,18 +20,6 @@ const webviewActions = {
     }
   },
 
-  /**
-   * Inspect the element for the active webview at the x, y content position
-   * @param {number} x - horizontal position of the element to inspect
-   * @param {number} y - vertical position of the element to inspect
-   */
-  inspectElement: function (x, y) {
-    const webview = getWebview()
-    if (webview) {
-      webview.inspectElement(x, y)
-    }
-  },
-
   /**
    * Shows the certificate infomation
    */

js/constants/appConstants.js

@@ -150,7 +150,8 @@ const appConstants = {
   APP_REMOVE_BOOKMARK_FOLDER: _,
   APP_REMOVE_BOOKMARK: _,
   APP_MOVE_BOOKMARK_FOLDER: _,
-  APP_MOVE_BOOKMARK: _
+  APP_MOVE_BOOKMARK: _,
+  APP_INSPECT_ELEMENT: _
 }
 
 module.exports = mapValuesByKeys(appConstants)

js/contextMenus.js

@@ -1154,8 +1154,8 @@ function mainTemplateInit (nodeProps, frame, tab) {
   if (!isAboutPage) {
     template.push({
       label: locale.translation('inspectElement'),
-      click: (item) => {
-        webviewActions.inspectElement(nodeProps.x, nodeProps.y)
+      click: () => {
+        appActions.inspectElement(frame.get('tabId'), nodeProps.x, nodeProps.y)
       }
     })
   }