Skip to content
This repository was archived by the owner on Mar 5, 2022. It is now read-only.

Commit 85540db

Browse files
bahmutovbahmutov
committed
working react component mount
1 parent de6e157 commit 85540db

File tree

9 files changed

+107
-3
lines changed

9 files changed

+107
-3
lines changed

‎cypress.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"viewportWidth": 300,
3+
"viewportHeight": 200
4+
}

‎cypress/fixtures/example.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"name": "Using fixtures to represent data",
3+
"email": "hello@cypress.io",
4+
"body": "Fixtures are a great way to mock data for responses to routes"
5+
}

‎cypress/integration/hello-world-spec.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { HelloWorld } from '../../src/hello-world.jsx'
2+
import React from 'react'
3+
import { mount } from '../../lib'
4+
5+
/* eslint-env mocha */
6+
describe('HelloWorld component', () => {
7+
it('works', () => {
8+
mount(<HelloWorld />)
9+
cy.contains('Hello World!')
10+
})
11+
})

‎cypress/plugins/index.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// ***********************************************************
2+
// This example plugins/index.js can be used to load plugins
3+
//
4+
// You can change the location of this file or turn off loading
5+
// the plugins file with the 'pluginsFile' configuration option.
6+
//
7+
// You can read more here:
8+
// https://on.cypress.io/plugins-guide
9+
// ***********************************************************
10+
11+
// This function is called when a project is opened or re-opened (e.g. due to
12+
// the project's config changing)
13+
14+
module.exports = (on, config) => {
15+
// `on` is used to hook into various events Cypress emits
16+
// `config` is the resolved Cypress config
17+
}

‎cypress/support/commands.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// ***********************************************
2+
// This example commands.js shows you how to
3+
// create various custom commands and overwrite
4+
// existing commands.
5+
//
6+
// For more comprehensive examples of custom
7+
// commands please read more here:
8+
// https://on.cypress.io/custom-commands
9+
// ***********************************************
10+
//
11+
//
12+
// -- This is a parent command --
13+
// Cypress.Commands.add("login", (email, password) => { ... })
14+
//
15+
//
16+
// -- This is a child command --
17+
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
18+
//
19+
//
20+
// -- This is a dual command --
21+
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
22+
//
23+
//
24+
// -- This is will overwrite an existing command --
25+
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

‎cypress/support/index.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// ***********************************************************
2+
// This example support/index.js is processed and
3+
// loaded automatically before your test files.
4+
//
5+
// This is a great place to put global configuration and
6+
// behavior that modifies Cypress.
7+
//
8+
// You can change the location of this file or turn off
9+
// automatically serving support files with the
10+
// 'supportFile' configuration option.
11+
//
12+
// You can read more here:
13+
// https://on.cypress.io/configuration
14+
// ***********************************************************
15+
16+
// Import commands.js using ES2015 syntax:
17+
import './commands'
18+
19+
// Alternatively you can use CommonJS syntax:
20+
// require('./commands')

‎lib/index.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { render } from 'react-dom'
2+
3+
/* eslint-env mocha */
4+
export const mount = jsx => {
5+
const html = '<body><div id="app"></div></body>'
6+
7+
const document = cy.state('document')
8+
document.write(html)
9+
document.close()
10+
11+
render(jsx, document.getElementById('app'))
12+
}

‎package.json‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,32 @@
22
"name": "cypress-react-unit-test",
33
"version": "1.0.0",
44
"description": "",
5-
"main": "index.js",
5+
"main": "lib",
66
"scripts": {
77
"test": "echo \"Error: no test specified\" && exit 1",
8-
"build": "webpack -d"
8+
"build": "webpack -d",
9+
"cy:open": "cypress open"
910
},
1011
"keywords": [],
1112
"author": "",
1213
"license": "ISC",
1314
"devDependencies": {
15+
"@cypress/webpack-preprocessor": "^1.1.2",
1416
"babel-core": "^6.26.0",
1517
"babel-loader": "^7.1.2",
1618
"babel-preset-es2015": "^6.24.1",
1719
"babel-preset-react": "^6.24.1",
20+
"cypress": "^1.4.1",
1821
"react": "^16.2.0",
1922
"react-dom": "^16.2.0",
2023
"standard": "^10.0.3",
2124
"webpack": "^3.10.0"
25+
},
26+
"standard": {
27+
"globals": [
28+
"Cypress",
29+
"cy",
30+
"expect"
31+
]
2232
}
2333
}

‎src/hello-world.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,6 @@ import React from 'react'
22

33
export class HelloWorld extends React.Component {
44
render () {
5-
return <p> Hello React!</p>
5+
return <p>Hello World!</p>
66
}
77
}

0 commit comments

Comments
 (0)