I have an IonSplitPane that contains a menu and its pane. Most of the time this works fine, but sometimes when I load the page I get a blank screen. When this happens, the things inside the split pane are rendered into the DOM, but they aren’t showing up. The only difference I can see in the DOM is the presence of the
sc-ion-md-s classes on it when it is broken but not when it works. This doesn’t work:
<ion-split-pane content-id="main" class="AdminRouter_splitPane__2jlCl sc-ion-split-pane-md-h md split-pane-md split-pane-visible sc-ion-split-pane-md-s hydrated">
But this does:
<ion-split-pane content-id="main" class="AdminRouter_splitPane__2jlCl md split-pane-md split-pane-visible hydrated">
I would really love to just figure out why those classes are there, but I’m pretty stumped by what’s going on in the code. Why would they be there sometimes but not always? What do they represent?
FWIW I can pretty readily reproduce this by clearing my browser cache and loading the page. It will generally be blank after that, but on a subsequent reload it works fine.