Remove element not found notification (#350)

* Notification was kind of vague * Replaced it with alert on the right panel that tells the user when they can't do the basic interactions with an element
appium · Nov 21, 2017 · b0ba4ac · b0ba4ac
1 parent 5f44c43
commit b0ba4ac
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 11 deletions.
diff --git a/app/renderer/actions/Inspector.js b/app/renderer/actions/Inspector.js
@@ -16,6 +16,7 @@ export const SESSION_DONE = 'SESSION_DONE';
 export const SELECT_ELEMENT = 'SELECT_ELEMENT';
 export const UNSELECT_ELEMENT = 'UNSELECT_ELEMENT';
 export const SET_SELECTED_ELEMENT_ID = 'SET_SELECTED_ELEMENT_ID';
+export const SET_INTERACTIONS_NOT_AVAILABLE = 'SET_INTERACTIONS_NOT_AVAILABLE';
 export const METHOD_CALL_REQUESTED = 'METHOD_CALL_REQUESTED';
 export const METHOD_CALL_DONE = 'METHOD_CALL_DONE';
 export const SET_FIELD_VALUE = 'SET_FIELD_VALUE';
@@ -124,14 +125,9 @@ const findElement = _.debounce(async function (strategyMap, dispatch, getState,
     if (elementId && getState().inspector.selectedElementPath === path) {
       return dispatch({type: SET_SELECTED_ELEMENT_ID, elementId, variableName, variableType});
     }
-  }
 
-  // If we couldn't find the element, show a notification
-  notification.error({
-    message: 'Error',
-    description: 'Could not find element. Try refreshing page',
-    duration: 0,
-  });
+    return dispatch({type: SET_INTERACTIONS_NOT_AVAILABLE});
+  }
 }, 1000);
 
 export function selectElement (path) {

diff --git a/app/renderer/components/Inspector/SelectedElement.js b/app/renderer/components/Inspector/SelectedElement.js
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import _ from 'lodash';
 import { getLocators } from './shared';
 import styles from './Inspector.css';
-import { Button, Row, Col, Input, Modal, Table, Alert } from 'antd';
+import { Button, Row, Col, Input, Modal, Table, Alert, Spin } from 'antd';
 
 const ButtonGroup = Button.Group;
 
@@ -26,7 +26,7 @@ export default class SelectedElement extends Component {
 
   render () {
     const {applyClientMethod, setFieldValue, sendKeys, selectedElement, sendKeysModalVisible, showSendKeysModal, 
-      hideSendKeysModal, selectedElementId:elementId, sourceXML} = this.props;
+      hideSendKeysModal, selectedElementId:elementId, sourceXML, elementInteractionsNotAvailable} = this.props;
     const {attributes, xpath} = selectedElement;
 
     // Get the columns for the attributes table
@@ -84,10 +84,15 @@ export default class SelectedElement extends Component {
     }
 
     return <div>
+      {elementInteractionsNotAvailable && <Row type="flex" gutter={10}> 
+        <Col>
+          <Alert type="info" message="Interactions are not available for this element" showIcon />
+        </Col>
+      </Row>}
       <Row justify="center" type="flex" align="middle" gutter={10} className={styles.elementActions}>
         <Col>
           <ButtonGroup size="small">
-            <Button disabled={!elementId} id='btnTapElement' onClick={() => applyClientMethod({methodName: 'click', elementId})}>Tap</Button>
+            <Button disabled={!elementId} icon={!elementInteractionsNotAvailable && !elementId && 'loading'} id='btnTapElement' onClick={() => applyClientMethod({methodName: 'click', elementId})}>Tap</Button>
             <Button disabled={!elementId} id='btnSendKeysToElement' onClick={() => showSendKeysModal()}>Send Keys</Button>
             <Button disabled={!elementId} id='btnClearElement' onClick={() => applyClientMethod({methodName: 'clear', elementId})}>Clear</Button>
           </ButtonGroup>

diff --git a/app/renderer/reducers/Inspector.js b/app/renderer/reducers/Inspector.js
@@ -1,7 +1,7 @@
 import { omit } from 'lodash';
 
 import { SET_SOURCE_AND_SCREENSHOT, QUIT_SESSION_REQUESTED, QUIT_SESSION_DONE,
-  SESSION_DONE, SELECT_ELEMENT, UNSELECT_ELEMENT, SELECT_HOVERED_ELEMENT, SET_SELECTED_ELEMENT_ID,
+  SESSION_DONE, SELECT_ELEMENT, UNSELECT_ELEMENT, SELECT_HOVERED_ELEMENT, SET_SELECTED_ELEMENT_ID, SET_INTERACTIONS_NOT_AVAILABLE,
   UNSELECT_HOVERED_ELEMENT, METHOD_CALL_REQUESTED, METHOD_CALL_DONE,
   SET_FIELD_VALUE, SET_EXPANDED_PATHS, SHOW_SEND_KEYS_MODAL,
   HIDE_SEND_KEYS_MODAL, START_RECORDING, PAUSE_RECORDING, CLEAR_RECORDING,
@@ -81,6 +81,7 @@ export default function inspector (state=INITIAL_STATE, action) {
         selectedElementId: null,
         selectedElementVariableName: null,
         selectedElementVariableType: null,
+        elementInteractionsNotAvailable: false,
       };
 
     case UNSELECT_ELEMENT:
@@ -101,6 +102,12 @@ export default function inspector (state=INITIAL_STATE, action) {
         selectedElementVariableType: action.variableType,
       };
 
+    case SET_INTERACTIONS_NOT_AVAILABLE:
+      return {
+        ...state,
+        elementInteractionsNotAvailable: true,
+      };
+
     case SELECT_HOVERED_ELEMENT:
       return {
         ...state,