Как с помощью транспортира настроить таргетинг на элементы за пределами приложения angular?

У меня есть вступительный элемент, который воспроизводится перед загрузкой приложения Angular.

<!-- need to target div below -->
<div id="intro"></div>
<!-- still bootstraping -->
<app-root></app-root>

Я использую следующие спецификации транспортира, представленные в Angular-cli

describe('my App', () => {
  let page: AppPage;

  beforeEach(() => {
    page = new AppPage(); // default from angular cli
  });

  it(`should provide an intro div`, () => {
    page.navigateTo();
    const introDiv = element(by.id('intro'));
    expect(introDiv.isPresent()).toBe(true); // reports as false in protractor test
  });
});

Я могу настроить таргетинг на элементы внутри приложения Angular, используя ту же функцию «it», описанную выше. Почему это не работает вне приложения Angular и как я могу настроить таргетинг на элементы в index.html?

Обновлять:

Я провел дополнительное тестирование и хотел зарегистрировать это в вопросе только для справки:

Не упомянуто выше, у меня есть angular удалить вводный div, поскольку он полноэкранный.

Благодаря ссылке на документацию по Protractor, предоставленную Эрнстом Цвингли, он сообщает мне, что Protractor автоматически применяет browser.waitForAngular () перед каждым действием WebDriver.

Таким образом, приведенный выше тест, который пытался нацелиться на вводный div, не смог найти его, поскольку он искал его. После загрузки angular и удаления div.

Я создал временный div в index.html, которого ничего не трогает. Он просто доступен с element(by.id('find-me')), даже если он находится вне приложения Angular.

<div id="find-me"></div>

it(`is available after angular bootstraps and can be targeted with element()`, () => {
    const findMeDiv = element(by.id('find-me'));
    expect(findMeDiv.isPresent()).toBe(true);
  });

Наконец-то я смог настроить таргетинг на вводный div с помощью browser.waitForAngularEnabled ( false), поскольку он доступен до начальной загрузки Angular. Хотя это только ожидание тайм-аутов $ http и $, кажется, что этого достаточно, чтобы иметь возможность настроить таргетинг на div перед загрузкой. Я не уверен, что это полностью отменяет browser.waitForAngular().

(Разница с waitForAngular () ожидает рендеринга, http, тайм-аутов, в то время как waitForAngularEnabled () касается только http и тайм-аутов, хотя сходство имен может указывать на то, что waitForAngularEnabled (false) полностью отменяет waitForAngular (), например, также включает рендеринг и не был указан в документации).

<div id="intro"></div>

// Works
  it(`Found to be available if I use browser.waitForAngularEnabled(false) since div is removed when Angular is ready`, () => {
    browser.waitForAngularEnabled(false);
    const introDiv = element(by.id('intro'));
    expect(introDiv.isPresent()).toBe(true);
  });

Таким образом, в основном и Эрнст Цвингли, и Xotabu4 предоставили хорошее понимание, поскольку мне нужно было browser.waitForAngularEnabled(false); и я мог использовать функцию element() для получения доступа к div.