Транспортир: как получить текст ngb-alert - PullRequest
0 голосов
/ 02 июля 2019

Я хочу проверить, работает ли добавление источника данных. Обычно я даю информацию в модале, нажимаю «Подтвердить», модал исчезает, и мой список источников данных теперь длиннее. (Я проверяю длину до и после добавления источника данных, поэтому ожидаю, что список будет длиннее после его редактирования). Но когда источник данных не существует или уже был добавлен, появляется сообщение о загрузке с сообщением об ошибке, и модальное состояние остается на месте. Example of error message Что я хочу: проверить, появляется ли сообщение об ошибке, чтобы я мог отобразить это сообщение об ошибке вместо количества источников данных. Таким образом я быстрее узнаю, почему мой тест не прошел.

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

Это сообщение от SO, казалось, было именно моей проблемой: транспортир: тестирование предупреждений начальной загрузки , но также не решило мою проблему.

Это HTML-код, который появляется:

<dm-alert>
 <ngb-alert>
    <div role="alert" class="alert alert-danger alert-dismissible">
      <button aria-label="Close" class="close" type="button">
            <span aria-hidden="true">×</span>
      </button>
      The description '4106-5002-5005-5006-02' has to be unique
    </div>
 </ngb-alert>
</dm-alert>

Я использую async / await, чтобы убедиться, что программа ожидает, поэтому все функции, в которых содержится следующий код, являются асинхронными функциями. Поэтому я попытался достичь его таким образом (также без улова и с дополнительной функцией, когда превышается время ожидания). Это был метод внутри объекта страницы, поэтому он возвращает значения:

(сценарий 1)

import { $, browser, by, element, ExpectedConditions as until } from 'protractor';
await browser.wait(until.presenceOf(element(by.xpath('//ngb-alert/div[contains(@class, alert-danger)]'))), waitTimeForErrorInSeconds * 1000).then((isPresent) => {
      return isPresent;
    }).catch(() => {
      console.log('no error occured')
      return false;
    })
    return false;

И вот так, этот был только внутри теста: (сценарий 2)

await browser.wait(until.presenceOf(element(by.xpath('//ngb-alert/div[contains(@class, alert)]'))), 10 * 1000)
     .then((isPresent) => {
         console.log('is present (true):  ' + isPresent);
         let text = element(by.xpath('//ngb-alert/div[contains(@class, alert)]')).getText();
         console.log(text);
      }, (isPresent) => {
          console.log('is present (false):  ' + isPresent)
      }).catch((error) => {
          console.log('browser.wait.catch: ' + error)
      })

здесь тест всегда переходит в «присутствует (ложно)», когда появляется предупреждение или нет. Мне нравится, что это не провалит мой тест на это, но я бы хотел, чтобы он заметил, когда всплывает предупреждение.

И вот так (тоже внутри теста): (сценарий 3)

expect(element(by.xpath('//ngb-alert/div[contains(@class, alert)]'))
     .isDisplayed())
     .toBeFalsy();

isDisplayed всегда выдает ошибку, потому что не может найти элемент

(сценарий 4)

expect(element(by.xpath('//ngb-alert/div[contains(@class, alert)]'))
     .isPresent())
     .toBeFalsy();

isPresent работает хорошо, когда нет ошибок, но когда есть, он не заметит.

Я проверил XPath, выполнив поиск в инструментах разработчика в chrome, когда он присутствует, и он всегда находит его немедленно, так что это не должно быть проблемой. Прежде чем я попробовал все это, я заставил это работать. Поэтому поиск по этому XPath работал раньше.

EDIT:

Итак, я заметил, что мой сценарий 2 уже был хорош, но по какой-то причине, пока .presenceOf не работал, но если я сделал .isPresent () для элемента, он, похоже, нашел элемент. Но почему?

Это код для предупреждения:

<ngb-alert [type]="notification.category" (close)="close(notification)">
    {{ notification.message }}
</ngb-alert>

Поэтому я подумал, что один из них должен работать в сценарии 2 (строка 5), чтобы получить текст уведомления:

element(by.xpath('//ngb-alert')).getText();
element(by.xpath('//ngb-alert/div')).getText();
element(by.xpath('//ngb-alert/div[contains(@class, alert)]')).getText();
element(by.binding('notification.message')).getText();
element(by.binding('notification.message')).$('ngb-alert').getText();

Но они не ...

Итак, еще одна попытка с этим: (сценарий 5)

await browser.wait((element(by.xpath('//ngb-alert/div[contains(@class, alert-danger)]')).isPresent()), 3 * 1000)
    .then((isPresent) => {
       console.log('browser.wait.then true: ' + isPresent)
       element(by.binding('notification.message')).$('ngb-alert').getText()
                .then((text) => {
                    console.log(text);
                });
     }, (isPresents) => {
        console.log('browser.wait.then false: ' + isPresents)
     }).catch((error) => {
         // if fails
         console.log('browser.wait.catch: ' + error)

     })

Это возвращает
browser.wait.then true: false
browser.wait.catch: JavascriptError: ошибка javascript: угловой не определен

Еще одна попытка ...

Хорошо, так что здесь я использую before.presenceOf (before = ExpectedConditions) и без xpath:

        await browser.wait(until.presenceOf($('.alert-danger')), 3 * 1000)
            .then((isPresent) => {
                console.log('browser.wait.then true: ' + isPresent);
                $('ngb-alert').element(by.binding('notification.message')).getText().then((text) => {
                    console.log(text);
                });
            }, (isPresents) => {
                console.log('browser.wait.then false: ' + isPresents)
            }).catch((error) => {
                console.log('browser.wait.catch: ' + error)
            })

Здесь происходит то, что, когда не отображается предупреждение, оно дает ожидаемый ответ:

browser.wait.then false: TimeoutError: Wait timed out after 3013ms  

Но когда появляется предупреждение, оно будет ждать, пока предупреждение исчезнет, ​​а затем сообщит мне следующее:

browser.wait.then false: TimeoutError: Wait timed out after 7664ms 

Так почему же он внезапно ждет дольше, чем тайм-аут, который я дал (который составлял 3 секунды).

1 Ответ

0 голосов
/ 08 июля 2019

Наконец я нашел ответ здесь . Мне пришлось добавить ignoreSynchronization. Поскольку таймер отключается при отображении уведомления, он ждал, пока он не исчезнет, ​​чтобы проверить уведомление. На самом деле нервы разрушают, вот в чем причина ...

Так что это код, который работал для меня, чтобы получить текст ngb-alert, если предупреждение появляется (для моего кода я не хочу, чтобы произошла ошибка, но когда это происходит, я хочу иметь возможность чтобы знать, что это была за ошибка):

browser.ignoreSynchronization = true;
await browser.wait(until.presenceOf(element(by.css('.alert-danger'))), 5 * 1000)
    .then((isPresent) => {
        console.log('presence of error: ' + isPresent);
        $('ngb-alert').getText().then((errorAlert) => {
          expect('no error').toBe('displayed', 
          'This error showed up when adding data source: ' + errorAlert)
        });
        }, (isNotPresent) => {
            console.log('no presence of error: ' + isNotPresent)
        }).catch((error) => {
            console.log('checking presence of error caused an error: ' + error)
        })
browser.ignoreSynchronization = false;

P.S .: Получение элемента с помощью привязки, по-видимому, не то, что вы можете сделать с угловым 5, вы получите эту ошибку:

"JavascriptError: javascript error: angular is not defined".
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...