Chrome проверяет, не могу найти элемент по xpath, который я только что скопировал

У меня есть значок счетчика, динамически всплывающий на странице, указывающий, что страница загружается, мне нужно определить, когда он исчезает (этот бит для меня ясен)

Каждый раз, когда я нажимаю на этот счетчик внутри google chrome inspect и нажимаю копировать xpath, я получаю следующее:

/html/body/vr-root/vr-route-handler/vr-layout/mat-sidenav-container/mat-sidenav-content/div/mat-sidenav-container/mat-sidenav-content/div/div/bs-campus/div/div/bs-data-grid/div/div[2]/mat-spinner/svg/circle

Но когда я пытаюсь найти этот элемент (даже внутри инструмента проверки Chrome, нажимая CTR + F, он его не находит.

Есть ли другой способ найти его? Я попытался найти его с помощью относительного xpath, но это тоже не удалось:

.//div/mat-spinner

Редактировать: добавлено изображение

Chrome проверяет, не могу найти элемент по xpath, который я только что скопировал

Изменить 2: когда я приостанавливаю страницу в Chrome Inspect -> Source -> Приостановить выполнение скрипта, я могу искать и находить элемент (ctr + f) в chrome inspect:

.//mat-spinner

но когда страница запущена (а элемент все еще виден), ее невозможно найти.

Журнал ошибок при попытке получить к нему доступ с помощью webdriver

org.openqa.selenium.TimeoutException: Expected condition failed: waiting for element to be clickable: By.xpath: .//div/mat-spinner (tried for 10 second(s) with 500 milliseconds interval)
        at org.openqa.selenium.support.ui.WebDriverWait.timeoutException(WebDriverWait.java:113)
        at org.openqa.selenium.support.ui.FluentWait.until(FluentWait.java:283)
        at base.StaticSeleniumDriver.getWebElement(StaticSeleniumDriver.java:362)
        at steps.BaseSteps.debugDrawSpinner(BaseSteps.java:55)
        at ?.Given Debug draw spinner(Campus.feature:190)
      Caused by: org.openqa.selenium.NoSuchElementException: Cannot locate an element using By.xpath: .//div/mat-spinner
      For documentation on this error, please visit: http://seleniumhq.org/exceptions/no_such_element.html
      Build info: version: '3.14.0', revision: 'aacccce0', time: '2018-08-02T20:19:58.91Z'
      System info: host: 'BANNB061', ip: '10.0.75.1', os.name: 'Windows 10', os.arch: 'amd64', os.version: '10.0', java.version: '1.8.0_181'
      Driver info: driver.version: StaticSeleniumDriver

Используя следующий код:

WebDriverWait wait = new WebDriverWait(driver, timeOutInSeconds);
return wait.until(ExpectedConditions.elementToBeClickable(By.xpath(xpath)));

Поделитесь своим кодом для того же. Также попробуйте щелкнуть любой элемент на странице, пока виден счетчик, и проверить исключение - HTML для счетчика может присутствовать в журнале (также поделитесь этим HTML)

Andersson 25.10.2018 12:41

Виден ли элемент, когда вы его ищете. И как это видно и как прячется? Какую технологию вы используете?

kamentk 25.10.2018 14:21

@Andersson извините, но я не могу поделиться всем html (это с работы), к сожалению

Matthewek 25.10.2018 14:23

Нет, я имею в виду HTML для div со счетчиком и кодом, который вы используете для его обработки.

Andersson 25.10.2018 14:25

@kamentk Я создаю тесты автоматизации с использованием веб-драйвера selenium, но сейчас это не очень актуально, основная проблема заключается в следующем: 1. Я убеждаюсь, что элемент виден (счетчик) 2. Я копирую его xPath с помощью инструмента проверки хрома 3. Я убедитесь, что элемент снова виден (счетчик) 4. пока элемент все еще виден, я нажимаю CTR + F в инструменте проверки хрома, ищу элемент с xPath i, ранее скопированным, но даже если xPath такой же, он не обнаруживает его. Спасибо

Matthewek 25.10.2018 14:25

@Andersson Я только что отредактировал свой пост со скриншотом, попробую скопировать и html этого элемента.

Matthewek 25.10.2018 14:38

Обновите вопрос с помощью HTML (правильно отформатированного), а не изображения.

JeffC 25.10.2018 15:05

Можете ли вы поделиться кодом, который вы используете, и журналом исключений?

Andersson 25.10.2018 15:06

Вы пробовали использовать селекторы CSS, такие как «mat-spinner» или «mat-spinner [role = 'progressbar']»?

JeffC 25.10.2018 15:08

Если вы хотите протестировать селекторы CSS в браузере, используйте $$("mat-spinner") и т. д. В консоли разработчика Chrome. Для XPath используйте $x(...).

JeffC 25.10.2018 15:09

Может быть, он находится в рамке, и из-за этого вы не можете его найти.

j.barrio 25.10.2018 15:28

@Andersson - добавлен журнал ошибок и код, который я использую для доступа к элементу с помощью selenium webdriver, но я не уверен, насколько это актуально, потому что я еще раз повторяю, я не могу найти этот элемент с помощью инструмента проверки в Chrome, даже используя тот же xpath, который я скопировал из этого элемента, спасибо.

Matthewek 25.10.2018 15:28

@MateuszMysliwiec, вы можете проверить, находится ли mat-spinner внутри iframe?

Andersson 25.10.2018 15:41
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
2
13
1 181
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вот решение, которое я сделал в транспортире. Моя логика - проверить, присутствует ли счетчик после взаимодействия с веб-сайтом. Пример: щелкните элемент, введите текст, навигация по странице .. всплывающее окно и т. д. вы можете найти подходящее место, где его поставить. Надеюсь, это поможет, вы можете адаптировать его к любому языку. selenium API является обычным явлением.

Обратите внимание, если вы нашли .//mat-spinner, используйте его как xpath для элемента.

export async function handleSpinner() {
    console.info('Checking if loading spinner is present on the page.');

    let spinner = element(by.css('div.spinner'));
    try {
        // setting minimal timeout to search for the element
        await browser.manage().timeouts().implicitlyWait(500);

        // trigger check if there is such element on the page. will throw exception if not present
        await spinner.getWebElement();

        console.info('Spinner has been found.. waiting.... up to 10 seconds.');
        await browser.wait(ExpectedConditions.invisibilityOf(spinner), 10000, 'Spinner is still present...');
        console.info('Spinner has disappeared.');
    } catch (ex) {
        // spiner is not present so ignore the exception
    } finally {
        // Setting browser implicit timeout back to the original configuration.
        await browser.manage().timeouts().implicitlyWait(10000);
    }
}

Другие вопросы по теме