属性未声明为可配置错误：<spyOnProperty>

问题描述

给出一个MenuComponent

@Component({
  selector: 'cg-menu',templateUrl: './menu.component.html',styleUrls: [ './menu.component.scss' ]
})
export class MenuComponent implements OnInit {
  menu: MenuItem[];

  isLoggedIn$ = this.authStateService.isLoggedIn.pipe(untilDestroyed(this));

  constructor(private readonly authStateService: AuthStateService,private readonly router: Router) {
  }

  ngOnInit() {
    this.authStateService
      .state
      .pipe(
        untilDestroyed(this),...some logic...
      .subscribe();
  }

  ...some logic...
}

和一个AuthStateService

@Injectable({ providedIn: 'root' })
export class AuthStateService {
  private readonly state$: Observable<AuthState | null>;
  private readonly isLoggedIn$: Observable<boolean | null>;

  constructor(private readonly sessionManager: SessionManagerService) {

    this.state$ = this.stateTrigger$
      .pipe(
        ...some logic...
        shareReplay(1));

    this.isLoggedIn$ = this.stateTrigger$
      .pipe(
        map(state => state !== null),shareReplay(1));
  }

  get state(): Observable<AuthState> {
    return this.state$;
  }

  get isLoggedIn(): Observable<boolean> {
    return this.isLoggedIn$;
  }

  ...some logic...
}

当我尝试运行此代码时，业力触发错误。

describe('MenuComponent',() => {
  let component: MenuComponent;
  let fixture: ComponentFixture<MenuComponent>;

  let authStateServiceSpy;

  beforeEach(async(() => {
    authStateServiceSpy = jasmine.createSpyObj(
      'AuthStateService',{},{
        state: of(null),isLoggedIn: of(false)
      });

    TestBed.configureTestingModule({
      declarations: [ MenuComponent ],imports: [ RouterTestingModule ],providers: [
        { provide: AuthStateService,useValue: authStateServiceSpy }
      ],schemas: [ NO_ERRORS_SCHEMA ]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MenuComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should generate correct menu (expert)',() => {
    // The problem is here
    spyOnProperty(authStateServiceSpy,'state','get').and.callFake(() => of(stateMock));

    expect(component.menu).toEqual([
      ...something...
    ]);
  });
});

错误是这个。

Error: <spyOnProperty> : state is not declared configurable
    Usage: spyOnProperty(<object>,<propName>,[accessType])
    Error: <spyOnProperty> : state is not declared configurable
    Usage: spyOnProperty(<object>,[accessType])
        at <Jasmine>
        at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/src/app/modules/structure/components/menu/menu.component.spec.ts:55:5)
        at ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-evergreen.js:364:1)
        at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-testing.js:292:1)
        at ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-evergreen.js:363:1)
        at Zone.run (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-evergreen.js:123:1)
        at runInTestZone (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-testing.js:545:1)
        at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/node_modules/zone.js/dist/zone-testing.js:560:1)

知道我在做什么错吗？ 感谢您的帮助。

解决方法

我猜这是因为AuthStateService的{​​{1}}是类中的 getter ，但是您的模拟物将其声明为常规属性。您也应该将其声明为 getter 。

该问题似乎与将state与createSpyObj结合使用有关，因为它不是您要监视的真正的吸气剂。

看看您的代码，虽然似乎没有理由使用spyOnProperty，所以可以达到目的：

createSpyObj