Code Lab

От поля пароля вверх к группе

ЛёгкаяЛокаторы8 мин

Перед тобой разметка lab.becomeqa.com с открытым окном входа. Каждое поле формы лежит в своём div с классом form-group.

Напиши XPath для div с классом form-group, где лежит поле пароля. Поднимись к нему от самого поля по оси ancestor.

XPath должен находить одну группу и не ломаться, если группы поменяются местами, вокруг поля появится ещё один div, в форму добавят поле Email или у группы появятся другие классы.

Спрашивали в TBO.com · Источник

Локатор

Страница login-modal

<header class="bg-blue-600 text-white p-4" id="main-header">
<nav class="container mx-auto flex justify-between items-center">
<div class="logo" data-test-id="logo">
<h1 class="text-2xl font-bold">QA Test Site</h1>
</div>
<div class="nav-links flex items-center space-x-4">
<a class="hover:underline active-link" id="home-link" data-discover="true">Home</a>
<a class="hover:underline nav-link" id="items-link" data-discover="true">Track your Travel</a>
<button class="bg-blue-500 hover:bg-blue-400 px-4 py-2 rounded transition-colors duration-200 login-button" id="login-btn" data-test-id="login-button">Login</button>
</div>
</nav>
</header>
<div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 login-modal-overlay" id="login-modal-overlay" style="display: flex; align-items: center; justify-content: center;">
<div class="bg-white rounded-lg p-6 w-96 max-w-lg login-modal-content mx-auto" id="login-modal-content" data-test-id="login-modal-content">
<div class="login-modal-header mb-4">
<h3 class="text-xl font-bold login-modal-title text-center" id="login-modal-title" data-test-id="login-modal-title">Login to Your Account</h3>
</div>
<div class="login-modal-body" data-test-id="login-modal-body">
<div class="space-y-4 login-form" id="login-form">
<div class="form-group">
<label class="block text-sm font-medium text-gray-700 label" for="login-username" data-test-id="username-label">Username</label>
<input id="login-username" class="mt-1 block w-full border rounded-md px-3 py-2 input-field border-gray-300" placeholder="Enter your username" data-test-id="username-input" type="text" value="">
</div>
<div class="form-group">
<label class="block text-sm font-medium text-gray-700 label" for="login-password" data-test-id="password-label">Password</label>
<input id="login-password" class="mt-1 block w-full border rounded-md px-3 py-2 input-field border-gray-300" placeholder="Enter your password" data-test-id="password-input" type="password" value="">
</div>
</div>
</div>
<div class="login-modal-footer flex justify-end space-x-2 mt-6">
<button type="button" class="px-4 py-2 bg-gray-300 text-gray-700 rounded hover:bg-gray-400 btn-cancel" id="login-cancel-btn" data-test-id="login-cancel-button">Cancel</button>
<button type="button" class="px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded btn-login" id="login-submit-btn" data-test-id="login-submit-button">Login</button>
</div>
</div>
</div>

Скрытые тесты запускаются по Submit.