Как получить строку и выбрать спецификацию c td в кипарисе? - PullRequest
Новая
       6

Как получить строку и выбрать спецификацию c td в кипарисе?

2 голосов
/ 04 февраля 2020

У меня есть таблица с 6 столбцами и переменными строками. Теперь я хочу, чтобы Cypress протестировал кнопку удаления. поэтому я создал тестовый элемент в своей таблице в предыдущем тесте и хочу, чтобы моя программа удалила этот тестовый элемент.

Как мне выполнить поиск в таблице в столбце 2, отфильтровать строку и нажать на кнопку в столбце 6 с кипарисом?

Я прочитал документацию и руководство на cypress.io, но я не нашел никаких решений. 

    <div class="row">
        <div class="top-buffer"></div>
        <div class="panel panel-primary">
            <div class="panel-heading panel-head">Article</div>
            <div class="panel-body">
                <div class="btn-group">
    
                    <a asp-action="Edit" asp-route-id="@Guid.Empty" class="btn btn-primary"><i class="" glyphicon glyphicon-plus"></i>NEW</a>
                </div>
                <div class="top-buffer"></div>
                <table class="table table-bordered table-striped table-condensed">
                    <thead>
                        <tr>
                            <th>1</th>
                            <th>2</th>
                            <th>3</th>
                            <th>4</th>
                            <th>5</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var att in Model)
                        {
                        <tr>
                            <td>@Html.DisplayFor(modelItem => att.1)</td>
                            <td>@Html.DisplayFor(modelItem => att.2)</td>
                            <td>@Html.DisplayFor(modelItem => att.3)</td>
                            <td>@Html.DisplayFor(modelItem => att.4)</td>
                            <td>@Html.DisplayFor(modelItem => att.5)</td>
                            <td>
                                <a asp-action="Edit" asp-route-id="@att.Id" class="btn btn-info"><i class="glyphicon glyphicon-pencil"></i>EDIT</a>
                                <a asp-action="DeleteCategory" asp-route-id="@att.Id" class="btn btn-danger"><i class="glyphicon glyphicon-trash"></i>DELETE</a>
                            </td>
    
                        </tr>
                        }
                    </tbody>
                </table>
            </div>
        </div>
    </div>

Ответы [ 2 ]

2 голосов
/ 04 февраля 2020

Код, который вы показываете, является ASP. Net источником, который компилируется на сервере, поэтому HTML в браузере (HTML, с которым должен работать ваш тест) будет другим.

т.е. @foreach (var att in Model) дает вам строку для каждого элемента в модели, а @Html.DisplayFor(modelItem => att.2) будет переведено в конкретное содержание для столбца 2.

Поэтому было бы проще ответить, если вы запустите приложение в браузере, скопируйте и вставьте HTML из консоли.

Поскольку вы хотите выполнить поиск по столбцу 2, это может go двумя способами.

Если содержимое в столбце 2 очень уникально, например, имена, которые не появляются в других столбцах, вы можете нацелить его, просто посмотрев текст 

cy.contains('td', 'text-to-search-for')  // gives you the cell 
  .parent()                              // gives you the row
  .within($tr => {                       // filters just that row
    .get('td a')                         // finds the buttons cell of that row
    .contains('DELETE')                  // finds the delete button
    .click()

ИЛИ 

cy.contains('td', 'text-to-search-for')  // gives you the cell 
  .siblings()                            // gives you all the other cells in the row
  .contains('a', 'DELETE')               // finds the delete button
  .click()

Если текст, который вы хотите поиск может появиться в столбцах, отличных от столбца 2, это становится более сложным, но скорее всего будет достаточно вышеприведенного.

Еще одна вещь, которую следует отметить, если в сценарии тестирования всегда используются одни и те же данные, например, из В файле фикстуры вы можете указать конкретные c номера строк, но это fr agile test , который потребуется переписать, если структура страницы изменится.

0 голосов
/ 04 февраля 2020

Ваш Html имел только одну строку, поэтому в этом случае нажать кнопку будет легко. 

cy.get('.btn').click

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

 cy.get('table').find('tr').eq(ROW INDEX).find('td').eq(COLUMN INDEX).find('.btn-danger').click()

Теперь я не думаю, что это лучший способ сделать это. Я бы посоветовал вам добавить несколько классов в ваш код, чтобы вам было легче добраться до ваших элементов. Например, добавьте к кнопке удаления класс class = "delete-item", чтобы вы могли использовать его в селекторе 

   cy.get('table').find('tr').eq(ROW INDEX).find('td').eq(COLUMN INDEX).find('.delete-item').click()

Я не уверен на 100% в этом ответе, потому что я не пробовал его ,

...