← All posts

Windows on the frontend

TEMP panes — throwaway dev windows under a Ctrl+Alt shortcut

15 May 2026 · by JustZix Team

Not every change deserves a permanent rule. You land on someone else's page, you have one question for the DOM, or you want to drop in a bit of CSS for a minute — that is it. That is what TEMP panes are for: windows summoned by a shortcut on any page, used for a moment, gone on reload. Zero config, zero trace in your rules.

How TEMP differs from a normal window

JustZix has four types of on-page windows — CSS pane, JS pane, JS Console and Output Console. Normally you create them in the extension panel and they belong to a rule: they save, return after reload, sync across devices. Great for things you use daily.

A TEMP pane is the same window type, but ephemeral. It is not born from a rule — it is born from a keyboard shortcut. It lives in the tab's sessionStorage, so:

• It appears instantly, on any page, with no rule to create.
• It disappears on page reload or when the tab closes.
• It never reaches sync or backup — it does not clutter your configuration.

Four shortcuts

The shortcuts work globally — no need to click into the extension first. You press it on the page and the window is there.

Press again to close — toggle

The shortcut is a toggle. The first press creates the window, the second closes it. No risk of accidentally stacking five TEMP CSS windows on top of each other — there is at most one TEMP window per type at a time.

You can also close it with the × in the window header, or right-click the bar and pick "Close". As of v3.2.2 both ways only hide the window — the content, log and geometry wait in sessionStorage until you reopen a window of the same type or close the tab. This fixes an earlier data-loss problem on an accidental × click.

The header "clear" button — controlled emptying (v3.2.3)

When you do want to empty a TEMP CSS or TEMP JS window, the header carries a trash-icon button — "clear" — right next to the × button. Clearing goes into undo history (Ctrl+Z brings it back), and for TEMP CSS it updates the live <style> on the page immediately. This separates two intents: hiding the window (×) from emptying its content (trash).

Gone on reload — and that is the point

This is not a limitation, it is the whole idea. A TEMP pane exists so you can check something fast and leave no mess. You opened a client's page, hit Ctrl+Alt+J, checked document.querySelectorAll('.price').length, pressed F5 — and the page is clean again, as if you were never there.

If you catch yourself typing the same TEMP code for the third time — that is the signal to turn it into a permanent rule.

A different color — you will not confuse it with a saved window

Persistent windows are colored by type (green, amber, purple, emerald). TEMP windows get a separate palette — orange, red, pink, cyan — on the whole window border, the header accent and the status dot. One glance and you know it is an ephemeral window, not your saved configuration.

Use case 1 — debug someone else's page with no trace

A classic. You hit a page that behaves oddly. Ctrl+Alt+K opens the Output Console — you see what the page logs and what errors it throws. Ctrl+Alt+J opens a JS Console to query the DOM. Done — reload, gone.

Use case 2 — a one-off CSS without cluttering your rules

You want to kill a sticky header for five minutes because it covers what you are reading. Ctrl+Alt+G, type header{position:static!important}, read in peace, close. No rule was created that you would have to clean up later.

Use case 3 — a REPL on production

You want to check API behavior on a live page. Ctrl+Alt+H opens a TEMP JS pane — paste fetch('/api/...').then(r=>r.json()).then(console.log), run it with the Run button, the result lands in the console. After reload the code is gone — it does not stay in any rule someone could later fire by accident.

Why G/H/J/K specifically

They are adjacent right-hand keys, Vim-cluster style — comfortable under the fingers. Ctrl+Alt+H/J/K/L would be more natural, but Ctrl+Alt+L on Linux (GNOME) locks the screen — the OS grabs the shortcut before the extension ever sees it. So we shifted the whole cluster one key left. G/H/J/K are free across all mainstream browsers and operating systems.

Pitfalls

• Reload clears the window. By design — if you need persistence, make a rule.
• One window per type. Need two consoles at once? Make the second one a persistent pane.
• Per tab. A TEMP pane lives only in the tab where you opened it — another tab of the same page does not have it.

See also

• TEMP vs persistent window — a decision model
• Mini-IDE in a browser tab — an overview of all windows
• Output Console — watch the page logs

Install JustZix — and keep four dev windows one shortcut away on every page.