appium-webdriveragent-driver/WebDriverAgent/Inspector/js/inspector.js

Appium driver for WebDriverAgent

/**
 * Copyright (c) 2015-present, Facebook, Inc.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree. An additional grant
 * of patent rights can be found in the PATENTS file in the same directory.
 */

import React from 'react';

require('css/inspector.css');

function boolToString(boolValue) {
  return boolValue == '1' ? 'Yes' : 'No'
}

class Inspector extends React.Component {
  render() {
    return (
      <div id="inspector" className="section third">
        <div className="section-caption">
          Inspector
        </div>
        <div className="section-content-container">
          <div className="section-content">
            {this.renderInspector()}
          </div>
        </div>
      </div>
    );
  }

  renderInspector() {
    if (this.props.selectedNode == null) {
      return null;
    }

    const attributes = this.props.selectedNode.attributes;
    return (
      <div>
        {this.renderField('Class', attributes.class)}
        {this.renderField('HasKeyboardFocus', boolToString(attributes.hasKeyboardFocus))}
        {this.renderField('IsEnabled', boolToString(attributes.isEnabled))}
        {this.renderField('IsValid', boolToString(attributes.isValid))}
        {this.renderField('Name', attributes.name)}
        {this.renderField('Rect', attributes.rect)}
      </div>
    );
  }

  renderField(fieldName, fieldValue) {    
    if (fieldValue == null) {
      return null;
    }
    return (
      <div className="inspector-field">
        <div className="inspector-field-caption">
          {fieldName}:
        </div>
        <div className="inspector-field-value">
          {fieldValue}
        </div>
      </div>
    );
  }
}

Inspector.propTypes = {
  selectedNode: React.PropTypes.object,
};

module.exports = Inspector;