Как смоделировать ключевое слово "this" в Jest Unit Testing

Question

Мне нужен этот код с помощью Jest Unit Testing:

componentDidUpdate(prevProps) {
    if (prevProps.socialMediaId !== this.props.socialMediaId) {
      if (typeof this.window.FB !== 'undefined') {
        this.window.FB.XFBML.parse();
      }
    }
  }

с использованием контрольного примера:

it('should test componentDidUpdate', () => {
    props.socialMediaId = '/old_id/';
    const component = mount(<MyComponent {...props} />);
    this.window.FB = {
      XFBML: {
        parse: () => {}
      }
    };
    props.socialMediaId = '/new_id/';
    component.setProps(props);
    expect(this.window.FB.XFBML.parse).toHaveBeenCalled();
  });

Но я получаю ошибку:

TypeError: Невозможно прочитать свойство 'window' из неопределенного

Как решить эту проблему с ключевым словом " this " в этом случае?

Answer 1

Здесь this.window - это свойство компонента, которое, вероятно, используется в качестве абстракции над window global.this внутри componentDidUpdate не является тем же объектом, что и this внутри теста

Его можно смоделировать на экземпляре компонента:

const component = mount(<MyComponent {...props} />);
component.instance().window = { FB: {
  XFBML: {
    parse: jest.spy()
  }
} };

Как правило, всефункции no-op должны быть заглушками Jest для целей тестирования.