Get Google Chrome's root bookmarks folder

Question

I\'m trying to write a better bookmark manager in Chrome extensions. The problem is that there are no simple examples (that I can find) about how to actually use the bookmarks A

Answer 1

Bookmarks are organized in a tree, where each node in the tree is either a bookmark or a group (a folder that can contain nodes). Each node in the tree is represented by a BookmarkTreeNode object.

There is no root bookmarks folder in the sense of a file system object. All the bookmarks are stored in a structured file that you access through the api in the link you provided. The root of the tree is returned by getTree:

chrome.bookmarks.getTree

Answer 2

Currently, there is no good way to find folders such as "Other Bookmarks" or "Bookmarks Bar" in the bookmarks API. You would have to iterate through all the bookmarks and find which node has those root folders and save its bookmark id. The bug is filed Issue 21330.

The root id is always 0, and when I mean 0, it corresponds to "Bookmarks bar" and "Other bookmarks". As any tree structure, each node has children. If you want to fetch all the bookmarks under one folder, you can use getChildren API and get every node recursively (you can do it iteratively too). For example, the following will get every single bookmark:

printBookmarks('0');

function printBookmarks(id) {
 chrome.bookmarks.getChildren(id, function(children) {
    children.forEach(function(bookmark) { 
      console.debug(bookmark.title);
      printBookmarks(bookmark.id);
    });
 });
}

Now, why do we have to call the API for every iteration? Their is an API to get the whole Tree. If you tried it out, you will see that every node in the getTree will have a list of children. That is perfect:

chrome.bookmarks.getTree(function(bookmarks) {
  printBookmarks(bookmarks);
});

function printBookmarks(bookmarks) {
  bookmarks.forEach(function(bookmark) {
    console.debug(bookmark.id + ' - ' + bookmark.title + ' - ' + bookmark.url);
    if (bookmark.children)
      printBookmark(bookmark.children);
  });
}

That is all, you can do all this iteratively as well which is better performance, but you can figure that out :) Note that since you want to redo the bookmarks bar, you can override that page in extensions (soon): http://code.google.com/chrome/extensions/override.html

If you want to show a nice HTML tree of your bookmarks, you can easily do that by extending the getTree functionality I showed above to accept a parent DOM. You can do something like this. Edit the code to make use of the getTree or collapse everything and make use of the getChildren and fetch more bookmarks if they request it.

Answer 3

Okay, I've discovered how to get access to what I want. In retrospect I should have seen it sooner.

http://code.google.com/chrome/extensions/tut_debugging.html

Using the debugger I was able to set a breakpoint and view the objects. [object Object] is an array of length 1.

Using the function given in my example, tree[0].children is the array containing the children. On my default setup tree has two children, tree[0].children[0] is "Bookmarks Bar" and tree[0].children[1] is "Other Bookmarks". The rest of the bookmark tree flows down from there, though "Other Bookmarks" (tree[0].children[1]) is the folder I'm looking for.