angular - Jasmine.js 测试 - 监视 window.navigator.userAgent

Question

我需要找到改变userAgent价值的方法。我试过spyOn了 window.navigator.userAgent。但这没有帮助。

JS：

@Injectable()
export class DetectBrowserService {
  browserIE: boolean;
  constructor() {
    this.browserIE = this.detectExplorer();
  }

  public detectExplorer() {
    const brows = window.navigator.userAgent;
    const msie = brows.indexOf('MSIE ');
    if (msie > 0) {
      // IE 10 or older => return version number
      return true;
    }
  }
}

规格：

it('should test window.navigator.userAgent', () => {
  const wind = jasmine.createSpy('window.navigator.userAgent');
  wind.and.returnValue('1111');
  detectBrowserService = TestBed.get(DetectBrowserService);
  console.log(window.navigator.userAgent);
});

我期待1111，但得到了关于我的浏览器的真实信息。

Answer 1

userAgent是 上的只读/常量属性window.navigator。并且jasmine.createSpy通常用于创建方法而不是属性的间谍。

现在，我尝试直接做window.navigator.userAgent = '1111';我window.navigator的测试中可以访问的操作。但我收到一条错误消息：

[ts] Cannot assign to 'userAgent' because it is a constant or a read-only property. (property) NavigatorID.userAgent: string

所以唯一的选择是使用好旧的__defineGetter__. 这就是我在这里所做的：

it('should test window.navigator.userAgent', () => {
  window.navigator['__defineGetter__']('userAgent', function(){
    return '1111' // Return whatever you want here
  });
  detectBrowserService = TestBed.get(DetectBrowserService);
  console.log(window.navigator.userAgent);
});

它有效：

希望这可以帮助！

Answer 2

我使用 Jasmine api 本身得到了一个简单的解决方案。

spyOnProperty(window.navigator, 'userAgent').and.returnValue('Mozilla');

根据您的要求修改每个测试中的间谍。

不确定此 API 来自哪个 Jasmine 版本，但 v3.4 支持此 API

一旦你窥探到任何全局属性，清除该间谍afterEach测试是一个好习惯。

例如。

describe('Test', function() {
  const NAVIGATOR = window.navigator;

  beforeEach(function() {
    spyOnProperty(window.navigator, 'userAgent').and.returnValue('Mozilla');
  })

  afterEach(function() {
    window.navigator = NAVIGATOR;
  });
}

Answer 3

我意识到这已经过时了，但是为了扩展SiddAjmera的答案，这是我为测试特定于 safari 的行为所做的。在测试结束时，它还会重置 userAgent，因此其他测试不受影响（正如Pieter De Bie在评论中要求的那样）。

it('should redirect if the user is on safari', () => {
  const originalUserAgent = navigator.userAgent;

  fixture = TestBed.createComponent(ComponentToTest);
  component = fixture.componentInstance;

  navigator['__defineGetter__']('userAgent', () => {
    return 'safari';
  });
  fixture.detectChanges();

  component.methodToTest();

  expect(component['window'].location.href).toBe('redirecturl.com');

  // unset the userAgent after test
  navigator['__defineGetter__']('userAgent', () => {
    return originalUserAgent;
  });
});