Why cy.url() assertions in Cypress? - Purpose & Use Cases

The Big Idea

What if your tests could instantly catch broken links without you lifting a finger?

The Scenario

Imagine you manually check if your website navigates to the right page by opening the browser, clicking links, and reading the URL in the address bar every time you make a change.

The Problem

This manual checking is slow and tiring. You might miss small typos or forget to check the URL after every action. It's easy to make mistakes and hard to repeat the checks exactly the same way each time.

The Solution

Using cy.url() assertions in Cypress lets you automatically check the current page URL during tests. It quickly confirms if navigation works as expected without opening the browser or reading the address bar yourself.

Before vs After

✗ Before

Open browser
Click link
Look at address bar
Say if URL is correct

✓ After

cy.url().should('include', '/dashboard')

What It Enables

This makes your tests faster, more reliable, and able to catch navigation errors automatically every time you run them.

Real Life Example

When you build an online store, you want to be sure clicking "Checkout" always takes users to the payment page. cy.url() assertions check this automatically so you don't lose customers due to broken links.

Key Takeaways

Manual URL checks are slow and error-prone.

cy.url() assertions automate URL verification in tests.

This ensures navigation works correctly every time you test.

Practice

1. What does cy.url().should('include', '/dashboard') check in a Cypress test?

easy

A. It checks if the current URL contains '/dashboard' anywhere in it.

B. It verifies the URL exactly equals '/dashboard'.

C. It asserts the URL starts with '/dashboard'.

D. It confirms the URL ends with '/dashboard'.

Solution

1. Step 1: Understand the 'include' assertion

   The 'include' assertion checks if the given string is part of the actual URL anywhere.

2. Step 2: Apply to the example

   Using 'include' with '/dashboard' means the URL must contain '/dashboard' anywhere, not necessarily exactly or at start/end.

3. Final Answer:

   It checks if the current URL contains '/dashboard' anywhere in it. -> Option A

4. Quick Check:

   cy.url().should('include', '/dashboard') = contains '/dashboard' [OK]

Hint: Remember 'include' means substring anywhere in URL [OK]

Common Mistakes:

• Confusing 'include' with exact match
• Thinking 'include' checks start or end only
• Using 'eq' when 'include' is needed

2. Which of the following is the correct syntax to assert the URL exactly equals 'https://example.com/home' in Cypress?

easy

A. cy.url().should('contain', 'https://example.com/home')

B. cy.url().should('include', 'https://example.com/home')

C. cy.url().should('match', 'https://example.com/home')

D. cy.url().should('eq', 'https://example.com/home')

Solution

1. Step 1: Identify exact match assertion

   The 'eq' assertion checks if the actual URL exactly equals the given string.

2. Step 2: Match syntax to requirement

   Using cy.url().should('eq', 'https://example.com/home') asserts the URL is exactly that string.

3. Final Answer:

   cy.url().should('eq', 'https://example.com/home') -> Option D

4. Quick Check:

   Exact URL match uses 'eq' [OK]

Hint: Use 'eq' for exact URL match, not 'include' or 'match' [OK]

Common Mistakes:

• Using 'include' instead of 'eq' for exact match
• Using 'match' without regex
• Using 'contain' which is not a valid Cypress assertion

3. Given the code snippet:

cy.visit('/login')
cy.url().should('match', /\/login$/)

What will the assertion check?

medium

A. The URL contains '/login' anywhere.

B. The URL ends with '/login'.

C. The URL exactly equals '/login'.

D. The URL starts with '/login'.

Solution

1. Step 1: Understand the 'match' assertion with regex

   The 'match' assertion checks if the URL matches the given regular expression.

2. Step 2: Analyze the regex /\/login$/

   The regex ends with '$' which means the URL must end with '/login'.

3. Final Answer:

   The URL ends with '/login'. -> Option B

4. Quick Check:

   Regex with $ means URL ends with pattern [OK]

Hint: Regex ending with $ means URL ends with that string [OK]

Common Mistakes:

• Thinking 'match' checks substring anywhere without regex
• Confusing regex anchors like ^ and $
• Assuming 'match' equals exact string match

4. Identify the error in this Cypress assertion:

cy.url().should('equals', 'https://example.com/home')

medium

A. 'equals' is not a valid assertion keyword in Cypress.

B. The URL string is missing a trailing slash.

C. The method 'should' cannot be used with 'url'.

D. The URL must be checked with 'include' instead of 'equals'.

Solution

1. Step 1: Check valid assertion keywords for cy.url()

   Cypress supports 'eq', 'include', 'match', but not 'equals'.

2. Step 2: Identify the invalid keyword usage

   Using 'equals' causes a syntax error because it's not recognized by Cypress.

3. Final Answer:

   'equals' is not a valid assertion keyword in Cypress. -> Option A

4. Quick Check:

   Use 'eq' for exact match, not 'equals' [OK]

Hint: Use 'eq' not 'equals' for exact URL check [OK]

Common Mistakes:

• Using 'equals' instead of 'eq'
• Confusing assertion keywords
• Assuming 'should' can't be chained with 'url'

5. You want to verify that after login, the URL contains '/dashboard' but may have query parameters like '?user=123'. Which assertion is best to use?

hard

A. cy.url().should('eq', 'https://example.com/dashboard')

B. cy.url().should('contain', '/dashboard?user=123')

C. cy.url().should('include', '/dashboard')

D. cy.url().should('match', /^https:\/\/example\.com\/dashboard\?user=\d+$/)

Solution

1. Step 1: Understand the URL with query parameters

   The URL may have extra parts after '/dashboard', so exact match ('eq') won't work.

2. Step 2: Choose assertion allowing partial match

   'include' checks if '/dashboard' is anywhere in the URL, ignoring query parameters.

3. Final Answer:

   cy.url().should('include', '/dashboard') -> Option C

4. Quick Check:

   Use 'include' to ignore query parameters [OK]

Hint: Use 'include' to ignore query parameters in URL check [OK]

Common Mistakes:

• Using 'eq' which fails with query parameters
• Trying complex regex without need
• Using invalid 'contain' assertion