Unknown prop 'map' - warning

[peterpetre]

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

I have this warning, did you @MicheleBertoli or anyone have already dealt with this?

[MicheleBertoli]

Hello @peterpetre,
can you please share more details to reproduce the issue?
Thanks!

[peterpetre]

warning.js:36 Warning: Unknown prop `map` on <span> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in span (created by Gmaps)
    in div (created by Gmaps)
    in Gmaps (created by Sidebar)
    in div (created by Sidebar)
    in div (created by Sidebar)
    in Sidebar (created by Connect(Sidebar))
    in Connect(Sidebar) (created by Sidebar)
    in div (created by Sidebar)
    in Sidebar (created by MeteorDataContainer)
    in MeteorDataContainer (created by Connect(MeteorDataContainer))
    in Connect(MeteorDataContainer) (created by App)
    in div (created by App)
    in App (created by MeteorDataContainer)
    in MeteorDataContainer (created by Connect(MeteorDataContainer))
    in Connect(MeteorDataContainer) (created by RouterContext)
    in div (created by Root)
    in Root (created by MeteorDataContainer)
    in MeteorDataContainer (created by Connect(MeteorDataContainer))
    in Connect(MeteorDataContainer) (created by RouterContext)
    in RouterContext (created by Router)
    in Router (created by Routes)
    in Provider (created by Routes)
    in Routes

This is the whole warning, now on the link they say:

1. Are you using {...this.props} or cloneElement(element, this.props)? Your component is transferring its own props directly to a child element (eg. https://facebook.github.io/react/docs/transferring-props.html). When transferring props to a child component, you should ensure that you are not accidentally forwarding props that were intended to be interpreted by the parent component.
2. You are using a non-standard DOM attribute on a native DOM node, perhaps to represent custom data. If you are trying to attach custom data to a standard DOM element, consider using a custom data attribute as described on MDN.
3. React does not yet recognize the attribute you specified. This will likely be fixed in a future version of React. However, React currently strips all unknown attributes, so specifying them in your React app will not cause them to be rendered.

[MicheleBertoli]

Thanks @peterpetre,
I had the same error in one of the apps I'm working on but I haven't been able to reproduce it on the react-gmaps demo.
So I was more interested in details about your code or if you can just tell me the way to reproduce the issue using the library.

[peterpetre]

@MicheleBertoli ok i found out where this warning hits!!

<Gmaps
          ref="gmaps"
          width={'50%'}
          height={'500px'}
          style={styles.cols}
          lat={51.5258541}
          lng={-0.08040660000006028}
          zoom={12}
        >
          <span> TEST TEST TEST </span>
        </Gmaps>

when i have any element which is not from react-gmaps inside the Gmaps component.

[MicheleBertoli]

Oh, I see @peterpetre.
Do you really need to put a span as a child of the map?
Do you mind if I ask you the reason why you are doing that?
Thanks!

[peterpetre]

Yea sure,

I have a sidebar, with a small map with directions, and i have a button on the map to make this map fullscreen with an animation.

Now i had some displaying issues on the map being width/height 100% and do it on a parent div, so i have added the button as a child of the map.

But its a bit confusing functionality, so i will try to figure out something else. At least we found from where the warning comes from! :)

[MicheleBertoli]

Yes, thank you very much @peterpetre.
I'm thinking about a full rewriting of the Components as well as an upgrade of React and a fix for #29 in the next few months.