javascriptcypress

Cypress - attribute containing text and end of string

Let's assume I have such html:

<div class="my_class" id="first_case">
  <a href="/foo/bar/123"></a>
</div>

<div class="my_class" id="second_case">
  <a href="/foo/bar/1234567"></a>
</div>

I want to make assertion that there is an item with href, which ends with '/123'.

const test_id = '123'

cy.get('.my_class').find('a').should("have.attr", "href").and("contain", '/' + test_id);

It works, however I don't know how to make sure that the assertion is true only for href with exact ending ('/123', as shown in #first_case in first code snippet) and that it is false for other strings starting with such number, for example ('/1234567', as shown in #second_case in first code snippet).

In other words, the assertion should be true for #first_case, but false for #second_case.

I tried using end of string symbol or making new RegExp object, however couldn't make it work. Any help would be appreciated!

Solution

  • In vanilla JS, you can try with querySelector() and attribute ends with selector ([name$="value"). Please note, you forgot to close the a element.

    const test_id = '123'
var el = document.querySelector(`[href$="${test_id}"]`);
console.log(el);
    <div class="my_class" id="first_case">
  <a href="/foo/bar/123"></a>
</div>

<div class="my_class" id="second_case">
  <a href="/foo/bar/1234567"></a>
</div>