Expose the debugCheckElevationsEnabled from devtools and intellij

[jacob314]

debugCheckElevationsEnabled is a new service extension to help debug elevation issues.
We should support it in devtools as well as possibly directly in intellij and vscode.

Related Flutter CL adding the feature.
https://github.com/flutter/flutter/pull/30215/files

The feature is important enough to add a keyboard shortcut for command line users so it is likely important enough to support in our tools.

[kenzieschmoll]

Do we just need to add another service extension button for this? (similar to #482)

[jacob314]

Yes. For this one all we need is a button. @dnfield might have some ideas for what the tooltip for the button should say.

[dnfield]

How long can the tooltip text be? :) This issue is a little tough to grasp, and may not matter for someone who is not going to develop for Fuchsia. I tried to provide a helpful diagram at https://master-api.flutter.dev/flutter/rendering/debugCheckElevationsEnabled.html

Maybe something like Highlight any overlapping widgets whose elevation order does not match their painting order.

[jacob314]

I would recommend a one sentence tooltip with perhaps a link to that diagram.

This is definitely helpful for Fuchsia users. For other users it seems nice for forwards compatibility but not crucial.

[dnfield]

/cc @DanTup fyi

[jacob314]

@DanTup I would recommend that we expose this to VSCode users via the devtools web app. I expect many fewer users will notice it by a keyboard shortcut of vscode action than by a physical button in a tool based on how stats for adoption for buttons relative to keyboard shortcut actions have shown in VSCode and IntelliJ.

[DanTup]

All the other toggles are exposed as commands (they show up in the Command Palette) in VS Code, but don't have keybindings. I think it makes sense to do the same here, so it's accessible without DevTools - but I don't think it needs a keybind or any UI there?

[devoncarew]

Thinking about this, the setting really only controls the output seen in the timeline view - there won't be any other user facing behavior (unlike something like 'debug draw' or something). Probably just makes to expose as part of the timeline ui.

ed: I was confusing this with a different extension

[dnfield]

@devoncarew I think you might be crossing this with the other one being discussed about widget build times - this one has no impact on timeline, it impacts whether errors are thrown for this condition and it does draw on the screen.

[devoncarew]

Oops, totally right.

[DanTup]

I added the toggle to VS Code in Dart-Code/Dart-Code#1629 since it was just a few lines. I presume that's working as expected (it shows a red border, and spits an error to the console).