mirror of
https://github.com/cypress-io/cypress.git
synced 2026-05-06 23:10:22 -05:00
docs: rename sidebar, clarify on file names with recipe suffix to prevent cypress.on collisions
This commit is contained in:
@@ -146,19 +146,19 @@ api:
|
||||
|
||||
examples:
|
||||
recipes:
|
||||
unit-testing: unit-testing.html
|
||||
logging-in: logging-in.html
|
||||
testing-the-dom: testing-the-dom.html
|
||||
working-with-the-backend: working-with-the-backend.html
|
||||
stubs-spies-and-clocks-recipe: stubs-spies-and-clocks.html
|
||||
extending-cypress: extending-cypress.html
|
||||
unit-testing-recipe: unit-testing-recipe.html
|
||||
logging-in-recipe: logging-in-recipe.html
|
||||
testing-the-dom-recipe: testing-the-dom-recipe.html
|
||||
working-with-the-backend-recipe: working-with-the-backend-recipe.html
|
||||
stubs-spies-and-clocks-recipe: stubs-spies-and-clocks-recipe.html
|
||||
extending-cypress-recipe: extending-cypress-recipe.html
|
||||
applications:
|
||||
kitchen-sink: kitchen-sink.html
|
||||
todo-mvc: todo-mvc.html
|
||||
pie-chopper: pie-chopper.html
|
||||
phonecat: phonecat.html
|
||||
docker:
|
||||
images: images.html
|
||||
docker-images: docker-images.html
|
||||
circle-ci: circle-ci.html
|
||||
codeship: codeship.html
|
||||
|
||||
|
||||
@@ -135,7 +135,7 @@ cy
|
||||
***Using fixtures to bootstrap data***
|
||||
|
||||
{% note info %}
|
||||
{% url 'Check out our example recipe using `cy.fixture()` to bootstrap data for our application.' working-with-the-backend %}
|
||||
{% url 'Check out our example recipe using `cy.fixture()` to bootstrap data for our application.' working-with-the-backend-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
***Using an alias to access a fixture***
|
||||
@@ -235,4 +235,4 @@ For other types of files, they will be read as `utf8` by default, unless specifi
|
||||
|
||||
- {% url `cy.route()` route %}
|
||||
- {% url `.then()` then %}
|
||||
- {% url 'Recipe: Bootstrapping App Test Data' working-with-the-backend%}
|
||||
- {% url 'Recipe: Bootstrapping App Test Data' working-with-the-backend-recipe %}
|
||||
|
||||
@@ -70,7 +70,7 @@ cy.getCookie('session_id')
|
||||
***Using `cy.getCookie()` to test logging in***
|
||||
|
||||
{% note info %}
|
||||
Check out our example recipes using `cy.getCookie()` to test {% url 'logging in using HTML web forms' logging-in %}, {% url 'logging in using XHR web forms' logging-in %} and {% url 'logging in with single sign on' logging-in %}
|
||||
Check out our example recipes using `cy.getCookie()` to test {% url 'logging in using HTML web forms' logging-in-recipe %}, {% url 'logging in using XHR web forms' logging-in-recipe %} and {% url 'logging in with single sign on' logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
# Rules
|
||||
|
||||
@@ -23,7 +23,7 @@ cy.get('.content').invoke('show').click()
|
||||
```
|
||||
|
||||
{% note info %}
|
||||
{% url 'Check out our example recipe on testing hover and working with hidden elements' testing-the-dom %}
|
||||
{% url 'Check out our example recipe on testing hover and working with hidden elements' testing-the-dom-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
You can also force the action to be performed on the element regardless of whether the element is visible or not.
|
||||
@@ -53,4 +53,4 @@ cy.get('.content').trigger('mouseover')
|
||||
|
||||
- {% url `.invoke()` invoke %}
|
||||
- {% url `cy.wrap()` wrap %}
|
||||
- {% url 'Recipe: Dealing with Hover and Hidden Elements' testing-the-dom %}
|
||||
- {% url 'Recipe: Dealing with Hover and Hidden Elements' testing-the-dom-recipe %}
|
||||
|
||||
@@ -59,7 +59,7 @@ cy.wrap({foo: fn}).invoke('foo').should('eq', 'bar') // true
|
||||
***Use `.invoke()` to test HTML content***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('text')` to test against HTML content" working-with-the-backend %}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('text')` to test against HTML content" working-with-the-backend-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
***Properties that are functions are invoked***
|
||||
@@ -77,7 +77,7 @@ cy.get('div.container').should('be.hidden') // true
|
||||
***Use `.invoke('show')` and `.invoke('trigger')`***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('show')` and `cy.invoke('trigger')` to click an element that is only visible on hover" testing-the-dom %}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('show')` and `cy.invoke('trigger')` to click an element that is only visible on hover" testing-the-dom-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
## Function with Arguments
|
||||
@@ -99,7 +99,7 @@ cy
|
||||
***Use `cy.invoke('removeAttr', 'target')` to get around new tab***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('removeAttr', 'target')` to test clicking on a link without opening in a new tab" testing-the-dom%}
|
||||
{% url "Check out our example recipe where we use `cy.invoke('removeAttr', 'target')` to test clicking on a link without opening in a new tab" testing-the-dom-recipe %}%}
|
||||
{% endnote %}
|
||||
|
||||
***Arguments are automatically forwarded to the function***
|
||||
|
||||
@@ -179,7 +179,7 @@ cy.getCookie('cypress-session-cookie').should('exist')
|
||||
***Using cy.request for HTML Forms***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe using `cy.request()` for HTML form submissions" logging-in %}
|
||||
{% url "Check out our example recipe using `cy.request()` for HTML form submissions" logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
# Notes
|
||||
@@ -249,7 +249,7 @@ When clicking on `request` within the command log, the console outputs the follo
|
||||
|
||||
- {% url `cy.exec()` exec %}
|
||||
- {% url `cy.visit()` visit %}
|
||||
- {% url "Recipe: Logging In - CSRF Tokens" logging-in %}
|
||||
- {% url "Recipe: Logging In - HTML Web Form" logging-in %}
|
||||
- {% url "Recipe: Logging In - Single Sign on" logging-in %}
|
||||
- {% url "Recipe: Logging In - XHR Web Form" logging-in %}
|
||||
- {% url "Recipe: Logging In - CSRF Tokens" logging-in-recipe %}
|
||||
- {% url "Recipe: Logging In - HTML Web Form" logging-in-recipe %}
|
||||
- {% url "Recipe: Logging In - Single Sign on" logging-in-recipe %}
|
||||
- {% url "Recipe: Logging In - XHR Web Form" logging-in-recipe %}
|
||||
|
||||
@@ -97,7 +97,7 @@ cy.wait('@postUser')
|
||||
***Setup route to `POST` to login***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe using `cy.route()` to POST for login" logging-in %}
|
||||
{% url "Check out our example recipe using `cy.route()` to POST for login" logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
***Wait on `url` matching glob***
|
||||
@@ -313,7 +313,7 @@ cy.route({
|
||||
***Setup route to error on POST to login***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe using `cy.route()` to simulate a `503` on `POST` to login" logging-in %}
|
||||
{% url "Check out our example recipe using `cy.route()` to simulate a `503` on `POST` to login" logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
***Change `headers`***
|
||||
@@ -482,4 +482,4 @@ When clicking on `XHR Stub` within the Command Log, the console outputs the foll
|
||||
- {% url `cy.server()` server %}
|
||||
- {% url `cy.wait()` wait %}
|
||||
- {% url 'Guide: Network Requests' network-requests %}
|
||||
- {% url 'Recipe: Logging in - XHR Web Form' logging-in %}
|
||||
- {% url 'Recipe: Logging in - XHR Web Form' logging-in-recipe %}
|
||||
|
||||
@@ -185,4 +185,4 @@ When clicking on the `(stub-1)` event within the command log, the console output
|
||||
- {% url `cy.spy()` spy %}
|
||||
- {% url 'Guide: Stubs, Spies and Clocks' stubs-spies-and-clocks %}
|
||||
- {% url "Recipe: Controlling Behavior with Spies, Stubs, and Clocks" stubs-spies-and-clocks-recipe %}
|
||||
- {% url "Recipe: Unit Test - Stubbing Dependencies" unit-testing %}
|
||||
- {% url "Recipe: Unit Test - Stubbing Dependencies" unit-testing-recipe %}
|
||||
|
||||
@@ -86,7 +86,7 @@ cy.get('textarea').type('Hello world') // yields <textarea>
|
||||
***Type into a login form***
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe of logging in by typing username and password" logging-in %}
|
||||
{% url "Check out our example recipe of logging in by typing username and password" logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
***Mimic user typing behavior***
|
||||
|
||||
@@ -82,8 +82,8 @@ cy.visit('http://localhost:3000/#dashboard', {
|
||||
|
||||
{% note info %}
|
||||
Check out our example recipes using `cy.visit()`'s `onBeforeLoad` option to:
|
||||
- {% url 'Bootstrap app data' working-with-the-backend %}
|
||||
- {% url 'Set a token to `localStorage` for login' logging-in %}
|
||||
- {% url 'Bootstrap app data' working-with-the-backend-recipe %}
|
||||
- {% url 'Set a token to `localStorage` for login' logging-in-recipe %}
|
||||
- {% url 'Stub `window.fetch`' stubs-spies-and-clocks-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
@@ -232,6 +232,6 @@ When clicking on `visit` within the command log, the console outputs the followi
|
||||
- {% url `cy.go()` go %}
|
||||
- {% url `cy.reload()` reload %}
|
||||
- {% url `cy.request()` request %}
|
||||
- {% url "Recipe: Bootstrapping App Test Data" working-with-the-backend %}
|
||||
- {% url "Recipe: Logging In - Single Sign on" logging-in %}
|
||||
- {% url "Recipe: Bootstrapping App Test Data" working-with-the-backend-recipe %}
|
||||
- {% url "Recipe: Logging In - Single Sign on" logging-in-recipe %}
|
||||
- {% url "Recipe: Stubbing `window.fetch`" stubs-spies-and-clocks-recipe %}
|
||||
|
||||
@@ -109,7 +109,7 @@ Cypress.config("viewportWidth") // => 800
|
||||
**Using config to set `baseUrl`**
|
||||
|
||||
{% note info %}
|
||||
{% url "Check out our example recipe where we reset our `baseUrl` using `Cypress.config()`" logging-in %}
|
||||
{% url "Check out our example recipe where we reset our `baseUrl` using `Cypress.config()`" logging-in-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
## Object
|
||||
|
||||
@@ -128,7 +128,7 @@ Cypress does not and may never have multi-tab support for various reasons.
|
||||
|
||||
Luckily there are lots of easy and safe workarounds that enable you to test this behavior in your application.
|
||||
|
||||
{% url 'Read through this recipe to see how to test anchor links.' testing-the-dom %}
|
||||
{% url 'Read through this recipe to see how to test anchor links.' testing-the-dom-recipe %}
|
||||
|
||||
|
||||
## {% fa fa-angle-right %} How do I get an input's value in Cypress?
|
||||
@@ -189,7 +189,7 @@ Next, you'd want to check that you have the proper permissions for installing on
|
||||
|
||||
There are a lot of ways to test this, so it depends. You'll need to be aware of what actually causes the download, then think of a way to test that mechanism.
|
||||
|
||||
If your server sends specific disposition headers which cause a browser to prompt for download, you can figure out what URL this request is made to, and use {% url "cy.request()" request %} to hit that directly. Then you can test that the server send the right response headers.
|
||||
If your server sends specific disposition headers which cause a browser to prompt for download, you can figure out what URL this request is made to, and use {% url "cy.request()" request %} to hit that directly. Then you can test that the server send the right response headers.
|
||||
|
||||
If it's just an anchor that initiates the download, you could just test that it has the right `href` property. As long as you can verify that clicking the button is going to make the right HTTP request, there's nothing else to test for.
|
||||
|
||||
|
||||
@@ -727,7 +727,7 @@ cy.wrap(obj).its('foo')
|
||||
|
||||
## List of Assertions
|
||||
|
||||
Cypress bundles {% url "`Chai`" bundled-tools#Chai %}, {% url "`Chai-jQuery`" bundled-tools#Chai-jQuery %}, and {% url "`Sinon-Chai`" bundled-tools#Sinon-Chai %} to provide built-in assertions. You can see a comprehensive list of them in {% url 'the list of assertions reference' assertions %}. You can also {% url "write your own assertions as Chai plugins" extending-cypress %} and use them in Cypress.
|
||||
Cypress bundles {% url "`Chai`" bundled-tools#Chai %}, {% url "`Chai-jQuery`" bundled-tools#Chai-jQuery %}, and {% url "`Sinon-Chai`" bundled-tools#Sinon-Chai %} to provide built-in assertions. You can see a comprehensive list of them in {% url 'the list of assertions reference' assertions %}. You can also {% url "write your own assertions as Chai plugins" extending-cypress-recipe %} and use them in Cypress.
|
||||
|
||||
## Writing Assertions
|
||||
|
||||
@@ -790,7 +790,7 @@ expect(true).to.be.true
|
||||
```
|
||||
|
||||
{% note info Did you know you can write Unit Tests in Cypress? %}
|
||||
Check out our example recipes for {% url 'unit testing' unit-testing %} and {% url 'unit testing React components' unit-testing %}
|
||||
Check out our example recipes for {% url 'unit testing' unit-testing-recipe %} and {% url 'unit testing React components' unit-testing-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
Explicit assertions are great when you want to:
|
||||
|
||||
@@ -17,7 +17,6 @@ Cypress runs tests in a unique interactive runner that allows you to see command
|
||||
|
||||
{% img no-border /img/guides/gui-diagram.png Cypress Test Runner %}
|
||||
|
||||
|
||||
# Test Runner Components:
|
||||
|
||||
## Command Log
|
||||
|
||||
@@ -59,7 +59,7 @@ Test files may be written as `.js`, `.jsx`, `.coffee`, or `cjsx` files.
|
||||
Cypress supports ES2015, ES2016, ES2017, and JSX. ES2015 modules and CommonJS modules are also supported, so you can `import` or `require` both npm packages and local modules.
|
||||
|
||||
{% note info Importing ES2015 or CommonJS modules %}
|
||||
{% url 'Check out our example recipe using ES2015 and CommonJS modules' extending-cypress %}
|
||||
{% url 'Check out our example recipe using ES2015 and CommonJS modules' extending-cypress-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
To see an example of every command used in Cypress, open the {% url "`example_spec.js`" https://github.com/cypress-io/cypress-example-kitchensink/blob/master/cypress/integration/example_spec.js%} within your `cypress/integration` folder.
|
||||
@@ -72,7 +72,7 @@ Cypress is built on top of {% url 'Mocha' bundled-tools#Mocha %} and uses its `b
|
||||
|
||||
If you're familiar with writing tests in JavaScript, then writing tests in Cypress will be a breeze.
|
||||
|
||||
We're still working on introductory docs and videos. If you want to see Cypress in action, %{ url 'check out some examples' kitchen-sink %} of applications using Cypress tests and {% url "check out some example recipes we've written" unit-testing %} for special use cases.
|
||||
We're still working on introductory docs and videos. If you want to see Cypress in action, %{ url 'check out some examples' kitchen-sink %} of applications using Cypress tests and {% url "check out some example recipes we've written" unit-testing-recipe %} for special use cases.
|
||||
|
||||
## BDD Interface
|
||||
|
||||
|
||||
@@ -397,7 +397,7 @@ Logging in can be more complex than what we've just covered.
|
||||
|
||||
We've created several recipes covering additional scenarios like dealing with CSRF tokens, or testing XHR based login forms.
|
||||
|
||||
Feel free to {% url 'explore these additional logging in' logging-in %} recipes.
|
||||
Feel free to {% url 'explore these additional logging in' logging-in-recipe %} recipes.
|
||||
{% endnote %}
|
||||
|
||||
# Get Started
|
||||
|
||||
@@ -61,7 +61,7 @@ Cypress comes fully baked, batteries included.
|
||||
|
||||
## Setup Tests
|
||||
|
||||
- **Get Started in Minutes.** Don't spend days setting up a test environment. Just {% url "install our desktop app" installing-cypress %}, {% url "add your project" testing-your-app#Adding-Your-Project %} and {% url "start testing" writing-your-first-test %}!
|
||||
- **Get Started in Minutes.** Don't spend days setting up a test environment. Just {% url "install our desktop app" installing-cypress %}, {% url "add your project" writing-your-first-test %} and {% url "start testing" testing-your-app %}!
|
||||
- **No Changes to your Code.** You don't need to change your code and Cypress doesn't need to modify your code.
|
||||
- **No Dependencies.** There's no need to download Selenium, Webdriver, Node, or any other code dependencies to get your tests up and running.
|
||||
- **ES2015 Friendly:** Write modern code with zero configuration.
|
||||
@@ -83,7 +83,7 @@ Cypress comes fully baked, batteries included.
|
||||
## Maintain Tests
|
||||
|
||||
- **Consistent Results.** Our architecture doesn't use Selenium or Webdriver. Say goodbye to slow, brittle, and flaky tests.
|
||||
- **Continuous Integration.** Cypress supports {% url "TravisCI" https://travis-ci.org/ %}, {% url "Jenkins" https://jenkins.io/ %}, {% url "CircleCI" https://circleci.com/ %}, {% url "Codeship" https://codeship.com/ %}, or any service running {% url 'Docker' images %}.
|
||||
- **Continuous Integration.** Cypress supports {% url "TravisCI" https://travis-ci.org/ %}, {% url "Jenkins" https://jenkins.io/ %}, {% url "CircleCI" https://circleci.com/ %}, {% url "Codeship" https://codeship.com/ %}, or any service running {% url 'Docker' docker-images %}.
|
||||
- **Screenshots & Videos:** Cypress automatically takes {% url 'screenshots' screenshots-and-videos %} on failed tests and records a {% url 'video' screenshots-and-videos %} of headless runs.
|
||||
- **Understand Failures:** Our {% url 'Dashboard Service' features %} can record all of your tests and help you pinpoint and understand failures.
|
||||
- **Excellent Support.** Get stuck? We're here to help you. {% open_an_issue "Open an issue" %}, join us in {% url "our Gitter chat" https://gitter.im/cypress-io/cypress %}, [email us](mailto:support@cypress.io), or {% url "ask a question on Stackoverflow" https://stackoverflow.com/search?q=cypress.io %}.
|
||||
|
||||
@@ -47,7 +47,7 @@ We're going to:
|
||||
|
||||
1. Create our own `simple_spec.js` file
|
||||
2. Watch Cypress update our list of specs
|
||||
2. Launch our browser into the Cypress GUI
|
||||
3. Launch our browser into the Cypress GUI
|
||||
|
||||
Let's create a new file using your text editor or from the terminal:
|
||||
|
||||
|
||||
@@ -36,7 +36,7 @@ Cypress should run on **all** CI providers. We currently have seen Cypress worki
|
||||
|
||||
# Setting Up CI
|
||||
|
||||
Depending on which CI provider you use, you may need a config file. You'll want to refer to your CI provider's documentation to know where to add the commands to install and run Cypress. For more example config files check out any of our {% url "example apps" unit-testing %}.
|
||||
Depending on which CI provider you use, you may need a config file. You'll want to refer to your CI provider's documentation to know where to add the commands to install and run Cypress. For more example config files check out any of our {% url "example apps" unit-testing-recipe %}.
|
||||
|
||||
## Travis
|
||||
|
||||
|
||||
@@ -149,7 +149,7 @@ Because we are using `chai`, that means you can extend it however you'd like. Cy
|
||||
2. NPM install any existing `chai` library and import into your test file or support file.
|
||||
|
||||
{% note info %}
|
||||
{% url 'Check out our example recipe extending chai with new assertions.' extending-cypress %}
|
||||
{% url 'Check out our example recipe extending chai with new assertions.' extending-cypress-recipe %}
|
||||
{% endnote %}
|
||||
|
||||
# Common Assertions
|
||||
|
||||
@@ -91,7 +91,7 @@ describe('Some Tests', function(){
|
||||
|
||||
Simply move those Cypress commands into an `it(...)` block and everything will work correctly.
|
||||
|
||||
If you are purposefully writing commands outside of a test, there is probably a better way to accomplish what you're trying to do. Read through the {% url "Examples" examples/recipes/unit-testing %}, {% url "chat with someone in our chat" https://gitter.im/cypress-io/cypress %}, or {% open_an_issue %}.
|
||||
If you are purposefully writing commands outside of a test, there is probably a better way to accomplish what you're trying to do. Read through the {% url "Examples" examples/recipes/unit-testing-recipe %}, {% url "chat with someone in our chat" https://gitter.im/cypress-io/cypress %}, or {% open_an_issue %}.
|
||||
|
||||
## {% fa fa-exclamation-triangle red %} `cy...()` failed because the element you are chaining off of has become detached or removed from the dom
|
||||
|
||||
@@ -379,7 +379,7 @@ When your application navigates to a superdomain outside of the current origin-p
|
||||
|
||||
***There are a few simple workarounds to these common situations:***
|
||||
|
||||
1. Don't click `<a>` links in your tests that navigate outside of your application. Likely this isn't worth testing anyway. You should ask yourself: *What's the point of clicking and going to another app?* Likely all you care about is that the `href` attribute matches what you expect. So simply make an assertion about that. You can see more strategies on testing anchor links {% url 'in our Example Recipe' testing-the-dom %}.
|
||||
1. Don't click `<a>` links in your tests that navigate outside of your application. Likely this isn't worth testing anyway. You should ask yourself: *What's the point of clicking and going to another app?* Likely all you care about is that the `href` attribute matches what you expect. So simply make an assertion about that. You can see more strategies on testing anchor links {% url 'in our Example Recipe' testing-the-dom-recipe %}.
|
||||
|
||||
2. You are testing a page that uses `Single sign-on (SSO)`. In this case your web server is likely redirecting you between superdomains, so you receive this error message. You can likely get around this redirect problem by using {% url `cy.request()` request %} to manually handle the session yourself.
|
||||
|
||||
|
||||
Vendored
+6
-6
@@ -163,19 +163,19 @@ sidebar:
|
||||
cypress-server: Server
|
||||
examples:
|
||||
recipes: Recipes
|
||||
unit-testing: Unit Testing
|
||||
logging-in: Logging In
|
||||
testing-the-dom: Testing the DOM
|
||||
working-with-the-backend: Working with the Backend
|
||||
unit-testing-recipe: Unit Testing
|
||||
logging-in-recipe: Logging In
|
||||
testing-the-dom-recipe: Testing the DOM
|
||||
working-with-the-backend-recipe: Working with the Backend
|
||||
stubs-spies-and-clocks-recipe: Spies, Stubs, and Clocks
|
||||
extending-cypress: Extending Cypress
|
||||
extending-cypress-recipe: Extending Cypress
|
||||
applications: Applications
|
||||
kitchen-sink: Kitchen Sink
|
||||
todo-mvc: TodoMVC
|
||||
pie-chopper: PieChopper
|
||||
phonecat: Phonecat
|
||||
docker: Docker
|
||||
images: Images
|
||||
docker-images: Images
|
||||
circle-ci: CicleCI
|
||||
codeship: Codeship
|
||||
dashboard:
|
||||
|
||||
Reference in New Issue
Block a user