Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: update example docs to match tests #807

Merged
merged 3 commits into from
Mar 28, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
170 changes: 118 additions & 52 deletions app/commands/actions.html

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion app/commands/cookies.html
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ <h4 id="clearCookie"><a href="https://on.cypress.io/clearcookie">cy.clearCookie(
cy.getCookie('token').should('have.property', 'value', '123ABC')

// cy.clearCookies() yields null
cy.clearCookie('token').should('be.null')
cy.clearCookie('token')

cy.getCookie('token').should('be.null')</code></pre>
</div>
Expand Down
39 changes: 0 additions & 39 deletions app/commands/misc.html
Original file line number Diff line number Diff line change
Expand Up @@ -70,45 +70,6 @@ <h1>Misc</h1>
<div class="container content-container">
<div id="misc">
<div class="row">

<div class="col-xs-7">
<h4 id="end"><a href="https://on.cypress.io/end">.end()</a></h4>
<p>To end the command chain, use the <a href="https://on.cypress.io/end"><code>.end()</code></a> command.</p>
<pre><code class="javascript">// cy.end is useful when you want to end a chain of commands
// and force Cypress to re-query from the root element
cy.get('.misc-table').within(() => {
// ends the current chain and yields null
cy.contains('Cheryl').click().end()
rubysolo marked this conversation as resolved.
Show resolved Hide resolved

// queries the entire table again
cy.contains('Charles').click()
})</code></pre>
</div>
<div class="col-xs-5">
<div class="well">
<table class="table table-bordered misc-table">
<thead>
<tr>
<th>Table</th>
</tr>
</thead>
<tbody>
<tr>
<td>User: Cheryl</td>
</tr>
<tr>
<td>User: Charles</td>
</tr>
<tr>
<td>User: Darryl</td>
</tr>
</tbody>
</table>
</div>
</div>

<div class="col-xs-12"><hr></div>

<div class="col-xs-12">
<h4 id="exec"><a href="https://on.cypress.io/exec">cy.exec()</a></h4>
<p>To execute a system command, use the <a href="https://on.cypress.io/exec"><code>cy.exec()</code></a> command.</p>
Expand Down
3 changes: 3 additions & 0 deletions app/commands/spies-stubs-clocks.html
Original file line number Diff line number Diff line change
Expand Up @@ -135,6 +135,7 @@ <h4 id="clock"><a href="https://on.cypress.io/clock">cy.clock()</a></h4>
cy.clock(now)
cy.visit('http://localhost:8080/commands/spies-stubs-clocks')
cy.get('#clock-div').click()
cy.get('#clock-div')
.should('have.text', '1489449600')</code></pre>
</div>
<div class="col-xs-5">
Expand All @@ -157,9 +158,11 @@ <h4 id="tick"><a href="https://on.cypress.io/tick">cy.tick()</a></h4>
cy.clock(now)
cy.visit('http://localhost:8080/commands/spies-stubs-clocks')
cy.get('#tick-div').click()
cy.get('#tick-div')
.should('have.text', '1489449600')
cy.tick(10000) // 10 seconds passed
cy.get('#tick-div').click()
cy.get('#tick-div')
.should('have.text', '1489449610')</code></pre>
</div>
<div class="col-xs-5">
Expand Down
53 changes: 30 additions & 23 deletions app/commands/storage.html
Original file line number Diff line number Diff line change
Expand Up @@ -74,43 +74,48 @@ <h1>Storage</h1>
<div class="col-xs-7">
<h4><a href="https://on.cypress.io/clearlocalstorage">cy.clearLocalStorage()</a></h4>
<p>To clear all data in localStorage for the current origin, use the <a href="https://on.cypress.io/clearlocalstorage"><code>cy.clearLocalStorage()</code></a> command.</p>
<pre><code class="javascript">cy.get('.ls-btn').click().should(() => {
<pre><code class="javascript">cy.get('.ls-btn').click()
cy.get('.ls-btn').should(() => {
expect(localStorage.getItem('prop1')).to.eq('red')
expect(localStorage.getItem('prop2')).to.eq('blue')
expect(localStorage.getItem('prop3')).to.eq('magenta')
})

// clearLocalStorage() yields the localStorage object
cy.clearLocalStorage().should((ls) => {
expect(ls.getItem('prop1')).to.be.null
expect(ls.getItem('prop2')).to.be.null
expect(ls.getItem('prop3')).to.be.null
cy.clearLocalStorage()
cy.getAllLocalStorage().should(() => {
expect(localStorage.getItem('prop1')).to.be.null
expect(localStorage.getItem('prop2')).to.be.null
expect(localStorage.getItem('prop3')).to.be.null
})

// Clear key matching string in localStorage
cy.get('.ls-btn').click().should(() => {
cy.get('.ls-btn').click()
cy.get('.ls-btn').should(() => {
expect(localStorage.getItem('prop1')).to.eq('red')
expect(localStorage.getItem('prop2')).to.eq('blue')
expect(localStorage.getItem('prop3')).to.eq('magenta')
})

cy.clearLocalStorage('prop1').should((ls) => {
expect(ls.getItem('prop1')).to.be.null
expect(ls.getItem('prop2')).to.eq('blue')
expect(ls.getItem('prop3')).to.eq('magenta')
// Clear key matching string in localStorage
cy.clearLocalStorage('prop1')
cy.getAllLocalStorage().should(() => {
expect(localStorage.getItem('prop1')).to.be.null
expect(localStorage.getItem('prop2')).to.eq('blue')
expect(localStorage.getItem('prop3')).to.eq('magenta')
})

// Clear keys matching regex in localStorage
cy.get('.ls-btn').click().should(() => {
cy.get('.ls-btn').click()
cy.get('.ls-btn').should(() => {
expect(localStorage.getItem('prop1')).to.eq('red')
expect(localStorage.getItem('prop2')).to.eq('blue')
expect(localStorage.getItem('prop3')).to.eq('magenta')
})

cy.clearLocalStorage(/prop1|2/).should((ls) => {
expect(ls.getItem('prop1')).to.be.null
expect(ls.getItem('prop2')).to.be.null
expect(ls.getItem('prop3')).to.eq('magenta')
// Clear keys matching regex in localStorage
cy.clearLocalStorage(/prop1|2/)
cy.getAllLocalStorage().should(() => {
expect(localStorage.getItem('prop1')).to.be.null
expect(localStorage.getItem('prop2')).to.be.null
expect(localStorage.getItem('prop3')).to.eq('magenta')
})</code></pre>
</div>
<div class="col-xs-5">
Expand Down Expand Up @@ -159,10 +164,11 @@ <h4><a href="https://on.cypress.io/clearalllocalstorage">cy.clearAllLocalStorage
<pre><code class="javascript">cy.get('.ls-btn').click()

// clearAllLocalStorage() yields null
cy.clearAllLocalStorage().should(() => {
expect(sessionStorage.getItem('prop1')).to.be.null
expect(sessionStorage.getItem('prop2')).to.be.null
expect(sessionStorage.getItem('prop3')).to.be.null
cy.clearAllLocalStorage()
cy.getAllLocalStorage().should(() => {
expect(localStorage.getItem('prop1')).to.be.null
expect(localStorage.getItem('prop2')).to.be.null
expect(localStorage.getItem('prop3')).to.be.null
})</code></pre>
</div>
<div class="col-xs-5">
Expand Down Expand Up @@ -208,7 +214,8 @@ <h4><a href="https://on.cypress.io/clearallsessionstorage">cy.clearAllSessionSto
<pre><code class="javascript">cy.get('.ls-btn').click()

// clearAllSessionStorage() yields null
cy.clearAllSessionStorage().should(() => {
cy.clearAllSessionStorage()
cy.getAllSessionStorage().should(() => {
expect(sessionStorage.getItem('prop4')).to.be.null
expect(sessionStorage.getItem('prop5')).to.be.null
expect(sessionStorage.getItem('prop6')).to.be.null
Expand Down
1 change: 0 additions & 1 deletion app/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,6 @@ <h2>Commands</h2>
<li>
<a href="/commands/misc">Misc</a>
<ul>
<li><a href="/commands/misc">end</a></li>
<li><a href="/commands/misc">exec</a></li>
<li><a href="/commands/misc">focused</a></li>
<li><a href="/commands/misc">screenshot</a></li>
Expand Down
21 changes: 11 additions & 10 deletions app/utilities.html
Original file line number Diff line number Diff line change
Expand Up @@ -88,10 +88,9 @@ <h4 id="$"><a href="https://on.cypress.io/$">Cypress.$</a></h4>
<p>To call a jQuery method, use the <a href="https://on.cypress.io/$"><code>Cypress.$</code></a> command.</p>
<pre><code class="javascript">let $li = Cypress.$('.utility-jquery li:first')

cy.wrap($li)
.should('not.have.class', 'active')
.click()
.should('have.class', 'active')</code></pre>
cy.wrap($li).should('not.have.class', 'active')
cy.wrap($li).click()
cy.wrap($li).should('have.class', 'active')</code></pre>
</div>
<div class="col-xs-5">
<div class="well">
Expand All @@ -115,21 +114,23 @@ <h4 id="$"><a href="https://on.cypress.io/$">Cypress.$</a></h4>
<div class="col-xs-7">
<h4 id="Blob"><a href="https://on.cypress.io/blob">Cypress.Blob</a></h4>
<p>To work with blobs, convert strings, and other utility functions, use the <a href="https://on.cypress.io/blob"><code>Cypress.Blob</code></a> library.</p>
<pre><code class="javascript">cy.get('.utility-blob').then(($div) =>
// https://github.com/nolanlawson/blob-util#imgSrcToDataURL
// get the dataUrl string for the javascript-logo
Cypress.Blob.imgSrcToDataURL('/assets/img/javascript-logo.png', undefined, 'anonymous')
<pre><code class="javascript">cy.get('.utility-blob').then(($div) => {
// https://github.com/nolanlawson/blob-util#imgSrcToDataURL
// get the dataUrl string for the javascript-logo
return Cypress.Blob.imgSrcToDataURL('/assets/img/javascript-logo.png', undefined, 'anonymous')
.then((dataUrl) => {
// create an <img> element and set its src to the dataUrl
let img = Cypress.$('<img />', { src: dataUrl })

// need to explicitly return cy here since we are initially returning
// the Cypress.Blob.imgSrcToDataURL promise to our test
// append the image
$div.append(img)

cy.get('.utility-blob img').click()
.should('have.attr', 'src', dataUrl)
}))</code></pre>
cy.get('.utility-blob img').should('have.attr', 'src', dataUrl)
})
})</code></pre>
</div>
<div class="col-xs-5">
<div class="well">
Expand Down
1 change: 0 additions & 1 deletion cypress/e2e/2-advanced-examples/cookies.cy.js
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,6 @@ context('Cookies', () => {

// cy.clearCookies() yields null
cy.clearCookie('token')
cy.getCookie('token').should('be.null')

cy.getCookie('token').should('be.null')
})
Expand Down
15 changes: 0 additions & 15 deletions cypress/e2e/2-advanced-examples/misc.cy.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,21 +5,6 @@ context('Misc', () => {
cy.visit('http://localhost:8080/commands/misc')
})

it('.end() - end the command chain', () => {
// https://on.cypress.io/end

// cy.end is useful when you want to end a chain of commands
// and force Cypress to re-query from the root element
cy.get('.misc-table').within(() => {
// ends the current chain and yields null
cy.contains('Cheryl').click()
//.end()
rubysolo marked this conversation as resolved.
Show resolved Hide resolved

// queries the entire table again
cy.contains('Charles').click()
})
})

it('cy.exec() - execute a system command', () => {
// execute a system command.
// so you can take actions necessary for
Expand Down
Loading