fix(testing): allow test component builder to override directives from lists

When a component uses a list of directives, such as `ROUTER_DIRECTIVES`,
make `TestComponentBuilder#overrideDirective` work properly for members
of the list.

Closes #7397

Closes #8217

modules/angular2/src/mock/view_resolver_mock.ts

@@ -1,6 +1,7 @@
+import {resolveForwardRef} from 'angular2/src/core/di';
 import {Injectable} from 'angular2/src/core/di';
 import {Map, MapWrapper, ListWrapper} from 'angular2/src/facade/collection';
-import {Type, isPresent, stringify, isBlank} from 'angular2/src/facade/lang';
+import {Type, isPresent, isArray, stringify, isBlank} from 'angular2/src/facade/lang';
 import {BaseException, WrappedException} from 'angular2/src/facade/exceptions';
 
 import {ViewMetadata} from '../core/metadata';
@@ -81,11 +82,11 @@ export class MockViewResolver extends ViewResolver {
       view = super.resolve(component);
     }
 
-    var directives = view.directives;
+    var directives = [];
     var overrides = this._directiveOverrides.get(component);
 
-    if (isPresent(overrides) && isPresent(directives)) {
-      directives = ListWrapper.clone(view.directives);
+    if (isPresent(overrides) && isPresent(view.directives)) {
+      flattenArray(view.directives, directives);
       overrides.forEach((to, from) => {
         var srcIndex = directives.indexOf(from);
         if (srcIndex == -1) {
@@ -127,3 +128,14 @@ export class MockViewResolver extends ViewResolver {
     }
   }
 }
+
+function flattenArray(tree: any[], out: Array<Type | any[]>): void {
+  for (var i = 0; i < tree.length; i++) {
+    var item = resolveForwardRef(tree[i]);
+    if (isArray(item)) {
+      flattenArray(item, out);
+    } else {
+      out.push(item);
+    }
+  }
+}

modules/angular2/test/testing/test_component_builder_spec.ts

@@ -14,6 +14,7 @@ import {
   TestComponentBuilder
 } from 'angular2/testing_internal';
 
+import {CONST_EXPR} from 'angular2/src/facade/lang';
 import {Injectable, provide} from 'angular2/core';
 import {NgIf} from 'angular2/common';
 import {Directive, Component, ViewMetadata} from 'angular2/src/core/metadata';
@@ -99,6 +100,25 @@ class TestViewBindingsComp {
   constructor(private fancyService: FancyService) {}
 }
 
+@Component({selector: 'li1', template: `<span>One</span>`})
+class ListDir1 {
+}
+
+@Component({selector: 'li1', template: `<span>Alternate One</span>`})
+class ListDir1Alt {
+}
+
+@Component({selector: 'li2', template: `<span>Two</span>`})
+class ListDir2 {
+}
+
+const LIST_CHILDREN = CONST_EXPR([ListDir1, ListDir2]);
+
+@Component(
+    {selector: 'directive-list-comp', template: `(<li1></li1>)(<li2></li2>)`, directives: [LIST_CHILDREN]})
+class DirectiveListComp {
+}
+
 
 export function main() {
   describe('test component builder', function() {
@@ -168,6 +188,18 @@ export function main() {
              });
        }));
 
+    it('should override items from a list',
+       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
+
+         tcb.overrideDirective(DirectiveListComp, ListDir1, ListDir1Alt)
+             .createAsync(DirectiveListComp)
+             .then((componentFixture) => {
+               componentFixture.detectChanges();
+               expect(componentFixture.nativeElement).toHaveText('(Alternate One)(Two)');
+
+               async.done();
+             });
+       }));
 
     it("should override child component's dependencies",
        inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {