Cypress && Angular - получить селектор из href внутри Ngfor

У меня есть боковая панель навигации, и я пытаюсь сделать тест, чтобы щелкнуть ссылку и перенаправить на соответствующую страницу.

Селектор находится внутри элемента, который находится внутри цикла ngFor.

     <ng-container *ngFor = "let item of listItems">
        <li>
            <a [data-test] = "item.routerLink"></a>
        </li>
    </ng-container>

Я уже пытался использовать [href], но безуспешно.

    it('should redirect user to welcome', () => {
        cy.getBySelector('a[href* = "/welcome"]').click();
    });

Спасибо.

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
0
82
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Я бы рекомендовал создать уникальный id для каждого элемента, используя index, а затем вы можете выбрать его с помощью Cypress, как показано ниже:

<ng-container *ngFor = "let item of listItems; let i = index">
 <li>
   <a [attr.cy-data] = "'myLink-' + i" [data-test] = "item.routerLink"></a>
 </li>
</ng-container>
// * specify the index, here I'm using index 2, "select the 3rd link"
cy.get("[data-cy='myLink-2']").click();

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