Cypress: Rerouting with target="_parent" causes "Whoops, there is no test to run"

Created on 11 Jan 2019  路  9Comments  路  Source: cypress-io/cypress

Current behavior:

test runner returns Whoops, there is no test to run. when clicking a link with selector:
'#sub-menu > ul > :nth-child(5) > a'

Desired behavior:

test passes after link is clicked.

Steps to reproduce: (app code and test code)

app code

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <nav class="navbar navbar-default" id="navTopBar" role="navigation">
        <div></div>
    </nav>
    <footer class="footer">
        <div class="container-fluid">
            <div class="row">
                <div class="privacy-seal"></div>
                <nav id="sub-menu">
                    <ul>
                        <li><a href="AboutUs.htm" target="_parent">About Us</a></li>|
                        <li><a href="faq.html" target="_parent">FAQ</a></li>|
                        <li><a href="ContactUs.htm" target="_parent">Contact Us</a></li>|
                        <li><a href="TermsConditions.htm" target="_parent">Terms and Conditions</a></li>|
                        <li><a href="PrivacyPolicy.htm" target="_parent">Privacy Policy</a></li>
                    </ul>
                </nav>
            </div>
            <div class="row copyright">
                <span class="h6-xs">Copyright 2018.</span>
            </div>
            <div class="social">
                <ul class="social-links">
                    <li class="facebook"><a href="https://www.facebook.com" target="_blank">Facebook</a></li>
                    <li class="instagram"><a href="https://www.instagram.com/" target="_blank">Instagram</a></li>
                    <li class="twitter"><a href="https://twitter.com/" target="_blank">Twitter</a></li>
                </ul>
            </div>
        </div>
    </footer>
</body>

</html>

test code

        it('causes cypress to stop running tests', () => {
            cy.visit('nav-test.html')
            cy.title().should('eq', 'Document')
            cy.get('#sub-menu > ul > :nth-child(5) > a').should('contain', 'Privacy Policy')
            cy.get('#sub-menu > ul > :nth-child(5) > a').click()
            cy.url().should('include', 'PrivacyPolicy')
        })

Versions


Mac OS - Mojave
Cypress v.3.1.4
Google Chrome Version 71.0.3578.98 (Official Build) (64-bit)

pkhttps-proxy ready for work 馃槼 whoops there is no test to run framebusting bug

All 9 comments

@jadiaz, this is because you have target="_parent" in your <a> tag, which tells the parent frame of the window to navigate, not the current frame.

We should probably rewrite target="_parent" to target="_self" in the proxy layer in order to behave the same way as non-iframed app would

In the meantime, you should change your code to use target="_self" (this will not affect your site's behavior in any way), and is also the default target of an <a> tag. see the target section here https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a

Confirmed. Setting to target="_self" does fix the issue.

This happens when target is set to "_top" as well.

Theres a solution in #1364

https://github.com/cypress-io/cypress/issues/1364

Is there any way to see better error handling rather than having the ui explode or the cli just hang?

@Bkucera Brian mentioned that you are working on related work to this and this could be added to 3.1.6.

I looked at the "anchor target Property" documentation (https://www.w3schools.com/jsref/prop_anchor_target.asp)

It seems like there is a possible "framename" value that you can assign to the "target" property of anchors.

Example: Some Link URL

Looking at this, would it be possible to set the name of the iframe which Cypress injects to run tests to something like "cypress-runner-iframe". This way, you may update your anchor "target" attribute to point to that during your test runs.

Maybe this is not ideal, but it would probably a way better solution to set the "target" to "_parent" since you may have multiple iframe layers in your application.

Another clear reproducible example from https://github.com/cypress-io/cypress/issues/5938:

index.html

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form method="post" target="_parent">
  <input id="text_value" />
  <button type="submit" id="submit_form">Save</button>
</form>
</body>
</html>

spec.js

it('test', () => {
  cy.visit('index.html')
  cy.get('#text_value')
    .type('My Text')
  cy.get('#submit_form')
    .click()
})

5964 This issue resolved for me after modifying Configuration to "modifyObstructiveCode: true" from initial "modifyObstructiveCode: false". in Cypress.json

so how do we want to fix this? modifyObstructiveCode does not seem to work for me.

For me changing the attribute in the DOM worked:

cy.get('.approved-content .no-auto-submit').invoke('attr', 'target', '_self');

Was this page helpful?
0 / 5 - 0 ratings