← All posts

Guides

TEMP CSS and TEMP JS windows no longer lose data on close — v3.2.2 and v3.2.3

20 May 2026 · by JustZix Team

For weeks our backlog had: "× in TEMP clears sessionStorage." A small title, months of a quiet problem — an accidental click on the × button threw away code, log, geometry. In May 2026 we finally fixed it (v3.2.2) and immediately added a "clear" button for deliberate clearing (v3.2.3). Here is what changed and why this little detail is bigger than it looks.

What was breaking

TEMP CSS, TEMP JS, TEMP JS Console and TEMP Output Console windows (shortcuts Ctrl+Alt+G/H/J/K) lived in the tab's sessionStorage under a random id assigned at first open. Closing with × called removeTempPane, which:

• deleted the window state entry (code, log, geometry, viewMode),
• freed the id, so every subsequent Ctrl+Alt+G created a new random id.

The result: content was lost irreversibly, and even if anything had survived somewhere, you could not find it — the next open looked for a different id. Someone working in TEMP CSS who accidentally clicked × lost 20 minutes of selector writing.

v3.2.2 — × only hides

In v3.2.2 we changed the model: a TEMP window is no longer removed on close, it gets a closed flag and stays in the session with its content, geometry and viewMode. The createTempPane function is now idempotent: reopening a window of the same type (e.g. Ctrl+Alt+G for CSS) reveals the existing window with the kept data instead of creating a new one. injectTempPanesIntoData only renders non-closed windows, so after a reload you still see what was supposed to be visible.

TEMP window data still disappears when the tab closes — that is the natural scope of sessionStorage and the original promise of "data within the session". A page reload also clears it (sessionStorage is per-tab-per-origin and does not survive the natural page lifecycle).

v3.2.3 — the "clear" button

Now that × had become friendly, we added a deliberate clearing tool: the TEMP CSS and TEMP JS headers got a trash-icon button right next to the ×. Clicking it clears the editor content in one move:

• the clear goes into the browser's undo history — Ctrl+Z brings it back;
• for TEMP CSS it immediately updates the live <style> on the page — you see the effect at once;
• a new i18n key tempPane.clear.title ×8 languages (tooltip).

Two intents, two buttons: hide the window (×) and empty its content (trash). Before, × bundled both into one destructive move.

What it means day to day

Three concrete scenarios where this makes a difference:

• "Hide it for a moment, I'll be right back" — you have a TEMP CSS open with a longer CSS rule, you want to see the page without the window, but you will come back in a minute. Before v3.2.2: × wiped the code. Now: × hides, Ctrl+Alt+G brings it back with the same code.
• "I confused × with the close button" — a classic mistake when there are many windows. Before: lost work. Now: another Ctrl+Alt+G and you are back where you were.
• "I want to start from scratch" — before v3.2.3 the only way to clear was select all + delete, or close + lose. Now: click the trash, Ctrl+Z if you change your mind.

Other fixes this model enabled

The old "× clears" model also blocked small improvements that did not have a sensible place: size memory per window type (v2.13.201), double-click the bar = size toggle (v2.13.203), scroll containment (v2.13.203). After rebuilding window state, all three have a consistent place to keep data and react consistently to close/open.

See also

• TEMP panes — full description of shortcut-summoned windows
• TEMP vs persistent window — a decision model
• On-page windows — developer windows inside the page

Install JustZix — and stop losing TEMP code to a single accidental click.