After update to 0.4.8 shapshot testing fails

[AntonovAv]

after update to new version 0.4.8 test fails

component code

import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import messages from '../messages'
import { FormattedMessage } from 'react-intl'
import styles from './AddCompany.css'
import plusCompany from 'images/switcher/plus-company.svg'
import { Motion, spring } from 'react-motion'
import cx from 'classnames'

export class AddCompany extends PureComponent {

  constructor(props) {
    super(props)

    this.state = {
      isExpanded: false,
      expandInProgress: false,
      maxHeight: 20
    }
  }

  onPlusClickHandler = () => {
    this.setState({
      isExpanded: true,
      expandInProgress: true,
      maxHeight: 50
    })
  }

  onTransitionEnd = () => {
    this.setState({
      expandInProgress: false
    })
  }

  handleOnAddCompanyClick = () => {
    if (!this.props.disabled) {
      this.props.onAddCompanyAction()
    }
  }

  render() {
    const containerClass = cx(
      styles.container,
      {[styles.expanded]: this.state.isExpanded}
    )
    const linkClass = cx(
      styles.link,
      {[styles.disabled]: this.props.disabled}
    )
    return (
      <Motion
        defaultStyle={{
          h: 20
        }}
        style={{
          h: spring(this.state.maxHeight, {
            stiffness: 800,
            damping: 40,
            precision: 0.5
          })
        }}
        onRest={this.onTransitionEnd}
      >
        {({h}) =>
          <div className={containerClass} style={{maxHeight: h + 'px'}}>
            {
              this.state.isExpanded ? (
                <div className={linkClass} onClick={this.handleOnAddCompanyClick}>
                  <FormattedMessage {...messages.connectToAnotherQb}/>
                </div>
              ) : (
                <div className={styles.plus} onClick={this.onPlusClickHandler}>
                  <img src={plusCompany}/>
                </div>
              )}
          </div>
        }
      </Motion>
    )
  }
}

AddCompany.propTypes = {
  onAddCompanyAction: PropTypes.func.isRequired,
  disabled: PropTypes.bool
}

export default AddCompany

test code

import { mount } from 'enzyme'
import toJson from 'enzyme-to-json'
...
it('component rendering', () => {
    const component = mount(<AddCompany onAddCompanyAction={jest.fn()}/>)
    expect(toJson(component)).toMatchSnapshot()
  })

package.json

 "react": "15.4.1",
"react-motion": "^0.4.7",
"jest": "^19.0.2",
"enzyme": "^2.7.1",
"enzyme-to-json": "^1.1.3",

[sompylasar]

Any news what's broken? Is it safe to upgrade?
v0.4.7...v0.4.8

[nkbt]

Known problem of babel not adding displayName automatically

babel/babel#5554

[nkbt]

@sompylasar the only issue is that there is no displayName. All the changes are here: https://github.com/chenglou/react-motion/releases/tag/v0.4.8

[nkbt]

There are some options:

1. We need to update react-motion to set displayName ourselves
2. Wait for babel to be updated (+1 on PR, etc)
3. Not rely on component name in a component tree in our tests (good option anyway). I don't think it was ever considered to be a public API to rely on...

[sompylasar]

@nkbt Thanks for detailed explanation! Upgraded.

[nkbt]

Should be fixed by #455 (just merged)

Need to publish new version but if anyone can try master meanwhile - that would be very helpful