Skip to content

Commit

Permalink
return opacity: 1 if server rendered, fixes #4
Browse files Browse the repository at this point in the history
  • Loading branch information
zackify committed Apr 13, 2016
1 parent 4bbc9b1 commit fd076c6
Show file tree
Hide file tree
Showing 4 changed files with 10 additions and 3 deletions.
2 changes: 1 addition & 1 deletion lib/image.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ var Image = function (_React$Component) {
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Image).call(this));

var opacity = 0;
if (!src.match(/http/)) opacity = 1;
if (!src.match(/http/) || typeof window === 'undefined') opacity = 1;

_this.state = { opacity: opacity };
return _this;
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "legit-image",
"version": "0.1.2",
"version": "0.1.3",
"description": "an img tag, with built in lazy loading",
"main": "lib/image.js",
"scripts": {
Expand Down
2 changes: 1 addition & 1 deletion src/image.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ export default class Image extends React.Component {
constructor({ src }){
super()
let opacity = 0
if(!src.match(/http/)) opacity = 1
if(!src.match(/http/) || typeof window === 'undefined') opacity = 1

this.state = { opacity }
}
Expand Down
7 changes: 7 additions & 0 deletions tests/image.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,17 @@ import Image from '../src/image'

describe('Image', () => {
it('renders with opacity: 0', () => {
global.window = {}
const wrapper = shallow(<Image src="http://google.com" />)
expect(wrapper.props().style.opacity).to.equal(0)
})

it('renders with opacity: 1 on server', () => {
global.window = undefined
const wrapper = shallow(<Image src="http://google.com" />)
expect(wrapper.props().style.opacity).to.equal(1)
})

it('changes opacity on state change', () => {
const wrapper = shallow(<Image src="http://google.com" />)
wrapper.setState({ opacity: 1 })
Expand Down

0 comments on commit fd076c6

Please sign in to comment.