zoriya/react-native-web
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-web.git synced 2026-05-26 15:58:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Spec helpers

Browse Source
This commit is contained in:
Nicolas Gallagher
2015-09-07 23:37:36 -07:00
parent 2750d70a93
commit 7eff1a644e
7 changed files with 117 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Image/index.spec.js
+9 -42
View File
@@ -1,3 +1,4 @@
import { assertProps, render, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -6,21 +7,6 @@ import View from '../View'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
function render(component, node) {
return node ? React.render(component, node) : ReactTestUtils.renderIntoDocument(component)
}
function getImageDOM(props) {
const result = ReactTestUtils.renderIntoDocument(<Image {...props} />)
return React.findDOMNode(result)
}
suite('Image', () => {
test('defaults', () => {
const result = shallowRender(<Image />)
@@ -28,21 +14,19 @@ suite('Image', () => {
})
test('prop "accessibilityLabel"', () => {
const accessibilityLabel = 'accessibilityLabel'
const element = getImageDOM()
const elementHasLabel = getImageDOM({ accessibilityLabel })
assertProps.accessibilityLabel(Image)
})
assert.equal(element.getAttribute('aria-label'), null)
assert.equal(elementHasLabel.getAttribute('aria-label'), accessibilityLabel)
test('prop "accessible"', () => {
assertProps.accessible(Image)
})
test.skip('prop "children"', () => { })
test('prop "defaultSource"', () => {
const defaultSource = { uri: 'https://google.com/favicon.ico' }
const elementHasdefaultSource = getImageDOM({ defaultSource })
const backgroundImage = elementHasdefaultSource.style.backgroundImage
const dom = renderToDOM(<Image defaultSource={defaultSource} />)
const backgroundImage = dom.style.backgroundImage
assert(backgroundImage.indexOf(defaultSource.uri) > -1)
})
@@ -83,27 +67,10 @@ suite('Image', () => {
test.skip('prop "source"', () => { })
test('prop "style"', () => {
const initial = shallowRender(<Image />)
assert.deepEqual(
initial.props.style,
Image.defaultProps.style
)
const unsupported = shallowRender(<Image style={{ unsupported: 'true' }} />)
assert.deepEqual(
unsupported.props.style.unsupported,
null,
'unsupported "style" properties must not be transferred'
)
assertProps.style(Image)
})
test('prop "testID"', () => {
const testID = 'Example.image'
const elementHasTestID = getImageDOM({ testID })
assert.equal(
elementHasTestID.getAttribute('data-testid'),
testID
)
assertProps.testID(Image)
})
})
src/components/ScrollView/index.spec.js
+1 -6
View File
@@ -1,4 +1,5 @@
/*
import { assertProps, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -6,12 +7,6 @@ import ScrollView from '.'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite.skip('ScrollView', () => {
test('prop "children"', () => {})
})
src/components/Text/index.spec.js
+6 -45
View File
@@ -1,3 +1,4 @@
import { assertProps, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -5,20 +6,7 @@ import Text from '.'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite('Text', () => {
test('defaults', () => {
const result = ReactTestUtils.renderIntoDocument(<Text />)
const root = React.findDOMNode(result)
assert.equal((root.tagName).toLowerCase(), 'span')
})
test('prop "children"', () => {
const children = 'children'
const result = shallowRender(<Text>{children}</Text>)
@@ -27,23 +15,14 @@ suite('Text', () => {
})
test('prop "component"', () => {
const type = 'a'
const result = ReactTestUtils.renderIntoDocument(<Text component={type} />)
const root = React.findDOMNode(result)
assert.equal(
(root.tagName).toLowerCase(),
type,
'"component" did not produce the correct DOM node type'
)
assertProps.component(Text, 'span')
})
test.skip('prop "numberOfLines"', () => {})
test('prop "onPress"', (done) => {
const result = ReactTestUtils.renderIntoDocument(<Text onPress={onPress} />)
const root = React.findDOMNode(result)
ReactTestUtils.Simulate.click(root)
const dom = renderToDOM(<Text onPress={onPress} />)
ReactTestUtils.Simulate.click(dom)
function onPress(e) {
assert(true, 'the "onPress" callback was never called')
@@ -53,28 +32,10 @@ suite('Text', () => {
})
test('prop "style"', () => {
const initial = shallowRender(<Text />)
assert.deepEqual(
initial.props.style,
Text.defaultProps.style
)
const unsupported = shallowRender(<Text style={{ flexDirection: 'row' }} />)
assert.deepEqual(
unsupported.props.style.flexDirection,
null,
'unsupported "style" properties must not be transferred'
)
assertProps.style(Text)
})
test('prop "testID"', () => {
const testID = 'Example.text'
const result = ReactTestUtils.renderIntoDocument(<Text testID={testID} />)
const root = React.findDOMNode(result)
assert.equal(
root.getAttribute('data-testid'),
testID
)
assertProps.testID(Text)
})
})
src/components/TextInput/index.spec.js
+1 -6
View File
@@ -1,4 +1,5 @@
/*
import { assertProps, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -6,12 +7,6 @@ import TextInput from '.'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite.skip('TextInput', () => {
test('prop "children"', () => {})
})
src/components/Touchable/index.spec.js
+1 -6
View File
@@ -1,4 +1,5 @@
/*
import { assertProps, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -6,12 +7,6 @@ import Touchable from '.'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite.skip('Touchable', () => {
test('prop "children"', () => {})
})
src/components/View/index.spec.js
+9 -52
View File
@@ -1,3 +1,4 @@
import { assertProps, render, renderToDOM, shallowRender } from '../../modules/specHelpers'
import assert from 'assert'
import React from 'react/addons'
@@ -5,79 +6,35 @@ import View from '.'
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite('View', () => {
test('defaults', () => {
const result = ReactTestUtils.renderIntoDocument(<View />)
const root = React.findDOMNode(result)
assert.equal((root.tagName).toLowerCase(), 'div')
test('prop "accessibilityLabel"', () => {
assertProps.accessibilityLabel(View)
})
test('prop "accessibilityLabel"', () => {
const accessibilityLabel = 'accessibilityLabel'
const result = ReactTestUtils.renderIntoDocument(<View accessibilityLabel={accessibilityLabel} />)
const root = React.findDOMNode(result)
assert.equal(root.getAttribute('aria-label'), accessibilityLabel)
test('prop "accessible"', () => {
assertProps.accessible(View)
})
test('prop "children"', () => {
const children = 'children'
const result = shallowRender(<View>{children}</View>)
assert.equal(result.props.children, children)
})
test('prop "component"', () => {
const type = 'a'
const result = ReactTestUtils.renderIntoDocument(<View component={type} />)
const root = React.findDOMNode(result)
assert.equal(
(root.tagName).toLowerCase(),
type,
'"component" did not produce the correct DOM node type'
)
assertProps.component(View, 'div')
})
test('prop "pointerEvents"', () => {
const result = shallowRender(<View pointerEvents='box-only' />)
assert.equal(
result.props.style.pointerEvents,
'box-only'
)
assert.equal(result.props.style.pointerEvents, 'box-only')
})
test('prop "style"', () => {
const initial = shallowRender(<View />)
assert.deepEqual(
initial.props.style,
View.defaultProps.style
)
const unsupported = shallowRender(<View style={{ unsupported: 'true' }} />)
assert.deepEqual(
unsupported.props.style.unsupported,
null,
'unsupported "style" properties must not be transferred'
)
assertProps.style(View)
})
test('prop "testID"', () => {
const testID = 'Example.view'
const result = ReactTestUtils.renderIntoDocument(<View testID={testID} />)
const root = React.findDOMNode(result)
assert.equal(
root.getAttribute('data-testid'),
testID
)
assertProps.testID(View)
})
})
src/modules/specHelpers/index.js
+90
View File
@@ -0,0 +1,90 @@
import assert from 'assert'
import React from 'react/addons'
const ReactTestUtils = React.addons.TestUtils
export const assertProps = {
accessibilityLabel: function (Component) {
// no label
let dom = renderToDOM(<Component />)
assert.equal(dom.getAttribute('aria-label'), null)
// with label
const accessibilityLabel = 'accessibilityLabel'
dom = renderToDOM(<Component accessibilityLabel={accessibilityLabel} />)
assert.equal(dom.getAttribute('aria-label'), accessibilityLabel)
},
accessible: function (Component) {
// accessible
let dom = renderToDOM(<Component accessible={true} />)
assert.equal(dom.getAttribute('aria-hidden'), null)
// not accessible
dom = renderToDOM(<Component accessible={false} />)
assert.equal(dom.getAttribute('aria-hidden'), 'true')
},
component: function (Component, defaultType) {
let dom, tagName
const type = 'a'
// no type (check default)
dom = renderToDOM(<Component />)
tagName = (dom.tagName).toLowerCase()
assert.equal(tagName, defaultType)
// with type
dom = renderToDOM(<Component component={type} />)
tagName = (dom.tagName).toLowerCase()
assert.equal(tagName, type)
},
style: function (Component) {
let shallow
// default styles
shallow = shallowRender(<Component />)
assert.deepEqual(
shallow.props.style,
Component.defaultProps.style
)
// filtering of unsupported styles
const styleToFilter = { unsupported: 'unsupported' }
shallow = shallowRender(<Component style={styleToFilter} />)
assert.deepEqual(
shallow.props.style.unsupported,
null,
'unsupported "style" properties must not be transferred'
)
// merging of custom styles
const styleToMerge = { margin: '10' }
shallow = shallowRender(<Component style={styleToMerge} />)
assert.deepEqual(
shallow.props.style.margin,
styleToMerge.margin,
)
},
testID: function (Component) {
// no testID
let dom = renderToDOM(<Component />)
assert.equal(dom.getAttribute('data-testid'), null)
// with testID
const testID = 'Example.testID'
dom = renderToDOM(<Component testID={testID} />)
assert.equal(dom.getAttribute('data-testid'), testID)
}
}
export function render(element, container) {
return container ?
React.render(element, container) :
ReactTestUtils.renderIntoDocument(element)
}
export function renderToDOM(element, container) {
const result = render(element, container)
return React.findDOMNode(result)
}
export function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}