describe('router-link directive', function() {

    beforeEachBindings(
        () =>
            [bind(Location).toValue(makeDummyLocation()), bind(Router).toValue(makeDummyRouter())]);


    it('should update a[href] attribute',
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb, async) => {

         tcb.createAsync(TestComponent)
             .then((testComponent) => {
               testComponent.detectChanges();
               let anchorElement = testComponent.query(By.css('a')).nativeElement;
               expect(DOM.getAttribute(anchorElement, 'href')).toEqual('/detail');
               async.done();
             });
       }));


    it('should call router.navigate when a link is clicked',
       inject([TestComponentBuilder, AsyncTestCompleter, Router], (tcb, async, router) => {

         tcb.createAsync(TestComponent)
             .then((testComponent) => {
               testComponent.detectChanges();
               // TODO: shouldn't this be just 'click' rather than '^click'?
               testComponent.query(By.css('a')).triggerEventHandler('^click', {});
               expect(router.spy("navigate")).toHaveBeenCalledWith('/detail');
               async.done();
             });
       }));
  });

    describe('back button app', () => {
      beforeEachBindings(() => { return [bind(appComponentTypeToken).toValue(HierarchyAppCmp)]; });

      it('should change the url without pushing a new history state for back navigations',
         inject([AsyncTestCompleter, TestComponentBuilder], (async, tcb: TestComponentBuilder) => {

           tcb.createAsync(HierarchyAppCmp)
               .then((rootTC) => {
                 var router = rootTC.componentInstance.router;
                 var position = 0;
                 var flipped = false;
                 var history =
                     [
                       ['/parent/child', 'root { parent { hello } }', '/super-parent/child'],
                       ['/super-parent/child', 'root { super-parent { hello2 } }', '/parent/child'],
                       ['/parent/child', 'root { parent { hello } }', false]
                     ]

                     router.subscribe((_) => {
                       var location = rootTC.componentInstance.location;
                       var element = rootTC.nativeElement;
                       var path = location.path();

                       var entry = history[position];

                       expect(path).toEqual(entry[0]);
                       expect(element).toHaveText(entry[1]);

                       var nextUrl = entry[2];
                       if (nextUrl == false) {
                         flipped = true;
                       }

                       if (flipped && position == 0) {
                         async.done();
                         return;
                       }

                       position = position + (flipped ? -1 : 1);
                       if (flipped) {
                         location.back();
                       } else {
                         router.navigate(nextUrl);
                       }
                     });

                 router.navigate(history[0][0]);
               });
         }));
    });

	describe('logo', () => {
		var injector: Injector;
		var backend: MockBackend;
		var response;
		
		beforeEachBindings(() => [
			BaseRequestOptions,
			MockBackend,
			bind(Http).toFactory((connectionBackend: ConnectionBackend, defaultOptions: BaseRequestOptions) => {
				return new Http(connectionBackend, defaultOptions);
			}, [
				MockBackend,
				BaseRequestOptions
			]),
			bind(IconStore).toClass(IconStore, [
				Http
			])
		]);

		beforeEach(() => {
			injector = Injector.resolveAndCreate([
				MockBackend
			]);
			backend = injector.get(MockBackend);
			response = new Response({ body: LOGO_GLYPH_HTML });
		});
		
		afterEach(() => backend.verifyNoPendingRequests());
		
		it('should append an svg as child of self', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
			let html = '<div class="logo" logo></div>';
			ObservableWrapper.subscribe(backend.connections, (connection: MockConnection) => {
				// console.log(connection);
				connection.mockRespond(response)
			});
			tcb
				.overrideTemplate(Test, html)
				.createAsync(Test)
				.then((rootTC) => {
					rootTC.detectChanges();
					let logo: Element = DOM.querySelector(rootTC.nativeElement, '.logo');
					let prefixSelector = isNativeShadowDOMSupported ? '* /deep/ ' : ''; // soon use '>>>' https://www.chromestatus.com/features/6750456638341120
					// console.log(logo.firstChild, prefixSelector);
					// expect(logo.querySelector(prefixSelector + 'svg')).not.toBe(null);
					async.done();
				});
		}));
	});

  describe('element probe', function() {
    beforeEachBindings(() => [bind(APP_VIEW_POOL_CAPACITY).toValue(0)]);

    it('should return a TestElement from a dom element',
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb, async) => {
         tcb.overrideTemplate(MyComp, '<div some-dir></div>')
             .createAsync(MyComp)
             .then((rootTestComponent) => {
               expect(inspectNativeElement(rootTestComponent.nativeElement).componentInstance)
                   .toBeAnInstanceOf(MyComp);

               async.done();
             });
       }));

    it('should clean up whent the view is destroyed',
       inject([TestComponentBuilder, AsyncTestCompleter], (tcb, async) => {
         tcb.overrideTemplate(MyComp, '')
             .createAsync(MyComp)
             .then((rootTestComponent) => {
               rootTestComponent.destroy();
               expect(inspectNativeElement(rootTestComponent.nativeElement)).toBe(null);

               async.done();
             });

       }));

    if (!IS_DARTIUM) {
      it('should provide a global function to inspect elements',
         inject([TestComponentBuilder, AsyncTestCompleter], (tcb, async) => {
           tcb.overrideTemplate(MyComp, '')
               .createAsync(MyComp)
               .then((rootTestComponent) => {
                 expect(global['ngProbe'](rootTestComponent.nativeElement).componentInstance)
                     .toBeAnInstanceOf(MyComp);

                 async.done();
               });
         }));
    }
  });

    describe('querystring params app', () => {
      beforeEachBindings(() => { return [bind(APP_COMPONENT).toValue(QueryStringAppCmp)]; });

      it('should recognize and return querystring params with the injected RouteParams',
         inject([AsyncTestCompleter, TestComponentBuilder], (async, tcb: TestComponentBuilder) => {
           tcb.createAsync(QueryStringAppCmp)
               .then((rootTC) => {
                 var router = rootTC.componentInstance.router;
                 router.subscribe((_) => {
                   rootTC.detectChanges();

                   expect(rootTC.nativeElement).toHaveText('qParam = search-for-something');
                   /*
                   expect(applicationRef.hostComponent.location.path())
                       .toEqual('/qs?q=search-for-something');*/
                   async.done();
                 });
                 router.navigate('/qs?q=search-for-something');
                 rootTC.detectChanges();
               });
         }));
    });

      describe(`${name} shadow dom strategy`, () => {
        beforeEachBindings(() => { return [strategyBinding, DomTestbed]; });

        // GH-2095 - https://github.com/angular/angular/issues/2095
        // important as we are adding a content end element during compilation,
        // which could skrew up text node indices.
        it('should support text nodes after content tags',
           inject([DomTestbed, AsyncTestCompleter], (tb, async) => {
             tb.compileAll([
                 simple,
                 new ViewDefinition({
                   componentId: 'simple',
                   template: '<content></content><p>P,</p>{{a}}',
                   directives: []
                 })
               ])
                 .then((protoViewDtos) => {
                   var rootView = tb.createRootView(protoViewDtos[0]);
                   var cmpView = tb.createComponentView(rootView.viewRef, 0, protoViewDtos[1]);

                   tb.renderer.setText(cmpView.viewRef, 0, 'text');
                   expect(tb.rootEl).toHaveText('P,text');
                   async.done();
                 });
           }));

        // important as we are moving style tags around during compilation,
        // which could skrew up text node indices.
        it('should support text nodes after style tags',
           inject([DomTestbed, AsyncTestCompleter], (tb, async) => {
             tb.compileAll([
                 simple,
                 new ViewDefinition({
                   componentId: 'simple',
                   template: '<style></style><p>P,</p>{{a}}',
                   directives: []
                 })
               ])
                 .then((protoViewDtos) => {
                   var rootView = tb.createRootView(protoViewDtos[0]);
                   var cmpView = tb.createComponentView(rootView.viewRef, 0, protoViewDtos[1]);

                   tb.renderer.setText(cmpView.viewRef, 0, 'text');
                   expect(tb.rootEl).toHaveText('P,text');
                   async.done();
                 });
           }));

        it('should support simple components',
           inject([AsyncTestCompleter, DomTestbed], (async, tb) => {
             tb.compileAll([
                 mainDir,
                 new ViewDefinition({
                   componentId: 'main',
                   template: '<simple>' +
                                 '<div>A</div>' +
                                 '</simple>',
                   directives: [simple]
                 }),
                 simpleTemplate
               ])
                 .then((protoViews) => {
                   tb.createRootViews(protoViews);

                   expect(tb.rootEl).toHaveText('SIMPLE(A)');

                   async.done();
                 });
           }));

        it('should support simple components with text interpolation as direct children',
           inject([AsyncTestCompleter, DomTestbed], (async, tb) => {
             tb.compileAll([
                 mainDir,
                 new ViewDefinition({
                   componentId: 'main',
                   template: '<simple>' +
                                 '{{text}}' +
                                 '</simple>',
                   directives: [simple]
                 }),
                 simpleTemplate
               ])
                 .then((protoViews) => {
                   var cmpView = tb.createRootViews(protoViews)[1];
                   tb.renderer.setText(cmpView.viewRef, 0, 'A');

                   expect(tb.rootEl).toHaveText('SIMPLE(A)');

                   async.done();
                 });
           }));

        it('should not show the light dom even if there is not content tag',
           inject([AsyncTestCompleter, DomTestbed], (async, tb) => {
             tb.compileAll([
                 mainDir,
                 new ViewDefinition({
                   componentId: 'main',
                   template: '<empty>' +
//.........这里部分代码省略.........

  describe('Router', () => {
    var router, location;

    beforeEachBindings(() => [
      Pipeline,
      RouteRegistry,
      DirectiveResolver,
      bind(Location).toClass(SpyLocation),
      bind(Router)
          .toFactory((registry, pipeline,
                      location) => { return new RootRouter(registry, pipeline, location, AppCmp); },
                     [RouteRegistry, Pipeline, Location])
    ]);


    beforeEach(inject([Router, Location], (rtr, loc) => {
      router = rtr;
      location = loc;
    }));


    it('should navigate based on the initial URL state', inject([AsyncTestCompleter], (async) => {
         var outlet = makeDummyOutlet();

         router.config([new Route({path: '/', component: DummyComponent})])
             .then((_) => router.registerOutlet(outlet))
             .then((_) => {
               expect(outlet.spy('commit')).toHaveBeenCalled();
               expect(location.urlChanges).toEqual([]);
               async.done();
             });
       }));


    it('should activate viewports and update URL on navigate',
       inject([AsyncTestCompleter], (async) => {
         var outlet = makeDummyOutlet();

         router.registerOutlet(outlet)
             .then((_) => router.config([new Route({path: '/a', component: DummyComponent})]))
             .then((_) => router.navigate('/a'))
             .then((_) => {
               expect(outlet.spy('commit')).toHaveBeenCalled();
               expect(location.urlChanges).toEqual(['/a']);
               async.done();
             });
       }));

    it('should not push a history change on when navigate is called with skipUrlChange',
       inject([AsyncTestCompleter], (async) => {
         var outlet = makeDummyOutlet();

         router.registerOutlet(outlet)
             .then((_) => router.config([new Route({path: '/b', component: DummyComponent})]))
             .then((_) => router.navigate('/b', true))
             .then((_) => {
               expect(outlet.spy('commit')).toHaveBeenCalled();
               expect(location.urlChanges).toEqual([]);
               async.done();
             });
       }));


    it('should navigate after being configured', inject([AsyncTestCompleter], (async) => {
         var outlet = makeDummyOutlet();

         router.registerOutlet(outlet)
             .then((_) => router.navigate('/a'))
             .then((_) => {
               expect(outlet.spy('commit')).not.toHaveBeenCalled();
               return router.config([new Route({path: '/a', component: DummyComponent})]);
             })
             .then((_) => {
               expect(outlet.spy('commit')).toHaveBeenCalled();
               async.done();
             });
       }));


    it('should throw when linkParams does not start with a "/" or "./"', () => {
      expect(() => router.generate(['firstCmp', 'secondCmp']))
          .toThrowError(
              `Link "${ListWrapper.toJSON(['firstCmp', 'secondCmp'])}" must start with "/", "./", or "../"`);
    });


    it('should throw when linkParams does not include a route name', () => {
      expect(() => router.generate(['./']))
          .toThrowError(`Link "${ListWrapper.toJSON(['./'])}" must include a route name.`);
      expect(() => router.generate(['/']))
          .toThrowError(`Link "${ListWrapper.toJSON(['/'])}" must include a route name.`);
    });

    it('should, when subscribed to, return a disposable subscription', () => {
      expect(() => {
        var subscription = router.subscribe((_) => {});
        ObservableWrapper.dispose(subscription);
      }).not.toThrow();
    });

//.........这里部分代码省略.........

  describe('StyleInliner', () => {
    beforeEachBindings(() => [
      bind(XHR)
          .toClass(FakeXHR),
    ]);

    describe('loading', () => {

      it('should return a string when there is no import statement',
         inject([StyleInliner], (inliner) => {
           var css = '.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base');
           expect(loadedCss).toEqual(css);
         }));

      it('should inline @import rules',
         inject([XHR, StyleInliner, AsyncTestCompleter], (xhr, inliner, async) => {
           xhr.reply('http://base/one.css', '.one {}');
           var css = '@import url("one.css");.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(loadedCss,
                               function(css) {
                                 expect(css).toEqual('.one {}\n.main {}');
                                 async.done();
                               },
                               function(e) { throw 'fail;' });
         }));

      it('should support url([unquoted url]) in @import rules',
         inject([XHR, StyleInliner, AsyncTestCompleter], (xhr, inliner, async) => {
           xhr.reply('http://base/one.css', '.one {}');
           var css = '@import url(one.css);.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(loadedCss,
                               function(css) {
                                 expect(css).toEqual('.one {}\n.main {}');
                                 async.done();
                               },
                               function(e) { throw 'fail;' });
         }));

      it('should handle @import error gracefuly',
         inject([StyleInliner, AsyncTestCompleter], (inliner, async) => {
           var css = '@import "one.css";.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(
               loadedCss,
               function(css) {
                 expect(css).toEqual('/* failed to import http://base/one.css */\n.main {}');
                 async.done();
               },
               function(e) { throw 'fail;' });
         }));

      it('should inline multiple @import rules',
         inject([XHR, StyleInliner, AsyncTestCompleter], (xhr, inliner, async) => {
           xhr.reply('http://base/one.css', '.one {}');
           xhr.reply('http://base/two.css', '.two {}');
           var css = '@import "one.css";@import "two.css";.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(loadedCss,
                               function(css) {
                                 expect(css).toEqual('.one {}\n.two {}\n.main {}');
                                 async.done();
                               },
                               function(e) { throw 'fail;' });
         }));

      it('should inline nested @import rules',
         inject([XHR, StyleInliner, AsyncTestCompleter], (xhr, inliner, async) => {
           xhr.reply('http://base/one.css', '@import "two.css";.one {}');
           xhr.reply('http://base/two.css', '.two {}');
           var css = '@import "one.css";.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base/');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(loadedCss,
                               function(css) {
                                 expect(css).toEqual('.two {}\n.one {}\n.main {}');
                                 async.done();
                               },
                               function(e) { throw 'fail;' });
         }));

      it('should handle circular dependencies gracefuly',
         inject([XHR, StyleInliner, AsyncTestCompleter], (xhr, inliner, async) => {
           xhr.reply('http://base/one.css', '@import "two.css";.one {}');
           xhr.reply('http://base/two.css', '@import "one.css";.two {}');
           var css = '@import "one.css";.main {}';
           var loadedCss = inliner.inlineImports(css, 'http://base/');
           expect(loadedCss).toBePromise();
           PromiseWrapper.then(loadedCss,
                               function(css) {
                                 expect(css).toEqual('.two {}\n.one {}\n.main {}');
                                 async.done();
                               },
                               function(e) { throw 'fail;' });
//.........这里部分代码省略.........