bluetooth: Add descriptor list to DeviceDetailsPage on internals page.

chrome/browser/resources/bluetooth_internals/characteristic_list.js

 // Copyright 2017 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * Javascript for CharacteristicList and CharacteristicListItem, served from
  *     chrome://bluetooth-internals/.
  */
 
 cr.define('characteristic_list', function() {
@@ skipping 27 matching lines @@
     write_encrypted_authenticated: 'Write Encrypted Authenticated',
   };
 
   /**
    * A list item that displays the properties of a CharacteristicInfo object.
    * Two fieldsets are created within the element: one for the primitive
    * properties, 'id' and 'uuid', and one for the 'properties' bitfield in the
    * CharacteristicInfo object.
    * @constructor
    * @param {!interfaces.BluetoothDevice.CharacteristicInfo} characteristicInfo
+   * @param {string} deviceAddress
+   * @param {string} serviceId
    */
-  function CharacteristicListItem(characteristicInfo) {
+  function CharacteristicListItem(
+      characteristicInfo, deviceAddress, serviceId) {
     var listItem = new ExpandableListItem();
     listItem.__proto__ = CharacteristicListItem.prototype;
 
     listItem.info = characteristicInfo;
+    listItem.deviceAddress_ = deviceAddress;

[Dan Beam, 2017/01/24 06:07:29]

can we add type definitions for these properties in the class itself (or here, I
guess) or pass these into the ctor?

it's hard to differentiate between setting private instance properties on some
far away class or one in this file.

[mbrunson, 2017/01/24 21:29:46]

Done.

+    listItem.serviceId_ = serviceId;
     listItem.decorate();
 
     return listItem;
   }
 
   CharacteristicListItem.prototype = {
     __proto__: ExpandableListItem.prototype,
 
     /**
      * Decorates the element as a characteristic list item. Creates and caches
@@ skipping 32 matching lines @@
         writable_auxiliaries: (this.info.properties &
             Property.WRITABLE_AUXILIARIES) > 0,
         read_encrypted: (this.info.properties & Property.READ_ENCRYPTED)  > 0,
         write_encrypted: (this.info.properties & Property.WRITE_ENCRYPTED)  > 0,
         read_encrypted_authenticated: (this.info.properties &
             Property.READ_ENCRYPTED_AUTHENTICATED) > 0,
         write_encrypted_authenticated: (this.info.properties &
             Property.WRITE_ENCRYPTED_AUTHENTICATED) > 0,
       });
 
+      /** @private {!descriptor_list.DescriptorList} */
+      this.descriptorList_ = new descriptor_list.DescriptorList();
+
       // Create content for display in brief content container.
       var characteristicHeaderText = document.createElement('div');
       characteristicHeaderText.textContent = 'Characteristic:';
 
       var characteristicHeaderValue = document.createElement('div');
       characteristicHeaderValue.textContent = this.info.uuid.uuid;
 
       var characteristicHeader = document.createElement('div');
       characteristicHeader.appendChild(characteristicHeaderText);
       characteristicHeader.appendChild(characteristicHeaderValue);
       this.briefContent_.appendChild(characteristicHeader);
 
       // Create content for display in expanded content container.
       var characteristicInfoHeader = document.createElement('h4');
       characteristicInfoHeader.textContent = 'Characteristic Info';
 
       var characteristicDiv = document.createElement('div');
       characteristicDiv.classList.add('flex');
       characteristicDiv.appendChild(this.characteristicFieldSet_);
 
       var propertiesHeader = document.createElement('h4');
       propertiesHeader.textContent = 'Properties';
 
       var propertiesDiv = document.createElement('div');
       propertiesDiv.classList.add('flex');
       propertiesDiv.appendChild(this.propertiesFieldSet_);
 
+      var descriptorsHeader = document.createElement('h4');
+      descriptorsHeader.textContent = 'Descriptors';
+
       var infoDiv = document.createElement('div');
       infoDiv.classList.add('info-container');
       infoDiv.appendChild(characteristicInfoHeader);
       infoDiv.appendChild(characteristicDiv);
       infoDiv.appendChild(propertiesHeader);
       infoDiv.appendChild(propertiesDiv);
+      infoDiv.appendChild(descriptorsHeader);
+      infoDiv.appendChild(this.descriptorList_);
 
       this.expandedContent_.appendChild(infoDiv);
     },
+
+    /** @override */
+    onExpandInternal: function(expanded) {
+      this.descriptorList_.load(
+          this.deviceAddress_, this.serviceId_, this.info.id);
+    },
   };
 
   /**
    * A list that displays CharacteristicListItems.
    * @constructor
    */
   var CharacteristicList = cr.ui.define('list');
 
   CharacteristicList.prototype = {
     __proto__: ExpandableList.prototype,
 
     /** @override */
     decorate: function() {
       ExpandableList.prototype.decorate.call(this);
 
       /** @private {boolean} */
       this.characteristicsRequested_ = false;
 
       this.classList.add('characteristic-list');
       this.setEmptyMessage('No Characteristics Found');
     },
 
     /** @override */
     createItem: function(data) {
-      return new CharacteristicListItem(data);
+      return new CharacteristicListItem(
+          data, this.deviceAddress_, this.serviceId_);
     },
 
     /**
      * Loads the characteristic list with an array of CharacteristicInfo from
      * the device with |deviceAddress| and service with |serviceId|. If no
      * active connection to the device exists, one is created.
      * @param {string} deviceAddress
      * @param {string} serviceId
      */
     load: function(deviceAddress, serviceId) {
       if (this.characteristicsRequested_ || !this.isLoading())
         return;
 
+      this.deviceAddress_ = deviceAddress;
+      this.serviceId_ = serviceId;
       this.characteristicsRequested_ = true;
 
       device_broker.connectToDevice(deviceAddress).then(function(device) {
         return device.getCharacteristics(serviceId);
       }.bind(this)).then(function(response) {
         this.setData(new ArrayDataModel(response.characteristics));
         this.setLoading(false);
         this.characteristicsRequested_ = false;
       }.bind(this)).catch(function(error) {
         this.characteristicsRequested_ = false;
         Snackbar.show(
             deviceAddress + ': ' + error.message, SnackbarType.ERROR, 'Retry',
             function() {
               this.load(deviceAddress, serviceId);
             }.bind(this));
       }.bind(this));
     },
   };
 
   return {
     CharacteristicList: CharacteristicList,
     CharacteristicListItem: CharacteristicListItem,
   };
-});
+});