[MD Bookmarks] Make folder nodes extend their whole width.

chrome/test/data/webui/md_bookmarks/sidebar_test.js

Index: chrome/test/data/webui/md_bookmarks/sidebar_test.js
diff --git a/chrome/test/data/webui/md_bookmarks/sidebar_test.js b/chrome/test/data/webui/md_bookmarks/sidebar_test.js
index 5bf47cc11b829f3ec037b1bd6d87dac56b631199..d60e52cb3dbed9830b7cd24f857a8942626132a2 100644
--- a/chrome/test/data/webui/md_bookmarks/sidebar_test.js
+++ b/chrome/test/data/webui/md_bookmarks/sidebar_test.js
@@ -31,7 +31,8 @@ suite('<bookmarks-sidebar>', function() {
   });
 
   test('selecting and deselecting folders fires event', function() {
-    var rootFolders = sidebar.$['folder-tree'].children;
+    var rootFolders =
+        sidebar.$['folder-tree'].querySelectorAll('bookmarks-folder-node');
     var firstGen = rootFolders[0].$['descendants'].querySelectorAll(
         'bookmarks-folder-node');
     var secondGen =
@@ -49,4 +50,32 @@ suite('<bookmarks-sidebar>', function() {
     assertEquals('select-folder', store.lastAction.name);
     assertEquals(rootFolders[1].item.id, store.lastAction.id);
   });
+
+  test('depth calculation', function() {
+    var rootFolders =
+        sidebar.$['folder-tree'].querySelectorAll('bookmarks-folder-node');
+    var firstGen = rootFolders[0].$['descendants'].querySelectorAll(
+        'bookmarks-folder-node');
+    var secondGen =
+        firstGen[0].$['descendants'].querySelectorAll('bookmarks-folder-node');
+
+    Array.prototype.forEach.call(rootFolders, function(f) {
+      assertEquals(0, f.depth);
+      assertEquals(

[tsergeant, 2017/03/07 23:32:50]

Testing CSS strings seems weird, even if those strings are hardcoded in  JS to
begin with. What about using getComputedStyle() to get the computed values?

[calamity, 2017/03/08 06:52:45]

That seems more brittle to me. This test is mostly here to make sure that depth
updates as we go lower and is reflected into the CSS via substitution, not to
explicitly enforce the correct pixel paddings.

Either way, now the test does that more directly.

+          `calc(0 * var(--padding-left-per-depth))`,
+          f.$['folder-label'].style.paddingLeft);
+    });
+    Array.prototype.forEach.call(firstGen, function(f) {
+      assertEquals(1, f.depth);
+      assertEquals(
+          `calc(1 * var(--padding-left-per-depth))`,
+          f.$['folder-label'].style.paddingLeft);
+    });
+    Array.prototype.forEach.call(secondGen, function(f) {
+      assertEquals(2, f.depth);
+      assertEquals(
+          `calc(2 * var(--padding-left-per-depth))`,
+          f.$['folder-label'].style.paddingLeft);
+    });
+  })
 });