How to use attachInspector? Or other dev tools?

While exploring the examples I came across attachInspector. See here.

What does the “inspector” do? I assume uncommenting that line :point_up_2:t2:attaches a debugger in some way or another, but I don’t see any docs on how to actually use it?

More generally, I’m looking for ways to debug (or visualize) a Lightning app. With the DOM, we can “inspect element” and see what’s going on. Would be great to have some dev tooling that meets that need in Lightning.

This might be what you’re looking for. You could try giving it a shot.

Hope that helps!

The inspector adds this JS debugger

That file converts all the canvas elements into HTML divs with corresponding w/h and x/y coordinates which are inspectable with the devtools. From there you can change properties which will be reflected in the canvas element and vice versa. You can also access the Lightning component by selecting the div and $0.element to manipulate it further.

To turn on inspector when using Lightning-SDK, add this to settings.json

"platformSettings": {
    "inspector": true