DOM snapshots not displayed due to ad displayed.

[gpenafib]

• Operating System: Windows 7
• Cypress Version: 2.1.0
• Browser Version: Chrome 64

Is this a Feature or Bug?

Bug

Current behavior:

When I run my tests, at the end of the run, in the app preview section, where the DOM snapshots should be displayed, I just get an ad, as can be viewed in the attached screenshot. This ad is part of the webpage I am testing, but it is not displayed if I execute manually the same commands in the original website.
This prevents me from viewing any DOM snapshot although all the test pass.

This issue doe not happen every single time, but occasionally.

Desired behavior:

Ad is not displyed and I can view the DOM snapshots of the run.

How to reproduce:

Run the code added to this issue. This issue happens when visiting the webpage: www.wordreference.com

Test code:

describe('A trial', function() {
    it ('Get any element by Cypress Selector Playground', function() {
    cy.visit('http://www.wordreference.com/')

    cy.get('#fSelect').select('English-German')

    cy.get('#si')
    .type('power')

    cy.contains('powerful').click() 

    cy.title().should('include', 'powerful')

})
})

Additional Info (images, stack traces, etc)

[RandallKent]

@gpenafib - I’d recommend checking out blacklistHosts configuration option in the cypress.json to prevent the ad block from rendering.

[gpenafib]

but how can I fix it then? if I blacklist www.wordreference.com, Cypress will not run the test, as traffic will be blocked to this website.
How can block the ad from popping up?

[jennifer-shehane]

I'm not totally experiencing what you are when I run the tests - I think that specific ad has some weird behavior that is breaking the snapshots, but I was able to improve the loading of the page and block some of the ads by setting this in my cypress.json:

{
  "blacklistHosts": ["http://ads**"]
}

You should keep adding any third party requests (the ones requesting the ads) in the array of blacklistHosts to just prevent the ads from loading altogether.

Alternatively, the best solution would be to run your tests in a testing environment and turn off the ad behavior/requests altogether when testing, but I know this doesn't fit everyone's needs.

[RandallKent]

@gpenafib - I was able to prevent the ads from appearing by blacklisting s.gweini.com.

Below was the cypress.json I used.

{
  "blacklistHosts": "s.gweini.com"
}

[gpenafib]

Hi guys, thanks for your support!
I have tried both options that you guys suggested and is still happening. If you re-run the test a few times, in the end this issue will happen again unfortunately.

Any other idea how to fix it?

[jennifer-shehane]

So, when this happens, try opening your console and going to the Network tab. There should be a url that this specific ad is loading from that you'll need to track down, this is the domain that you need to add to your blacklistHosts array.

[gpenafib]

I followed your last comment and it seems to be fixed now, many thanks!