Passing undefined to css prop breaks composition, no EmotionCssPropInternal inserted

[coreyward]

Current behavior:

When undefined is provided as the value for a css prop, Emotion does not insert the EmotionCssPropInternal or the Context.Consumer or provide a className prop, but instead passes along css as a prop.

I suspect that internally Emotion is checking for css being defined on props rather than checking props.hasOwnProperty("css") or similar.

To reproduce:

Here's a reproduction/example in CodeSandbox

Pertinent information:

1. On a component (Component A), the css prop is passed undefined.

<ComponentA css={undefined} />

2. On a child of Component A (Component B), props are expanded and the css prop is set.

const ComponentB = props => 
  <div css={{ color: "red" }} {...props} />

Expected behavior: The div element should receive a className prop with the color: red styles, but because props contains a css property, the css declaration is overwritten.

Environment information:

• react version: 16.8.x–16.10.0
• emotion version: 10.0.17

[Andarist]

Fix is ready - #1530 . Just need to wait for @mitchellhamilton approval.