Frame-breaking CSP directive: "frame-ancestors 'none'" prevents loading page, despite disabling Chrome Web Security

• Operating System: macOS 10.13.4
• Cypress Version: 2.1.0
• Browser Version: Chrome 65.0.3325.181

Is this a Feature or Bug?

Bug

Current behavior:

I’m using Cypress to run end-to-end tests on an application that allows users to configure a connection to a GitHub OAuth application. The interactions with GitHub are complex and involve needing to receive webhooks, so I want to test the actual connection as opposed to stubbing. I have managed to do this successfully with Bitbucket, but the authorization page on GitHub has a CSP rule that doesn’t seem to get caught despite setting "chromeWebSecurity": false in my Cypress configuration. The interaction is as follows:

1. User creates an OAuth Application on GitHub
2. User takes the Client ID and Client Secret from that OAuth Application and enters them in my application to create a connection just for their use.
3. My application generates a callback URL for GitHub, which the user then enters in their GitHub OAuth application
4. User returns to my application and clicks a button to connect to the OAuth application. This hits a URL in my own application that sets up the OAuth dance, and then redirects to GitHub’s authorization page
5. When that redirection occurs, Cypress suddenly replaces the contents of the URL bar with data:, and displays a blank page. Opening the web inspector shows this error in the console:

Refused to display 'https://github.com/login/oauth/authorize?client_id=SCRUBBED&redirect_uri=SCRUBBED' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'none'".

Desired behavior:

The above steps do not result in a blank page and the console error. Instead, the OAuth Authorization page is displayed and allows my test to click the “Authorize user” button and finish the OAuth dance

How to reproduce:

I can reproduce this in a barebones Rails app and have pushed the code to GitHub. You’ll need:

• Ruby 2.5 along with the bundler gem
• A GitHub username/password, probably one that is not of import. Make sure 2FA is not enabled.

Then, in one Terminal tab, set up and boot the application:

git clone https://github.com/davidcelis/cypress_framebusting.git
cd cypress_framebusting
bundle
bin/rails db:create db:migrate
bin/rails server

Then, in another tab, run the Cypress tests:

export CYPRESS_GITHUB_USERNAME=username
export CYPRESS_GITHUB_PASSWORD=password
yarn run cypress open

NOTE: The tests are written in a way that you’ll need to run the fifth test file between tries, so that it will delete the OAuth Application that gets created on GitHub as well as emptying the local application’s database

Test code:

https://github.com/davidcelis/cypress_framebusting/tree/master/cypress/integration/

Additional Info (images, stack traces, etc)

Possibly related to #1497

[brian-mann]

Overall, I get what you’re trying to do. If you’d like, make some updates and post back here and we can give you feedback on your implementation.

It’s been on our radar for a long time now to do a comprehensive guide / recipe / example showing how to properly handle oAuth logins for 3rd party providers.

[brian-mann]

Also - really suggest watching the Best Practices video we gave at a talk a couple months ago. Will highlight some things for you: https://docs.cypress.io/guides/references/best-practices.html#Organizing-Tests-Logging-In-Controlling-State