Set active descendant correctly for toolbox tree. Change roles to 'tree' where appropriate.

accessible/toolbox.component.js

@@ -29,10 +29,10 @@ blocklyApp.ToolboxComponent = ng.core
     template: `
       <h3 #toolboxTitle id="blockly-toolbox-title">Toolbox</h3>
       <ol #tree
-          id="blockly-toolbox-tree" role="group" class="blocklyTree"
+          id="blockly-toolbox-tree" role="tree" class="blocklyTree"
           *ngIf="toolboxCategories && toolboxCategories.length > 0" tabIndex="0"
           [attr.aria-labelledby]="toolboxTitle.id"
-          [attr.aria-activedescendant]="tree.getAttribute('aria-activedescendant') || tree.id + '-node0' "
+          [attr.aria-activedescendant]="getActiveDescId()"
           (keydown)="treeService.onKeypress($event, tree)">
         <template [ngIf]="xmlHasCategories">
           <li #parent
@@ -106,11 +106,19 @@ blocklyApp.ToolboxComponent = ng.core
     ngAfterViewInit: function() {
       // If this is a top-level tree in the toolbox, set its active
       // descendant after the ids have been computed.
+      // Note that a timeout is needed here in order to trigger Angular
+      // change detection.
       if (this.xmlHasCategories) {
-        this.treeService.setActiveDesc(
-            'blockly-toolbox-tree-node0', 'blockly-toolbox-tree');
+        var that = this;
+        setTimeout(function() {
+          that.treeService.setActiveDesc(
+              'blockly-toolbox-tree-node0', 'blockly-toolbox-tree');
+        });
       }
     },
+    getActiveDescId: function() {
+      return this.treeService.getActiveDescId('blockly-toolbox-tree');
+    },
     getToolboxWorkspace: function(categoryNode) {
       if (categoryNode.attributes && categoryNode.attributes.name) {
         var categoryName = categoryNode.attributes.name.value;

accessible/workspace.component.js

@@ -47,7 +47,7 @@ blocklyApp.WorkspaceComponent = ng.core
 
     <div *ngIf="workspace">
       <ol #tree *ngFor="#block of workspace.topBlocks_; #i = index"
-          tabIndex="0" role="group" class="blocklyTree blocklyWorkspaceTree"
+          tabIndex="0" role="tree" class="blocklyTree blocklyWorkspaceTree"
           [attr.aria-activedescendant]="getActiveDescId(tree.id)"
           [attr.aria-labelledby]="workspaceTitle.id"
           (keydown)="onKeypress($event, tree)">