diff --git a/src/modules/Image/ImageStylePropTypes.js b/src/modules/Image/ImageStylePropTypes.js
index 55bb645a..0d8b3cd5 100644
--- a/src/modules/Image/ImageStylePropTypes.js
+++ b/src/modules/Image/ImageStylePropTypes.js
@@ -10,7 +10,7 @@ export default {
transform: PropTypes.string
}
-export const ImageDefaultStyles = {
+export const ImageDefaultStyle = {
backgroundColor: 'lightGray',
borderWidth: 0,
maxWidth: '100%'
diff --git a/src/modules/Image/index.js b/src/modules/Image/index.js
index a1dd832c..e6b0288e 100644
--- a/src/modules/Image/index.js
+++ b/src/modules/Image/index.js
@@ -1,35 +1,34 @@
import { pickProps } from '../filterObjectProps'
import { WebStyleComponent } from '../react-native-web-style'
-import ImageStylePropTypes, { ImageDefaultStyles } from './ImageStylePropTypes'
+import ImageStylePropTypes, { ImageDefaultStyle } from './ImageStylePropTypes'
import React, { PropTypes } from 'react'
class Image extends React.Component {
static propTypes = {
- alt: PropTypes.string,
- async: PropTypes.bool,
+ accessibilityLabel: PropTypes.string,
className: PropTypes.string,
- src: PropTypes.string,
+ source: PropTypes.string,
style: PropTypes.shape(ImageStylePropTypes)
}
static defaultProps = {
- async: true,
className: '',
- src: 'data:image/gif;base64,' +
+ source: 'data:image/gif;base64,' +
'R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
}
render() {
- const { alt, className, src, style, ...other } = this.props
+ const { accessibilityLabel, className, source, style, ...other } = this.props
const filteredStyle = pickProps(style, Object.keys(ImageStylePropTypes))
- const mergedStyle = { ...ImageDefaultStyles, ...filteredStyle }
+ const mergedStyle = { ...ImageDefaultStyle, ...filteredStyle }
return (
)
diff --git a/src/modules/Image/index.spec.js b/src/modules/Image/index.spec.js
new file mode 100644
index 00000000..dfeec773
--- /dev/null
+++ b/src/modules/Image/index.spec.js
@@ -0,0 +1,64 @@
+import assert from 'assert'
+import React from 'react/addons'
+
+import { ImageDefaultStyle } from './ImageStylePropTypes'
+import Image from '.'
+
+const ReactTestUtils = React.addons.TestUtils
+
+function shallowRender(component, context = {}) {
+ const shallowRenderer = React.addons.TestUtils.createRenderer()
+ shallowRenderer.render(component, context)
+ return shallowRenderer.getRenderOutput()
+}
+
+suite('Image', () => {
+ test('defaults', () => {
+ const result = ReactTestUtils.renderIntoDocument()
+ const root = React.findDOMNode(result)
+
+ assert.equal((root.tagName).toLowerCase(), 'img')
+ })
+
+ test('prop "accessibilityLabel"', () => {
+ const label = 'accessibilityLabel'
+ const result = ReactTestUtils.renderIntoDocument()
+ const root = React.findDOMNode(result)
+
+ assert.equal(root.getAttribute('alt'), label)
+ })
+
+ test('prop "className"', () => {
+ const className = 'className'
+ const result = shallowRender()
+
+ assert.ok(
+ (result.props.className).indexOf(className) > -1,
+ '"className" was not transferred'
+ )
+ })
+
+ test('prop "source"', () => {
+ const source = 'path-to-image'
+ const result = ReactTestUtils.renderIntoDocument()
+ const root = React.findDOMNode(result)
+
+ assert.equal(root.getAttribute('src'), source)
+ })
+
+ test('prop "style"', () => {
+ const initial = shallowRender()
+ assert.deepEqual(
+ initial.props.style,
+ ImageDefaultStyle,
+ 'default "style" is incorrect'
+ )
+
+ const unsupported = shallowRender()
+ assert.deepEqual(
+ unsupported.props.style.unsupported,
+ null,
+ 'unsupported "style" properties must not be transferred'
+ )
+ })
+})