Merge 987f410 into 6b69db2

uber-web · Aug 25, 2019 · fb1cc4b · fb1cc4b
2 parents 6b69db2 + 987f410
commit fb1cc4b
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 5 deletions.
diff --git a/docs/api-reference/stats-widget/stats-widget.md b/docs/api-reference/stats-widget/stats-widget.md
@@ -60,14 +60,14 @@ class App extends Component {
    style of nested elements:
     + `header` (`Object`) - css properties to apply to the header `div` of the widget.
     + `item` (`Object`) - css properties to apply to the individual item `div`s for each stat displayed in the widget.
-  - `formatters` (`Object`) - text formatters to use to display a stat. Keys are the stat's `id`. Value can either be
+  - `formatters` (`Object`) - text formatters to use to display a stat. Keys are the stat's `name`. Value can either be
    a function that takes a single `stat` object as argument, or one of the following strings:
     + `count`: Display as a simple count.
     + `averageTime`: Display average time.
     + `totalTime`: Display total time.
     + `fps`: Display Hz as a frame rate.
     + `memory`: Display count as a memory measurement.
-    `resetOnUpdate` (`Object`) - whether the a stat should be reset each time the widget is re-rendered. Keyed by the stat's `id`.
+    `resetOnUpdate` (`Object`) - whether the a stat should be reset each time the widget is re-rendered. Keyed by the stat's `name`.
 
 ### setStats
 

diff --git a/modules/stats-widget/src/stats-widget.js b/modules/stats-widget/src/stats-widget.js
@@ -66,6 +66,8 @@ export default class StatsWidget {
     this.stats = stats;
     this._createDOMStats(this._container);
     this._setHeaderContent(stats.id);
+
+    this.update();
   }
 
   update() {

diff --git a/test/modules/stats-widget/stats-widget.spec.js b/test/modules/stats-widget/stats-widget.spec.js
@@ -60,11 +60,13 @@ test('StatsWidget#setStats', t => {
   const stats = getStatsObject();
 
   t.equals(Object.keys(statsWidget._items).length, 0, 'Should have no items when no stats.');
+
   statsWidget.setStats(stats);
+
   t.equals(Object.keys(statsWidget._items).length, 3, 'Should have 3 items.');
   t.equals(statsWidget._container.childNodes.length, 4, 'Should have 4 child nodes.');
+  t.equals(statsWidget._counter, 1, 'Should call update() and increase _counter.');
 
-  stats.reset();
   t.end();
 });
 
@@ -112,11 +114,39 @@ test('StatsWidget#formatters', t => {
   statsWidget.setStats(stats);
 
   stats.get('Count').addCount(1000);
-  stats.get('Memory').addCount(1500);
+  stats.get('GPU Memory').addCount(1500);
   statsWidget.update();
 
   t.equals(statsWidget._items.Count.innerHTML, 'Count: 1.0k', 'Should use customized formatter.');
-  t.equals(statsWidget._items.Memory.innerHTML, 'Memory: 1500', 'Should use customized formatter.');
+  t.equals(
+    statsWidget._items['GPU Memory'].innerHTML,
+    'GPU Memory: 1500',
+    'Should use customized formatter.'
+  );
+
+  statsWidget.setStats(new Stats({id: 'test-stats-2'}));
+  t.equals(statsWidget._header.innerText, 'test-stats-2', "Should use the new stats' header.");
+
+  t.end();
+});
+
+test('StatsWidget#resetOnUpdate', t => {
+  const container = _global.document.createElement('div');
+  container.id = 'test-stats-widget-container';
+  const statsWidget = new StatsWidget(null, {
+    container,
+    resetOnUpdate: {Count: true}
+  });
+  const stats = getStatsObject();
+
+  statsWidget.setStats(stats);
+
+  stats.get('Count').addCount(1000);
+  stats.get('GPU Memory').addCount(1500);
+  statsWidget.update();
+
+  t.equals(stats.get('Count').count, 0, 'Should reset count.');
+  t.equals(stats.get('GPU Memory').count, 1500, 'Should not reset memory.');
 
   t.end();
 });