Bug fix

PiperOrigin-RevId: 275565691

tensorflow_model_analysis/addons/fairness/frontend/fairness-metrics-board/fairness-metrics-board.js

@@ -65,7 +65,7 @@ export class FairnessMetricsBoard extends PolymerElement {
       thresholds: {type: Array, observer: 'thresholdsChanged_'},
 
       /** @type {string} */
-      baseline_: {type: String, value: 'Overall'},
+      baseline_: {type: String, computed: 'computeBaseline_(slices_)'},
 
       /**
        * The list of all slice names.
@@ -104,24 +104,44 @@ export class FairnessMetricsBoard extends PolymerElement {
     };
   }
 
+
+  /**
+   * Extracts the baseline slice name.
+   * @param {!Array<string>} slices
+   * @return {string|undefined}
+   * @private
+   */
+  computeBaseline_(slices) {
+    if (!slices) {
+      return;
+    }
+    return slices[0];
+  }
+
   /**
    * Extracts the names of the slices from the data.
    * @param {!Array<!Object>} data
-   * @return {!Array<string>}
+   * @return {!Array<string>|undefined}
    * @private
    */
   computeSlices_(data) {
+    if (!data) {
+      return;
+    }
     return data.filter(d => !d['metrics'][OMITTED_SLICE_ERROR_KEY])
         .map(d => d['slice']);
   }
 
   /**
    * Extracts the names of the slices omitted to ensure privacy.
    * @param {!Array<!Object>} data
-   * @return {!Array<string>}
+   * @return {!Array<string>|undefined}
    * @private
    */
   computeOmittedSlices_(data) {
+    if (!data) {
+      return;
+    }
     return data.filter(d => d['metrics'][OMITTED_SLICE_ERROR_KEY])
         .map(d => d['slice']);
   }

tensorflow_model_analysis/addons/fairness/frontend/fairness-metrics-table/fairness-metrics-table.js

@@ -93,10 +93,13 @@ export class FairnessMetricsTable extends PolymerElement {
    * @param {!Object} data
    * @param {!Array<string>} metrics
    * @param {!Object<string>} headerOverride
-   * @return {!Array<!Array>}
+   * @return {!Array<!Array>|undefined}
    * @private
    */
   computePlotData_(data, metrics, headerOverride) {
+    if (!data || !metrics || !headerOverride) {
+      return undefined;
+    }
     if (Object.keys(data).length == 0) {
       // No need to compute plot data if data is empty.
       return [[]];

tensorflow_model_analysis/addons/fairness/frontend/fairness-nb-container/fairness-nb-container.js

@@ -106,7 +106,7 @@ export class FairnessNbContainer extends SelectEventMixin
       /**
        * The full names of metrics available. eg: auc, [email protected] or
        * post_export_metrics/head_1/[email protected].
-       * @private {!Array<string>}
+       * @private {!Array<string>|undefined}
        */
       availableMetricsNames_: {
         type: Array,
@@ -138,24 +138,18 @@ export class FairnessNbContainer extends SelectEventMixin
     };
   }
 
-  static get observers() {
-    return [
-      'updateSelectableMetricsAndThresholds_(availableMetricsNames_)',
-    ];
-  }
-
   /**
    * @param {!Array<!Object>} slicingMetrics
    * @return {undefined}
    * @private
    */
   slicingMetricsChanged_(slicingMetrics) {
-    if (!slicingMetrics) {
-      return;
+    if (slicingMetrics) {
+      tfma.Data.flattenMetrics(slicingMetrics, 'metrics');
     }
-    tfma.Data.flattenMetrics(slicingMetrics, 'metrics');
     this.availableMetricsNames_ =
         this.computeAvailableMetricsNames_(slicingMetrics);
+    this.updateSelectableMetricsAndThresholds_(this.availableMetricsNames_);
   }
 
   /**
@@ -179,11 +173,14 @@ export class FairnessNbContainer extends SelectEventMixin
 
   /**
    * @param {!Array<!Object>} slicingMetrics
-   * @return {!Array<string>} An array of names of all metrics suitable
-   *     for the fairness view.
+   * @return {!Array<string>|undefined} An array of names of all metrics
+   *     suitable for the fairness view.
    * @private
    */
   computeAvailableMetricsNames_(slicingMetrics) {
+    if (!slicingMetrics) {
+      return [];
+    }
     const allMetrics = new Set();
     slicingMetrics.forEach(slicingMetric => {
       Object.keys(slicingMetric['metrics']).forEach(metricName => {
@@ -208,7 +205,7 @@ export class FairnessNbContainer extends SelectEventMixin
   /**
    * Updates selectable metrics and available thresholds from avialable
    * metrics.
-   * @param {!Array<string>} availableMetricsNames_
+   * @param {!Array<string>|undefined} availableMetricsNames_
    * @private
    */
   updateSelectableMetricsAndThresholds_(availableMetricsNames_) {

tensorflow_model_analysis/addons/fairness/frontend/fairness-tensorboard-container/demo/index.html

@@ -0,0 +1,24 @@
+<!doctype html>
+<!--
+Copyright 2019 Google LLC
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    https://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<meta charset="utf-8">
+<html>
+  <head>
+  </head>
+  <body>
+    <fairness-tensorboard-container></fairness-tensorboard-container>
+  </body>
+</html>

tensorflow_model_analysis/addons/fairness/frontend/fairness-tensorboard-container/demo/index.js

@@ -0,0 +1,70 @@
+/**
+ * Copyright 2019 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+(() => {
+  const createSliceMetrics = () => {
+    return {
+      'accuracy': {
+        'boundedValue': {
+          'lowerBound': Math.random() * 0.3,
+          'upperBound': Math.random() * 0.3 + 0.6,
+          'value': Math.random() * 0.3 + 0.3,
+          'methodology': 'POISSON_BOOTSTRAP'
+        }
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'post_export_metrics/[email protected]': {
+        'doubleValue': Math.random(),
+      },
+      'totalWeightedExamples': {'doubleValue': 2000 * (Math.random() + 0.8)}
+    };
+  };
+
+  const SLICES = [
+    'Overall', 'Slice:1', 'Slice:2', 'Slice:3', 'Slice:4', 'Slice:5', 'Slice:6',
+    'Slice:7', 'Slice:8', 'Slice:9', 'Slice:10', 'Slice:11', 'Slice:12',
+    'Slice:13', 'Slice:14', 'Slice:15', 'Slice:16'
+  ];
+  const INPUT = SLICES.reduce((acc, slice) => {
+    acc.push({
+      'slice': slice,
+      'sliceValue': slice.split(':')[1] || 'Overall',
+      'metrics': createSliceMetrics(),
+    });
+    return acc;
+  }, []);
+  const element =
+      document.getElementsByTagName('fairness-tensorboard-container')[0];
+  debugger;
+  element.evaluationRuns_ = ['1', '2', '3'];
+  element.slicingMetrics_ = INPUT;
+  setTimeout(() => {
+    element.slicingMetrics_ = undefined;
+  }, 5000);
+})();