title: angular testing Error: Can't resolve all parameters for WelcomeComponent: (?)
body: <p>I copied the official website to my project below, but when running karma test appeared in this error.
  Does anyone know why this is it?
   Error: Can't resolve all parameters for WelcomeComponent: (?).
              at CompileMetadataResolver._getDependenciesMetadata (karma-shim.js:16768:19) [ProxyZone]</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>//welcome.component.ts
  import { Component, OnInit } from '@angular/core';
  import {UserService} from "./user.service";
  
  
  @Component({
    selector: 'app-welcome',
    template: '&lt;h3 class="welcome" &gt;&lt;i&gt;{{welcome}}&lt;/i&gt;&lt;/h3&gt;'
  })
  export class WelcomeComponent  implements OnInit {
    welcome = '-- not initialized yet --';
    constructor(private userService: UserService) { }
  
    ngOnInit(): void {
      this.welcome = this.userService.isLoggedIn ?
        'Welcome, ' + this.userService.user.name :
        'Please log in.';
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>//welcome.component.spec.ts
  describe('WelcomeComponent', () =&gt; {
  
    let comp: WelcomeComponent;
    let fixture: ComponentFixture&lt;WelcomeComponent&gt;;
    let componentUserService: UserService; // the actually injected service
    let userService: UserService; // the TestBed injected service
    let de: DebugElement;  // the DebugElement with the welcome message
    let el: HTMLElement; // the DOM element with the welcome message
  
    let userServiceStub: {
      isLoggedIn: boolean;
      user: { name: string}
    };
  
    beforeEach(() =&gt; {
      // 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 actually injected into the component
      userService = fixture.debugElement.injector.get(UserService);
      componentUserService = userService;
      // 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', () =&gt; {
      fixture.detectChanges();
      const content = el.textContent;
      expect(content).toContain('Welcome', '"Welcome ..."');
      expect(content).toContain('Test User', 'expected name');
    });
  
    it('should welcome "Bubba"', () =&gt; {
      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', () =&gt; {
      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"');
    });
  
    it('should inject the component\'s UserService instance',
      inject([UserService], (service: UserService) =&gt; {
      expect(service).toBe(componentUserService);
    }));
  
    it('TestBed and Component UserService should be the same', () =&gt; {
      expect(userService === componentUserService).toBe(true);
    });
  
    it('stub object and injected UserService should not be the same', () =&gt; {
      expect(userServiceStub === userService).toBe(false);
  
      // Changing the stub object has no effect on the injected service
      userServiceStub.isLoggedIn = false;
      expect(userService.isLoggedIn).toBe(true);
    });
  });</code></pre>
  </div>
  </div>
  </p>