Как проверить ng-select внутри Реактивной формы?

Question

В моем приложении Angular у меня есть простая реактивная форма, которая использует ng-select в качестве одного обязательного ввода.

У меня также есть кнопка "Сохранить"это доступно только тогда, когда форма действительна.

Все работает нормально.

Я хочу написать простой тестовый пример, чтобы убедиться, что кнопка Сохранить НЕ активна всякий раз, когда элемент управления ng-selectне имеет значения.

Это то, что я смог сделать:

it('should not allow to save without a selected item', () => {
  component.form.get('myNgSelectControl').setValue('some-value');
  component.form.updateValueAndValidity();
  fixture.detectChanges();
  expect(page.saveButton.disabled).toBe(false);

  component.form.get('myNgSelectControl').setValue(null);
  component.form.updateValueAndValidity();
  fixture.detectChanges();
  expect(page.saveButton.disabled).toBe(true);
});

однако я хотел бы построить этот тест по-другому, я хотел бы больше имитировать рабочий процесс более высокого уровня:вместо того, чтобы вручную устанавливать значение для элемента управления формы, я хотел бы сделать что-то вроде:

"значение типа xxx в ng-select"

"выбрать элемент xxx изРаскрывающееся меню «

(сделайте утверждение, что кнопка« Сохранить »теперь включена)

« очистите выбор, нажав на кнопку «X 'of ng-select "

(сделайте утверждение, что кнопка Сохранить теперь некровоточил)

как мне это сделать?