The variables editors used to have a fixed height, six rows in the forms and four on the detail pages, with an expand button that reopened the same editor in a modal half the height of the viewport. They size to what they hold now, never fewer than four lines and never more than fifty, and the expand button is gone with the modal behind it.
Where the idea comes from
It is not ours. AWX's new interface, ui_next, sizes its variables editor to its content, and that is plainly the right behaviour: a two line template should not get the same box as a two hundred line one, and neither should need a modal opened over the page just to be read. Ascender kept the classic UI and modernised it rather than moving to the new one, so this is that idea ported across rather than inherited, on our own editor, which is ace.
The floor and the ceiling
The height comes from ace's own minLines and maxLines rather than a pixels-per-line calculation, so the box matches the line height ace actually renders. The floor stops a one line value from collapsing into a sliver. The ceiling is the interesting half, because it turns out not to be cosmetic.
Why there is a ceiling
The first cut had no ceiling, and @cigamit found what that costs within a day: on a host whose facts run past eight thousand lines, the page took around four seconds to appear and scrolling lagged behind the pointer. Ace renders every row it sizes itself to, so the editor was building a line of DOM for every line of facts.
What had been hiding it is worth knowing if you touch this code. The editor carried a max-height of 90vh, which clamped the box so ace only ever rendered a viewport's worth. That cap went out along with the expand modal, and nothing replaced it until the ceiling did.
Measured on that same page, flipping only the ceiling:
- Capped at fifty rows: 52 rows rendered, 434 DOM nodes in the editor, a box 1,210 px tall.
- Uncapped: 8,209 rows rendered, 70,149 DOM nodes, a box 197,026 px tall, and no scrollbar in sight.
The capped figure stays where it is however long the facts get, fifty rows is more than 90vh ever showed on a 1080p screen, and anything past row fifty scrolls inside the editor.
Ctrl+F, which was broken anyway
Ctrl+F in any of these editors threw and opened nothing, on main as much as on the branch: ace asks for its search box through its own module loader, which resolves nothing under a bundler, and the search extension was never imported. It is imported up front now. It belongs here because a capped editor scrolls, and ace's search reads the whole document rather than the rendered rows, so it still finds a string on the last line.
What changed where
Every editor in the forms follows its content. On the detail side the template, job and workflow approval pages drop the row counts they used to pass, while the inventory, host and credential type details keep theirs, since those pages are laid out around a fixed box.
This is in #806, and its ceiling exists because @cigamit ran the branch against a host nobody thought to test with.
Four lines and fifty are both arbitrary, in the sense that any pair of numbers would have been. If either is wrong for a screen you spend real time on, say which screen and what you would put there instead.
