nfl / react-helmet

A document head manager for React
MIT License
17.33k stars 659 forks source link

`htmlAttributes` is both array and object #158

Closed catamphetamine closed 7 years ago

catamphetamine commented 8 years ago

https://github.com/nfl/react-helmet/blob/17eb00abcf71d57f51827575d37c2ae8ed9997fb/src/Helmet.js#L402


        static rewind = () => {
            let mappedState = Component.rewind();
            if (!mappedState) {
                // provide fallback if mappedState is undefined
                mappedState = mapStateOnServer({
                    htmlAttributes: [],
                    title: "",
                    baseTag: [],
                    metaTags: [],
                    linkTags: [],
                    scriptTags: [],
                    styleTags: []
                });
            }

            return mappedState;
        }

And at the same time:

        static propTypes = {
            htmlAttributes: React.PropTypes.object,
            title: React.PropTypes.string,
            defaultTitle: React.PropTypes.string,
            titleTemplate: React.PropTypes.string,
            base: React.PropTypes.object,
            meta: React.PropTypes.arrayOf(React.PropTypes.object),
            link: React.PropTypes.arrayOf(React.PropTypes.object),
            script: React.PropTypes.arrayOf(React.PropTypes.object),
            style: React.PropTypes.arrayOf(React.PropTypes.object),
            onChangeClientState: React.PropTypes.func
        }

Which means that it should be:

                // provide fallback if mappedState is undefined
                mappedState = mapStateOnServer({
                    htmlAttributes: {}, // object here
                    title: "",
                    baseTag: {}, // object here
                    metaTags: [],
                    linkTags: [],
                    scriptTags: [],
                    styleTags: []
                });

It causes a React warning:

Warning: React.createElement(...): Expected props argument of html to be a plain object

A workaround:


let html_attributes = webpage_head.htmlAttributes.toComponent()

        // Fixing `react-helmet` bug here
        // until they release the fix
        // https://github.com/nfl/react-helmet/issues/158
        if (Array.isArray(html_attributes))
        {
            // A workaround
            html_attributes = {}
                }
bartaz commented 8 years ago

Got hit by the same issue when using Helmet on server.

cwelch5 commented 7 years ago

Fixed 3.2.3