Warning: Expected server HTML to contain a matching <a> in <div>

Recently, i noticed the following warning in chromes javascript console while working on a React app with server side rendering (SSR). This led to a UI malfunction (mind bending ui screw up).

Warning: Expected server HTML to contain a matching <a> in <div>

This sent me into an instant ‘mind thonk’, a phenomenon that was discovered at that very instant. It was especially frustrating because this was the first time i used node as the ssr backend instead of golang. I calmed down after a few mins, did a google search and found out that the last react release forces you to actually fix your broken code. In order words, my code was broken and i needed to fix it.

So, when this happens try to take a look at what you recently changed