Search code examples
google-app-maker

Console preview panel - how to reset size?


So the console preview panel at the bottom of the page remembers how big you had it last time you previewed. Usually this is great! But somehow mine is currently maximized, so the only thing that shows up is the Page dropdown at the top of the page (and anything in the console, if I switch between pages and the pages have things that log on load). The rest is just white console. Any idea how to get back the default view where the console is 20% of the bottom of the page? There is no visible dragging bar frame thing anywhere.

I can change my preview to console=0 to be able to use it, but I'd like a way to restore the default position of the panel.


Solution

  • Normally you should be able to hover on the top border of the console panel and resize it as you wish. An icon will appear, similar as in the image below:

    enter image description here

    Nonetheless, if you are doing your previews on a mobile device such as a tablet, then such thing is not possible to do. Therefore; a hacky way to do it would be to put the following code on the onAttach event handler of the page that is loading:

    var splitPanel = widget.root.getElement().parentElement
      .parentElement.parentElement.parentElement
      .parentElement.parentElement.children[0].children[3];
    splitPanel.style.height = "75px";
    

    Nota bene: this is intended to ONLY work in preview