(react-a11y) Error message

[kalken]

In firefox developer edition i get this when browsing localhost:8000

Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
(client) morphic-starterkit" id="a11y-3" data-rea
(server) morphic-starterkit" data-reactid=".k4ckr warning.js:48:7
Server-side React render was discarded. Make sure that your initial render does not contain any client-side code.

I have not made any changes just cloned git...

/K

[luandro]

Chrome console outputs the same warnings and errors.

[brysgo]

I was able to fix this by moving the a11y code to the bottom of client.js.

Haven't had enough time to confirm that all the features of a11y still work. I can say that I am getting some a11y console messages, so it is promising.

However, the error doesn't fully go away. For instance I have markup with an apostrophe:

(client) bovugw.0.1">Here you're sure to fin
(server) bovugw.0.1">Here you're sure to find! a 

[goldensunliu]

This is actually a red herring. The difference between of server-side and client-side markup is somewhere else. It is actually a pain to find out and this red herring of the wrong difference is also not helping. will follow up with a reference to a similar issue.

[RickWong]

I'm going to remove react-a11y because the lack of development interest & some of the open issues are pretty severe. Here's the list: https://github.com/rackt/react-a11y/issues

reactjs/react-a11y#77
reactjs/react-a11y#78
reactjs/react-a11y#79 (React 0.14)

I guess if you want to use react-a11y you can add it to your projects manually.