Merge pull request #16107 from yor-mozilla-com/fix969996

Fix for bug 969996 r=rik

apps/communications/dialer/js/call_log.js

@@ -180,11 +180,13 @@ var CallLog = {
   render: function cl_render() {
     var self = this;
 
+    var daysToRender = [];
     var chunk = [];
     var prevDate;
     var startDate = new Date().getTime();
     var screenRendered = false;
-    var FIRST_CHUNK_SIZE = 6;
+    var MAX_GROUPS_FOR_FIRST_RENDER = 6;
+    var MAX_DAYS_TO_BATCH_RENDER = 60;
     this._groupCounter = 0;
 
     CallLogDBManager.getGroupList(function logGroupsRetrieved(cursor) {
@@ -196,7 +198,8 @@ var CallLog = {
           self.renderEmptyCallLog();
           self.disableEditMode();
         } else {
-          self.renderChunk(chunk);
+          daysToRender.push(chunk);
+          self.renderSeveralDays(daysToRender);
           if (!screenRendered) {
             PerformanceTestingHelper.dispatch('first-chunk-ready');
           }
@@ -209,22 +212,37 @@ var CallLog = {
 
       self._empty = false;
       var currDate = new Date(cursor.value.date);
-      if (!prevDate || ((currDate - prevDate) === 0)) {
-        self._groupCounter++;
+      self._groupCounter++;
+      if (!prevDate || (currDate.getTime() == prevDate.getTime())) {
         chunk.push(cursor.value);
       } else {
-        if (self._groupCounter >= FIRST_CHUNK_SIZE && !screenRendered) {
+        var renderNow = false;
+        if (self._groupCounter >= MAX_GROUPS_FOR_FIRST_RENDER &&
+            !screenRendered) {
+          renderNow = true;
           screenRendered = true;
           PerformanceTestingHelper.dispatch('first-chunk-ready');
+        } else if (daysToRender.length >= MAX_DAYS_TO_BATCH_RENDER) {
+          renderNow = true;
         }
-        self.renderChunk(chunk);
+        if (renderNow) {
+          self.renderSeveralDays(daysToRender);
+          daysToRender = [];
+        }
+        daysToRender.push(chunk);
         chunk = [cursor.value];
       }
       prevDate = currDate;
       cursor.continue();
     }, 'lastEntryDate', true, true);
   },
 
+  renderSeveralDays: function cl_renderSeveralDays(chunks) {
+    for (var i = 0, l = chunks.length; i < l; i++) {
+      this.renderChunk(chunks[i]);
+    }
+  },
+
   renderChunk: function cl_renderChunk(chunk) {
     var callLogSection = this.createSectionForGroup(chunk[0]);
     var phoneNumbers = [];

apps/communications/dialer/test/unit/call_log_test.js

@@ -6,6 +6,7 @@ requireApp('communications/dialer/js/call_log.js');
 requireApp('communications/dialer/js/utils.js');
 requireApp('communications/dialer/test/unit/mock_call_log_db_manager.js');
 requireApp('communications/dialer/test/unit/mock_l10n.js');
+requireApp('communications/dialer/test/unit/mock_performance_testing_helper.js');
 requireApp('sms/test/unit/mock_async_storage.js');
 require('/shared/test/unit/mocks/mock_lazy_loader.js');
 require('/shared/test/unit/mocks/mock_contact_photo_helper.js');
@@ -15,6 +16,7 @@ requireApp('communications/shared/test/unit/mocks/mock_notification.js');
 var mocksHelperForCallLog = new MocksHelper([
   'asyncStorage',
   'CallLogDBManager',
+  'PerformanceTestingHelper',
   'LazyLoader',
   'LazyL10n',
   'ContactPhotoHelper'
@@ -193,6 +195,37 @@ suite('dialer/call_log', function() {
     }
   };
 
+  function appendAndCheckGroupDOM(count, date, callback) {
+    var groups = [];
+    for (var i = 1; i <= count; i++) {
+      var grp = JSON.parse(JSON.stringify(incomingGroup));
+      grp.id = i;
+      grp.date = date ? date : i;
+      groups.push(grp);
+      CallLogDBManager.add(grp);
+    }
+    CallLog.render();
+    setTimeout(function() {
+      var sections = CallLog.callLogContainer.getElementsByTagName('section');
+      if (date) {
+        assert.equal(sections.length, 1);
+        var groupDOM = sections[0].getElementsByTagName('ol')[0];
+        var doms = groupDOM.getElementsByTagName('li');
+        for (var i = 0; i < count; i++) {
+          checkGroupDOM(doms[i], groups[i], null);
+        }
+      } else {
+        assert.equal(sections.length, count);
+        for (var i = 0; i < count; i++) {
+          var groupDOM = sections[i].getElementsByTagName('ol')[0];
+          var doms = groupDOM.getElementsByTagName('li');
+          checkGroupDOM(doms[0], groups[i], null);
+        }
+      }
+      callback();
+    });
+  }
+
   function checkGroupDOM(groupDOM, group, callback) {
     assert.ok(groupDOM, 'groupDOM exists');
     assert.ok(groupDOM instanceof Object, 'groupDOM is an object');
@@ -286,7 +319,9 @@ suite('dialer/call_log', function() {
     if (group.retryCount > 1) {
       assert.equal(retryCount.innerHTML, '(' + group.retryCount + ')');
     }
-    callback();
+    if (callback) {
+      callback();
+    }
   }
 
   function checkGroupDOMContactUpdated(groupDOM, contact, number, callback) {
@@ -357,6 +392,70 @@ suite('dialer/call_log', function() {
     });
   });
 
+  suite('render', function() {
+    var renderSeveralDaysSpy;
+
+    setup(function() {
+        renderSeveralDaysSpy = this.sinon.spy(CallLog, 'renderSeveralDays');
+    });
+
+    teardown(function(done) {
+      CallLogDBManager.deleteAll(function() {
+        CallLog.render();
+        setTimeout(done);
+      });
+    });
+
+    test('Below first render threshold same day', function(done) {
+      appendAndCheckGroupDOM(5, 1, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 1);
+        done();
+      });
+    });
+
+    test('Above first render threshold same day', function(done) {
+      appendAndCheckGroupDOM(10, 1, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 1);
+        done();
+      });
+    });
+
+    test('Below first render threshold different days', function(done) {
+      appendAndCheckGroupDOM(5, null, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 1);
+        done();
+      });
+    });
+
+    test('Above first render threshold different days', function(done) {
+      appendAndCheckGroupDOM(10, null, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 2);
+        done();
+      });
+    });
+
+    test('Below batch render threshold', function(done) {
+      appendAndCheckGroupDOM(50, null, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 2);
+        done();
+      });
+    });
+
+    test('Above batch render threshold', function(done) {
+      appendAndCheckGroupDOM(100, null, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 3);
+        done();
+      });
+    });
+
+    test('Multiple batch renders', function(done) {
+      appendAndCheckGroupDOM(300, null, function() {
+        sinon.assert.callCount(renderSeveralDaysSpy, 6);
+        done();
+      });
+    });
+  });
+
   suite('updateContactInfo', function() {
     var groupDOM;
     setup(function() {

apps/communications/dialer/test/unit/mock_call_log_db_manager.js

@@ -1,5 +1,9 @@
 var MockCallLogDBManager = {
   _calls: [],
+  _getGroupListCursor: 0,
+  // This is to emulate DB cursor for 'getGroupList'
+  value: null,
+  _getGroupListCallback: null,
   add: function add(recentCall, callback) {
     this._calls.push(recentCall);
     var group = new Object();
@@ -24,9 +28,24 @@ var MockCallLogDBManager = {
       callback();
     }
   },
-  getGroupList: function() {},
+  getGroupList: function getGroupList(callback) {
+    this._getGroupListCursor = 0;
+    this._getGroupListCallback = callback;
+    this.continue();
+  },
   deleteAll: function deleteAll(callback) {
     this._calls = [];
     callback();
+  },
+  continue: function mcldm_continue() {
+    if (this._calls.length > this._getGroupListCursor) {
+      this.value = this._calls[this._getGroupListCursor];
+      this._getGroupListCursor++;
+    } else {
+      this.value = null;
+    }
+    if (this._getGroupListCallback != null) {
+      this._getGroupListCallback(this);
+    }
   }
 };

apps/communications/dialer/test/unit/mock_performance_testing_helper.js

@@ -0,0 +1,7 @@
+'use strict';
+
+/* exported MockPerformanceTestingHelper */
+
+var MockPerformanceTestingHelper = {
+  dispatch: function() {}
+};