Can't resize console?

[sancarn]

I have a small laptop which means that the console doesn't actually fit on the page given it's current format. Only way to see stuff is by zooming out but then text becomes too small to see anything.

[Zlatkovsky]

@sancarn , thanks for the feedback. Yes, the console resizing (which was available in the 2017 version of Script Lab) is something we already got a feedback on, and definitely want to bring back soon.

One possibility is to use https://www.npmjs.com/package/react-split-pane. We need to figure out how to do keyboard accessibility for it, however.

In the meantime, if it's a blocker for you, you can always switch to the 2017 version using the instructions at https://github.com/OfficeDev/script-lab/blob/master/README.md#2017.

[sancarn]

Thanks for mentioning that you can switch back! I wouldn't have noticed otherwise!

[Zlatkovsky]

We should have a blog post soon (next couple days) that will let folks know about the new Script Lab and also include the opt out instructions.

But obviously, any future investment will be in the new Script Lab, and already there are a lot of improvements it offers over the old one (esp. the fast reload of snippets). So if you are able to use it, we'd love to hear how it's going for you :-). And we'll try to get that console resizing addressed in the near future.

[sancarn]

It also should be noted that I found today you can open F12 devtools instead of the live console:

https://docs.microsoft.com/en-us/office/dev/add-ins/testing/debug-add-ins-using-f12-developer-tools-on-windows-10

If you want to access the global scope of the addin then use:

var win = document.getElementById("user-snippet").contentWindow
console.log(win.someGlobalVar)

[Zlatkovsky]

@sancarn , just as a warning, the approach you outline is somewhat brittle. It will probably work for the next X amount of time, but I'm not going to guarantee that we won't eventually rename "user-snippet" to something else...

On the other hand, if you're willing to attach the F12 tools, you can actually have much more fun with them, and in a safer manner. My favorite trick: attach F12 (or if you were in Office Online, just open the F12 tools), and then write the statement debugger; in one of the snippet lines. This will pause the code as it's executing in that area, and let you explore globals and etc just like you're trying to above (and not just those, but local variables, too). Have fun!

[Zlatkovsky]

@sancarn , here is a picture for inspiration. Note how you also get to see the compiled-to-javascript source code (from the "async/await" statement -- which is either frightning or cool or a bit of both, depending on your perspective) :-)

[sancarn]

Good point about using debugger! That is much easier! :) I quite often step through the code and did already notice the interesting generator based async/await compiled syntax. Not exactly how I would do async/await but cool never the less! 👍

Would be cool if long-term ScriptLab could have an equivalent debugger e.g. ScriptLab.Debugger() which launches a Step-By-Step debugger which preserves the ES6 code representation via the babel mapping.

Alternatively future ScriptLab add-ins could run on an existing JavaScript interpreter:

Probably the most up to date https://github.com/Siubaak/sval

Others: https://github.com/NeilFraser/JS-Interpreter https://github.com/marten-de-vries/evaljs https://github.com/eiriklv/tailspin