chore: expand browsers component spec (#8286)

Co-authored-by: Zach Bloomquist <github@chary.us>
This commit is contained in:
Gleb Bahmutov
2020-09-11 09:49:07 -04:00
committed by GitHub
parent a6905012af
commit 17e99b0dab
5 changed files with 154 additions and 16 deletions
+14
View File
@@ -613,3 +613,17 @@ We will try to review and merge pull requests quickly. After merging we will try
### ENFILE or EMFILE
If you get `ENFILE: file table overflow`, `ENFILE: too many open files` or any other `ENFILE` or `EMFILE` errors on Mac, that means you are doing synchronous file system operations. Cypress should **NEVER** do them. Instead we should use async file system operations and let `graceful-fs` retry them. Find the place where the synchronous `fs` operation is done from the stacktrace and make it async.
### lock file
You can rebuild the lock file using the latest `develop` version in a clean isolated environment using Docker. From the current branch:
```shell
git checkout develop
git pull
git checkout -
git checkout origin/develop -- yarn.lock
# remove all unknown files
git clean -xfd
yarn
```
+8
View File
@@ -91,3 +91,11 @@ Then open Cypress with
## from repo root
yarn workspace @packages/desktop-gui cypress:open
```
### Component testing
Using [cypress-react-unit-test](https://github.com/bahmutov/cypress-react-unit-test) you can run some of the component tests in this project. You MUST run from the root of the repo using absolute path, no need to start the server.
```bash
yarn dev --project ~/git/cypress/packages/desktop-gui/
```
+1 -1
View File
@@ -26,7 +26,7 @@
"classnames": "2.2.6",
"cross-env": "6.0.3",
"cypress-multi-reporters": "1.4.0",
"cypress-react-unit-test": "4.8.0",
"cypress-react-unit-test": "4.11.2",
"fira": "cypress-io/fira#fb63362742eea8cdce0d90825ab9264d77719e3d",
"gravatar": "1.8.0",
"human-interval": "1.0.0",
@@ -1,10 +1,46 @@
import React from 'react'
import Browsers from './browsers'
import Project from '../project/project-model'
import { mount } from 'cypress-react-unit-test'
import browsers from '../../cypress/fixtures/browsers.json'
/* global cy */
describe('Browsers', () => {
/**
* Mounts the Browsers component surrounded
* by the right markup for realistic styles
*/
const mnt = (props) => {
const BrowserNav = () =>
(<nav className="project-nav navbar navbar-default">
<div className="spacer" />
<Browsers {...props} />
</nav>)
mount(<BrowserNav />, {
stylesheets: '/__root/dist/app.css',
})
}
/**
* Creates an instance of the full Project Model class
*/
const mntProjectModel = () => {
const project = new Project({})
project.setBrowsers(browsers)
mnt({ project })
}
const browserListClosed = () => {
cy.get('.browser-icon:visible').should('have.length', 1)
}
const browserListOpened = () => {
cy.get('.browser-icon:visible').should('have.length', 3)
}
it('renders list', () => {
const project = {
browsers,
@@ -12,16 +48,95 @@ describe('Browsers', () => {
otherBrowsers: browsers.slice(1),
}
mount(<Browsers project={project} />, {
stylesheets: '/__root/dist/app.css',
})
mnt({ project })
// only single browser icon visible at the start
cy.get('.browser-icon').should('have.length', 3)
cy.get('.browser-icon:visible').should('have.length', 1)
browserListClosed()
// now all the browser icons should be visible
cy.get('.dropdown-chosen').click()
cy.get('.browser-icon:visible').should('have.length', 3)
browserListOpened()
cy.log('**closing**')
cy.get('.spacer').click()
})
it('picks the browser', () => {
const project = {
browsers,
chosenBrowser: browsers[0],
otherBrowsers: browsers.slice(1),
setChosenBrowser: cy.stub().as('setChosenBrowser'),
}
mnt({ project })
// now all the browser icons should be visible
cy.get('.dropdown-chosen').click()
cy.contains('li', 'Canary 48').click()
cy.log('**Canary was picked**')
cy.get('@setChosenBrowser').should('have.been.calledWith', browsers[2])
browserListClosed()
})
it('saves the selected browser', () => {
mntProjectModel()
cy.get('.dropdown-chosen').click()
cy.contains('li', 'Canary 48').click()
const expectedBrowser = { 'name': 'chrome', 'channel': 'canary' }
cy.wrap(window.localStorage)
.invoke('getItem', 'chosenBrowser').should('equal', JSON.stringify(expectedBrowser))
})
context('previously chosen browser', () => {
it('picks the first browser if there is nothing saved', () => {
window.localStorage.clear()
mntProjectModel()
cy.contains('li', 'Chrome 50').should('be.visible')
})
it('finds chrome browser by name and channel', () => {
const savedBrowser = { 'name': 'chrome', 'channel': 'canary' }
window.localStorage.setItem('chosenBrowser', JSON.stringify(savedBrowser))
mntProjectModel()
// we go to that browser
cy.contains('li', 'Canary 48').should('be.visible')
})
it('picks stable browser if channel is missing', () => {
const savedBrowser = { 'name': 'chrome' }
window.localStorage.setItem('chosenBrowser', JSON.stringify(savedBrowser))
mntProjectModel()
// we go to stable channel
cy.contains('li', 'Chrome 50').should('be.visible')
})
it('finds chrome browser by name (old way)', () => {
// if an old version of Cypress saved the browser name only
window.localStorage.setItem('chosenBrowser', 'chrome')
mntProjectModel()
// we go to that browser
cy.contains('li', 'Chrome 50').should('be.visible')
})
it('finds chromium browser by name (old way)', () => {
// if an old version of Cypress saved the browser name only
window.localStorage.setItem('chosenBrowser', 'chromium')
mntProjectModel()
// we go to that browser
cy.contains('li', 'Chromium 49').should('be.visible')
})
it('sets default browser if cannot find', () => {
window.localStorage.setItem('chosenBrowser', 'no-no-no')
mntProjectModel()
cy.contains('li', 'Chrome 50').should('be.visible')
})
})
})
+11 -10
View File
@@ -1955,14 +1955,14 @@
tsconfig-paths-webpack-plugin "^3.3.0"
webpack "^4.44.1"
"@cypress/webpack-preprocessor@5.4.1":
version "5.4.1"
resolved "https://registry.yarnpkg.com/@cypress/webpack-preprocessor/-/webpack-preprocessor-5.4.1.tgz#eb58f6cd02932a95653c1a674cfd769da2409806"
integrity sha512-1E2BdVVXQ4wDQ7f3mXCvS9xmfTVwEoT3oqKhjAr1iNlTJpBq10Z0VNBZd3VZ3nmCTFwTuUvs735QGnRE1gQ1BA==
"@cypress/webpack-preprocessor@5.4.2":
version "5.4.2"
resolved "https://registry.yarnpkg.com/@cypress/webpack-preprocessor/-/webpack-preprocessor-5.4.2.tgz#d40fed6375b09dd16b266a045f4577e9c7a0299a"
integrity sha512-ffydnj6mTVm83qc1p63dE2qxRkiIQNXxiHp2xyuVelwmksX+l0VSBxawYd/9Z99rInmqa583yUDPKk8IkCtmDg==
dependencies:
bluebird "3.7.1"
debug "4.1.1"
lodash "4.17.15"
lodash "4.17.19"
"@cypress/webpack-preprocessor@5.4.4":
version "5.4.4"
@@ -9743,18 +9743,19 @@ cypress-multi-reporters@1.4.0:
debug "^4.1.1"
lodash "^4.17.15"
cypress-react-unit-test@4.8.0:
version "4.8.0"
resolved "https://registry.yarnpkg.com/cypress-react-unit-test/-/cypress-react-unit-test-4.8.0.tgz#d05a294dff23977ed6a76f6ca67f6551755eefe4"
integrity sha512-PqsX238ic0wO43Jp8zrJ/B6WJcgoB5okld8WR0HZiVatOCyIWj78X1Bzd4A/LNbU8yAYQHnc6+Pf7PlW4QzBIw==
cypress-react-unit-test@4.11.2:
version "4.11.2"
resolved "https://registry.yarnpkg.com/cypress-react-unit-test/-/cypress-react-unit-test-4.11.2.tgz#2034baa1ee186a33219c0e1ca6730df0462f143b"
integrity sha512-73GhdPywzfEUv1hDRws8z5KUtx3a0T3cP0LZ6Gb7UIfMbxx3QRityKBgeNK/Pehq5diIRmR5QAl4nI5/oHsqOA==
dependencies:
"@babel/plugin-transform-modules-commonjs" "7.10.1"
"@cypress/code-coverage" "3.8.1"
"@cypress/webpack-preprocessor" "5.4.1"
"@cypress/webpack-preprocessor" "5.4.2"
babel-plugin-istanbul "6.0.0"
debug "4.1.1"
find-webpack "2.0.0"
mime-types "2.1.26"
unfetch "4.1.0"
d@1, d@^1.0.1:
version "1.0.1"