Unknown prop warnings - React 15.2.0

[Moeface]

Since React 15.2.0, warnings have been added when unknown/invalid props are passed to regular DOM elements. React-bootstrap and many other libraries have had to modify the way props are passed in their modules. Relevant discussion is contained in this issue: react-bootstrap/react-bootstrap#1994

velocity-react is having the same issues, as I'm receiving the following warnings:

Warning: Unknown prop 'duration' on <span> tag. Remove this prop from the element.

Thanks for the great module, it's been working a treat otherwise!

[luisherranz]

I'm having the same error here with React 15.3.0.

[tonybaroneee]

Thanks for calling this out, working on a PR to fix this now!

[fionawhim]

@tonybaroneee FF to send to me. I've been on vacation but I need to get back to maintaining this project.

[tonybaroneee]

Sure thing, good to know. Hope you're enjoying yourself!

[tonybaroneee]

@Moeface @luisherranz Can you clarify which component you were seeing this on? VelocityComponent or VelocityTransitionGroup?

[Moeface]

This was in VelocityComponent

[tonybaroneee]

@finneganh Any thoughts on this? I don't see any property spreading happening in velocity-component and can't reproduce in our demo environment. I did find and fix some issues with our demo components, however (see #118).

[luisherranz]

This is the warning I am getting:

vendors.dashboard.9af5f91….js:34797 Warning: Unknown prop `duration` on <span> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in span (created by ReactTransitionGroup)
    in ReactTransitionGroup (created by VelocityTransitionGroup)

Curious thing is that I have updated the project to React 15.3.0 and that should fix the ReactTransitionGroup span problem, but it doesn't.

Is VelocityTransitionGroup using its own ReactTransitionGroup or does it get it from React (peer dependency)?

[tonybaroneee]

It's using "react-addons-transition-group": "^0.14.0 || ^15.0.0", as a strict dependency. Could you double check your installed version of react-addons-transition-group by cat'ing out the node_modules/react-addons-transition-group/package.json version?

[luisherranz]

This is the code on my index.js of react-addons-transition-group:

module.exports = require('react/lib/ReactTransitionGroup');

Shouldn't that use the react version of my project, which is in fact 15.3.0, which should solve the span warning?

package.json version is 15.1.0 but does that really matter when the index.js is only that?

[tonybaroneee]

Ah right, I don't believe it matters since the actual logic is just embedded within React.

[luisherranz]

Maybe this is a bug in ReactTransitionGroup itself. Can you reproduce it?

[tonybaroneee]

Ah, so neither VelocityTransitionGroup nor ReactTransitionGroup has any conception of a "duration" that I know of (you can find the valid props here). So, you can simple remove that property or incorporate it into your enter/leave props.

As for VelocityComponent, I can't reproduce the warning with a duration prop placed on it.

[luisherranz]

Shit, you are right, that was my fault. I'm sorry.

It looks like while I was searching I read this issue:
facebook/react#7163

Warning: Unknown prop `transitionAppearTimeout` on <span> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in span (created by ReactTransitionGroup)

which was a real bug and I assumed this was a bug as well.

Anyway, thanks for the help!

[tonybaroneee]

No worries, glad you have it figured out!