MD History: Refactored design for displaying history information

chrome/test/data/webui/md_history/history_list_test.js

Index: chrome/test/data/webui/md_history/history_list_test.js
diff --git a/chrome/test/data/webui/md_history/history_card_manager_test.js b/chrome/test/data/webui/md_history/history_list_test.js
similarity index 35%
rename from chrome/test/data/webui/md_history/history_card_manager_test.js
rename to chrome/test/data/webui/md_history/history_list_test.js
index 3b19e2b1fdfe68e45bd0cbb82a3c0fae33be4599..c29e086d2129f5681ad3208820f9b95ebe3efb44 100644
--- a/chrome/test/data/webui/md_history/history_card_manager_test.js
+++ b/chrome/test/data/webui/md_history/history_list_test.js
@@ -2,28 +2,24 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-cr.define('md_history.history_card_manager_test', function() {
+cr.define('md_history.history_list_test', function() {
   // Array of test history data.
   var TEST_HISTORY_RESULTS = [
     {
       "dateRelativeDay": "Today - Wednesday, December 9, 2015",
-      "url": "https://www.google.com",
-      "allTimestamps": "1",
+      "url": "https://www.google.com"
     },
     {
       "dateRelativeDay": "Yesterday - Tuesday, December 8, 2015",
-      "url": "https://en.wikipedia.com",
-      "allTimestamps": "2"
+      "url": "https://en.wikipedia.com"
     },
     {
       "dateRelativeDay": "Monday, December 7, 2015",
-      "url": "https://www.example.com",
-      "allTimestamps": "3"
+      "url": "https://www.example.com"
     },
     {
       "dateRelativeDay": "Monday, December 7, 2015",
-      "url": "https://www.google.com",
-      "allTimestamps": "4"
+      "url": "https://www.google.com"
     }
   ];
 
@@ -47,158 +43,137 @@ cr.define('md_history.history_card_manager_test', function() {
   ];
 
   function registerTests() {
-    suite('history-card-manager', function() {
+    suite('history-list', function() {
       var element;
       var toolbar;
-      var items;
 
       suiteSetup(function() {
-        element = $('history-card-manager');
+        element = $('history-list');
         toolbar = $('toolbar');
-        items = [];
       });
 
       setup(function() {
         element.addNewResults(TEST_HISTORY_RESULTS);
       });
 
-      test('splitting items by day', function() {
-        assertEquals(3, element.historyDataByDay_.length);
-
-        // Ensure that the output is in reversed date order.
-        assertEquals("Today - Wednesday, December 9, 2015",
-                     element.historyDataByDay_[0].date);
-        assertEquals("Yesterday - Tuesday, December 8, 2015",
-                     element.historyDataByDay_[1].date);
-        assertEquals("Monday, December 7, 2015",
-                     element.historyDataByDay_[2].date);
-        assertEquals("https://www.example.com",
-                     element.historyDataByDay_[2].historyItems[0].url);
-        assertEquals("https://www.google.com",
-                     element.historyDataByDay_[2].historyItems[1].url);
+      test('setting first and last items', function() {
+        assertTrue(element.historyData[0].isLastItem);
+        assertTrue(element.historyData[0].isFirstItem);
+        assertTrue(element.historyData[2].isFirstItem);
+        assertTrue(element.historyData[3].isLastItem);
       });
 
       test('cancelling selection of multiple items', function(done) {
         flush(function() {
-          var cards = Polymer.dom(element.root)
-              .querySelectorAll('history-card');
-          items = Polymer.dom(cards[2].root)
+          var items = Polymer.dom(element.root)
               .querySelectorAll('history-item');
 
-          MockInteractions.tap(items[0].$.checkbox);
-          MockInteractions.tap(items[1].$.checkbox);
+          MockInteractions.tap(items[2].$.checkbox);
+          MockInteractions.tap(items[3].$.checkbox);
 
           // Make sure that the array of data that determines whether or not an
           // item is selected is what we expect after selecting the two items.
-          assertFalse(element.historyDataByDay_[0].historyItems[0].selected);
-          assertFalse(element.historyDataByDay_[1].historyItems[0].selected);
-          assertTrue(element.historyDataByDay_[2].historyItems[0].selected);
-          assertTrue(element.historyDataByDay_[2].historyItems[1].selected);
+          assertFalse(element.historyData[0].selected);
+          assertFalse(element.historyData[1].selected);
+          assertTrue(element.historyData[2].selected);
+          assertTrue(element.historyData[3].selected);
 
           toolbar.onClearSelectionTap_();
 
           // Make sure that clearing the selection updates both the array and
           // the actual history-items affected.
-          assertFalse(element.historyDataByDay_[0].historyItems[0].selected);
-          assertFalse(element.historyDataByDay_[1].historyItems[0].selected);
-          assertFalse(element.historyDataByDay_[2].historyItems[0].selected);
-          assertFalse(element.historyDataByDay_[2].historyItems[1].selected);
+          assertFalse(element.historyData[0].selected);
+          assertFalse(element.historyData[1].selected);
+          assertFalse(element.historyData[2].selected);
+          assertFalse(element.historyData[3].selected);
 
-          assertFalse(items[0].$.checkbox.checked);
-          assertFalse(items[1].$.checkbox.checked);
+          assertFalse(items[2].$.checkbox.checked);
+          assertFalse(items[3].$.checkbox.checked);
 
           done();
         });
       });
 
-      test('updating history results', function() {
+      test('updating history results', function(done) {
         element.addNewResults(ADDITIONAL_RESULTS);
 
-        assertEquals(5, element.historyDataByDay_.length);
-
-        // Ensure that the output is still in reverse order.
-        assertEquals("Monday, December 7, 2015",
-                     element.historyDataByDay_[2].date);
-        assertEquals("Sunday, December 6, 2015",
-                     element.historyDataByDay_[3].date);
-        assertEquals("Saturday, December 5, 2015",
-                     element.historyDataByDay_[4].date);
-
-        // Ensure that the correct items have been appended to the list.
-        assertEquals("https://en.wikipedia.com",
-                     element.historyDataByDay_[2].historyItems[2].url);
-        assertEquals("https://www.youtube.com",
-                     element.historyDataByDay_[2].historyItems[3].url);
-        assertEquals("https://www.google.com",
-                     element.historyDataByDay_[3].historyItems[0].url);
-        assertEquals("https://www.example.com",
-                     element.historyDataByDay_[4].historyItems[0].url);
+        flush(function() {
+          assertTrue(element.historyData[2].isFirstItem);
+          assertTrue(element.historyData[5].isLastItem);
+
+          assertTrue(element.historyData[6].isFirstItem);
+          assertTrue(element.historyData[6].isLastItem);
+
+          assertTrue(element.historyData[7].isFirstItem);
+          assertTrue(element.historyData[7].isLastItem);
+
+          done();
+        });
       });
 
       test('removeVisits for multiple items', function(done) {
         // Ensure that the correct identifying data is being used for removal.
         registerMessageCallback('removeVisits', this, function (toBeRemoved) {
-          assertEquals(toBeRemoved[0].url,
-                       element.historyDataByDay_[2].historyItems[0].url);
-          assertEquals(toBeRemoved[1].url,
-                       element.historyDataByDay_[2].historyItems[1].url);
+
+          assertEquals(toBeRemoved[0].url, element.historyData[0].url);
+          assertEquals(toBeRemoved[1].url, element.historyData[1].url);
           assertEquals(toBeRemoved[0].timestamps,
-                       element.historyDataByDay_[2].historyItems[0]
-                            .allTimestamps);
+                       element.historyData[0].timestamps);
           assertEquals(toBeRemoved[1].timestamps,
-                       element.historyDataByDay_[2].historyItems[1]
-                            .allTimestamps);
+                       element.historyData[1].timestamps);
+
           done();
         });
 
         flush(function() {
-          var cards = Polymer.dom(element.root)
-              .querySelectorAll('history-card');
-          items = Polymer.dom(cards[2].root)
-              .querySelectorAll('history-item');
+          items = Polymer.dom(element.root).querySelectorAll('history-item');
 
-          MockInteractions.tap(items[0].$['checkbox']);
-          MockInteractions.tap(items[1].$['checkbox']);
+          MockInteractions.tap(items[0].$.checkbox);
+          MockInteractions.tap(items[1].$.checkbox);
 
           toolbar.onDeleteTap_();
         });
       });
 
       test('deleting multiple items from view', function(done) {
+        element.addNewResults(ADDITIONAL_RESULTS);
         flush(function() {
-          var cards = Polymer.dom(element.root)
-              .querySelectorAll('history-card');
-          items = Polymer.dom(cards[2].root)
-              .querySelectorAll('history-item');
+          items = Polymer.dom(element.root).querySelectorAll('history-item');
 
-          MockInteractions.tap(items[0].$['checkbox']);
-          MockInteractions.tap(items[1].$['checkbox']);
+          // Selects the checkboxes.
+          element.set('historyData.2.selected', true);
+          items[2].onCheckboxSelected_();
+          element.set('historyData.5.selected', true);
+          items[5].onCheckboxSelected_();
+          element.set('historyData.7.selected', true);
+          items[7].onCheckboxSelected_();
 
-          element.removeDeletedHistory(2);
+          element.removeDeletedHistory(3);
 
           flush(function() {
-            var cards = Polymer.dom(element.root)
-              .querySelectorAll('history-card');
-            items = Polymer.dom(cards[2].root)
-              .querySelectorAll('history-item');
+            items = Polymer.dom(element.root).querySelectorAll('history-item');
 
-            assertEquals(element.historyDataByDay_.length, 2);
-            assertEquals(element.historyDataByDay_[0].date,
+            assertEquals(element.historyData.length, 5);
+            assertEquals(element.historyData[0].dateRelativeDay,
                          "Today - Wednesday, December 9, 2015");
-            assertEquals(element.historyDataByDay_[1].date,
-                         "Yesterday - Tuesday, December 8, 2015");
-            assertEquals(items.length, 0);
+            assertEquals(element.historyData[2].dateRelativeDay,
+                         "Monday, December 7, 2015");
+            assertEquals(element.historyData[4].dateRelativeDay,
+                         "Sunday, December 6, 2015");
+
+            // Checks that the first and last items have been reset correctly.
+            assertTrue(element.historyData[2].isFirstItem);
+            assertTrue(element.historyData[3].isLastItem);
+            assertTrue(element.historyData[4].isFirstItem);
+            assertTrue(element.historyData[4].isLastItem)
+
             done();
           });
         });
       });
 
       teardown(function() {
-        for (var i = 0; i < items.length; i++) {
-          items[i].selected = false;
-        }
-        element.historyDataByDay_ = [];
-        toolbar.count = 0;
+        element.historyData = [];
       });
     });
   }