Fix rendering of snacks on route update on mobile (#3463)

* Fix rendering of snacks on mobile

Switching pages on mobile currently causes a blank snack example to show.

This is root caused to a workaround on the `onRouteUpdate` to read the DOM after mutation, which seems to work on desktop, but not on the mobile version of the site. This change moves to a newer lifecycle method called after the document is rendered to the DOM, which fixes the issue.

* Update console.log

website/snackPlayerInitializer.js

@@ -73,15 +73,11 @@ export default (() => {
   setupThemeSynchronization();
 
   return {
-    onRouteUpdate({location}) {
-      // console.log('onRouteUpdate', {location});
+    onRouteDidUpdate({location}) {
+      // console.log('onRouteDidUpdate', {location});
 
-      // TODO temporary, because onRouteUpdate fires before the new route renders...
-      // see https://github.com/facebook/docusaurus/issues/3399#issuecomment-704401189
-      setTimeout(() => {
-        initSnackPlayers();
-        setupTabPanelsMutationObservers();
-      }, 0);
+      initSnackPlayers();
+      setupTabPanelsMutationObservers();
     },
   };
 })();