cypressのループ処理を抜ける方法

前提・実現したいこと

cypressにてループ処理を実行し、特定の条件と一致した場合ループ処理を抜け出せるようにしたい

発生している問題・エラーメッセージ

cypressにてループ処理を実行し、特定の条件と一致した場合ループ処理を抜け出せるようにしたいが、抜け出せずループ処理が続いてしまう

特定の条件：hrefに「test」のワードが入っていたら、そのa要素をクリックしループ処理を終了させる

CypressError: cy.click() failed because this element is detached from the DOM.

<a class="href" href="/test/">...</a>

Cypress requires elements be attached in the DOM to interact with them.

The previous command that ran was:

  > cy.get()

This DOM element likely became detached somewhere between the previous and current command.

Common situations why this happens:
  - Your JS framework re-rendered asynchronously
  - Your app code reacted to an event firing and removed the element

You typically need to re-query for the element or add 'guards' which delay Cypress from running new commands.

https://on.cypress.io/element-has-detached-from-dom

該当のソースコード

####テスト対象のソース

html
1<ul class="ul">
2  <li class="li">
3    <a class="href" href="/dummy/1">ダミー</a>
4  </li>
5  <li class="li">
6    <a class="href" href="/test/1">テスト</a>
7  </li>
8  <li class="li">
9    <a class="href" href="/aaa/1">ダミー</a>
10  </li>
11 <ul>

試したこと

以下のソースを実行したところ、上記で記載しているエラーメッセージが表示されました。

js
1    cy.get('ul > li > a').each(($el,index) => {
2        const url = $el.attr('href');
3        if(url.match(/test/) !== null){
4            return cy.get($el).click()
5        }
6    })