The edit panel next to your page — Ctrl+Alt+I, O, P
Sometimes you want the JustZix edit panel next to the page, not in place of it. You are writing a rule for Wikipedia, but you also want to watch your CSS selectors hit real elements as you type. Three new shortcuts from v3.2.4 — Ctrl+Alt+I, Ctrl+Alt+O, Ctrl+Alt+P — open the panel in a second browser window, automatically select the first active rule for the current page and land on the right tab.
Three shortcuts, three tabs
Ctrl+Alt+I— edit panel, the CSS tab.Ctrl+Alt+O— edit panel, the JS tab.Ctrl+Alt+P— edit panel, the Actions tab.
The shortcut opens the panel in a separate browser window (type normal, 1200×850 — comfortable on medium and larger monitors), not in a new tab. You can keep it next to the page or move it to a second monitor.
Auto-selection of the active rule
Once opened, the panel scans your rule tree, finds the first rule that is active on the current page (folder/group/rule all have cascade on, URL patterns match) and selects it automatically. The tree expands to that rule, the chosen tab is activated — you can start typing right away.
If no rule matches, the panel opens clean, ready for a new one. That is intentional: you are on facebook.com, you have no rule yet — press Ctrl+Alt+I, you get an empty panel with the CSS tab open, two clicks and you create the first rule.
The same shortcut inside the panel = tab switcher
When the panel window is already open and you are at the rule level (not the dashboard or a folder/group editor), pressing the same trio switches the active rule's tab:
Ctrl+Alt+I→ the CSS tabCtrl+Alt+O→ the JS tabCtrl+Alt+P→ the Actions tab
The shortcut does not create a second window — the system focuses the existing one. If you happen to be on the dashboard or editing a folder/group, the shortcut inside the panel does nothing (no-op), because there is no "active tab" to switch.
Compatible with every keyboard layout
The first version of the shortcut matched the key by e.key. On the Polish Programmers layout this turned out to be a problem: AltGr+O produces ó, so Ctrl+Alt+O with the right Alt (= AltGr) yielded e.key === 'ó' and the shortcut did not fire. I and P on Polish have no diacritics under AltGr, so they worked.
In v3.2.5 matching moved to e.code (KeyI / KeyO / KeyP) — the physical key, independent of layout and AltGr. The same pattern we use for the AI Helper (e.code === 'Backslash'). The shortcut works identically on every layout: Polish, German, French, Russian, Chinese.
Use case 1 — writing a rule for facebook.com alongside the preview
You open facebook.com, press Ctrl+Alt+I — in a second window the panel appears with the CSS tab open. You write a selector, save, look at facebook.com — the element is gone. You look at facebook.com, something is obviously missing, you switch focus to the panel and edit. With two monitors you do this without Alt-Tab — with one monitor you drag the window to half the screen and work split-style.
Use case 2 — a quick JS edit of an existing rule
You are on YouTube, your "YouTube: hide suggestions" rule stopped working after a site update. You press Ctrl+Alt+O — the second window opens straight on the JS tab of your YouTube rule (because that is the only rule active on this tab). You fix it, save, reload the first tab — it works. No hunting in the tree.
Use case 3 — a second monitor as a permanent panel
If you work with two monitors: the left one has the browser with the page you visit; the right one is dedicated to the JustZix panel. Ctrl+Alt+I/O/P on the left opens or focuses the panel on the right and jumps to the right tab. An IDE-style workflow with an open dev panel, but against a live page.
Architecture
Under the hood: the content script detects the shortcut and sends a target (shortcut type + current tab URL) to the background. The background checks whether the panel window already exists:
- It does not exist → creates a new window (
chrome.windows.createtypenormal, 1200×850), saves a pending-nav intochrome.storage.local.jzPendingEditNav. On startup the panel consumes the target from storage and picks the rule + tab. - It exists → focuses the window (
chrome.windows.update focused:true), pushes the target through storage. The panel reacts tostorage.onChanged.
This approach is fully asynchronous and needed no modification of options.js — it just consumes _ruleEditorTab and jzPendingEditNav on startup and on storage changes.
See also
- On-page windows — developer windows inside the page
- JustZix keyboard shortcuts — the complete cheat sheet — all built-in shortcuts
- JS rules now work on Facebook, X and GitHub — the same workflow next to the page
Install JustZix — and keep an editor next to the page under one shortcut.
Rate this post
No ratings yet — be the first.