FlipMove not working in production environment

While running tests locally with FlipMove everything seems to work perfectly. Though when deploying to a production environment, Flipmove seems to break the container it’s supposed to render. The error I’m getting is:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method of ‘t’

‘t’ appears to be the parent where the child containing the FlipMove tags gets rendered in. I’ve identified this as a FlipMove issue since commenting out the tags works perfectly fine, just without animations.

The list is rendered in a parent component as:

<ListContainer messages={this.state.messages} />

ListContainer:

import FlipMove from 'react-flip-move';
import SingleMessage from './SingleMessage';`

class ListContainer extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <FlipMove duration={250} easing="ease-out">
                {this.props.messages.map(message => (
                    <SingleMessage
                        key={message.id}
                        message={message}
                    />
                ))}
            </FlipMove> 
        )      
    }
}
export default ListContainer;

React version: ^15.4.2 Flipmove ^3.0.1

An answer or some clarification on this topic would be greatly appreciated. I’ve been searching for alternatives or a way to make this work in production for quite a while now but I just can’t wrap my head around what’s going wrong here. 😅

[wa0x6e]

Not sure if related, but I am encountering an issue on production too, but not on development.

In my case, there are no error messages, everything work perfectly when adding elements to the list. But when removing element, the list does not update.

Same bug when I tried downgrading to v2

[joshwcomeau]

Ohh, yeah. React Flip Move doesn’t support functional stateless components.

Weird that it only seems to happen in production 😕 maybe we should add a development warning to catch it sooner.