zoukankan      html  css  js  c++  java
  • [Angular & Unit Testing] TestBed.get vs Injector

    Both what "TestBed.get" & "injector" trying to do is get service for the test component. 

    But there is some diffenece which determined when use which.

    Register the service: 

    You need to mock the service, not using the real service!

    You can use mock class, or just an object.

    userServiceStub = {
      isLoggedIn: true,
      user: { name: 'Test User'}
    };
    TestBed.configureTestingModule({
       declarations: [ WelcomeComponent ],
    // providers:    [ UserService ]  // NO! Don't provide the real service!
                                      // Provide a test-double instead
       providers:    [ {provide: UserService, useValue: userServiceStub } ]
    });

    "Root Injector"

    You may be able to get the service from the root injector via TestBed.get. This is easier to remember and less verbose. But it only works when Angular injects the component with the service instance in the test's root injector. 

    // UserService from the root injector
    userService = TestBed.get(UserService);

    "Injected service for Component"

    // UserService actually injected into the component
    userService = fixture.debugElement.injector.get(UserService);

    Code Example:

    beforeEach(() => {
      // stub UserService for test purposes
      userServiceStub = {
        isLoggedIn: true,
        user: { name: 'Test User'}
      };
    
      TestBed.configureTestingModule({
         declarations: [ WelcomeComponent ],
         providers:    [ {provide: UserService, useValue: userServiceStub } ]
      });
    
      fixture = TestBed.createComponent(WelcomeComponent);
      comp    = fixture.componentInstance;
    
      // UserService from the root injector
      userService = TestBed.get(UserService);
    
      //  get the "welcome" element by CSS selector (e.g., by class name)
      de = fixture.debugElement.query(By.css('.welcome'));
      el = de.nativeElement;
    });
    
    it('should welcome the user', () => {
      fixture.detectChanges();
      const content = el.textContent;
      expect(content).toContain('Welcome', '"Welcome ..."');
      expect(content).toContain('Test User', 'expected name');
    });
    
    it('should welcome "Bubba"', () => {
      userService.user.name = 'Bubba'; // welcome message hasn't been shown yet
      fixture.detectChanges();
      expect(el.textContent).toContain('Bubba');
    });
    
    it('should request login if not logged in', () => {
      userService.isLoggedIn = false; // welcome message hasn't been shown yet
      fixture.detectChanges();
      const content = el.textContent;
      expect(content).not.toContain('Welcome', 'not welcomed');
      expect(content).toMatch(/log in/i, '"log in"');
    });
  • 相关阅读:
    windows常用命令
    Qt 添加 QtNetwork 库文件
    LoadLibrary加载动态库失败
    C++11 Function 使用场景
    编程书籍集
    代码重构例集
    多重循环编码规范
    vim 命令学习(基础篇)
    QT构建窗体(父窗体传为野指针)异常案例
    JAVA_SE基础——26.[深入解析]局部变量与成员变量的差别
  • 原文地址:https://www.cnblogs.com/Answer1215/p/7647351.html
Copyright © 2011-2022 走看看