Il pannello di modifica accanto alla tua pagina — Ctrl+Alt+I, O, P
A volte vuoi avere il pannello di modifica di JustZix accanto alla pagina, non al suo posto. Stai scrivendo un set di regole per Wikipedia, ma vuoi anche vedere i tuoi selettori CSS colpire elementi reali mentre digiti. Tre nuove scorciatoie dalla v3.2.4 — Ctrl+Alt+I, Ctrl+Alt+O, Ctrl+Alt+P — aprono il pannello in una seconda finestra del browser, selezionano automaticamente il primo set di regole attivo per la pagina corrente e atterrano sulla scheda giusta.
Tre scorciatoie, tre schede
Ctrl+Alt+I— pannello di modifica, scheda CSS.Ctrl+Alt+O— pannello di modifica, scheda JS.Ctrl+Alt+P— pannello di modifica, scheda Azioni.
La scorciatoia apre il pannello in una finestra separata del browser (tipo normal, 1200×850 — comoda su monitor medi e più grandi), non in una nuova scheda. Puoi tenerla accanto alla pagina o spostarla su un secondo monitor.
Selezione automatica del set di regole attivo
Una volta aperto, il pannello scansiona il tuo albero, trova il primo set di regole attivo sulla pagina corrente (cartella/gruppo/set hanno tutti la cascata attiva, i pattern URL corrispondono) e lo seleziona automaticamente. L'albero si espande fino a quel set, la scheda scelta viene attivata — puoi iniziare a digitare subito.
Se nessun set corrisponde, il pannello si apre pulito, pronto per uno nuovo. È intenzionale: sei su facebook.com, non hai ancora alcun set — premi Ctrl+Alt+I, ottieni un pannello vuoto con la scheda CSS aperta, due clic e crei il primo set di regole.
La stessa scorciatoia dentro il pannello = cambio scheda
Quando la finestra del pannello è già aperta e ti trovi al livello del set di regole (non sulla dashboard né nell'editor di una cartella/gruppo), premendo la stessa terna cambi la scheda attiva del set:
Ctrl+Alt+I→ scheda CSSCtrl+Alt+O→ scheda JSCtrl+Alt+P→ scheda Azioni
La scorciatoia non crea una seconda finestra — il sistema mette a fuoco quella esistente. Se ti capita di essere sulla dashboard o di modificare una cartella/gruppo, la scorciatoia dentro il pannello non fa nulla (no-op), perché non c'è alcuna "scheda attiva" da cambiare.
Compatibile con ogni layout di tastiera
La prima versione della scorciatoia identificava il tasto tramite e.key. Sul layout polacco Programmers si è rivelato un problema: AltGr+O produce ó, quindi Ctrl+Alt+O con l'Alt destro (= AltGr) generava e.key === 'ó' e la scorciatoia non si attivava. I e P in polacco non hanno diacritici sotto AltGr, quindi funzionavano.
Nella v3.2.5 il matching è passato a e.code (KeyI / KeyO / KeyP) — il tasto fisico, indipendente dal layout e da AltGr. Lo stesso schema che usiamo per l'AI Helper (e.code === 'Backslash'). La scorciatoia funziona allo stesso modo su ogni layout: polacco, tedesco, francese, russo, cinese.
Caso d'uso 1 — scrivere un set di regole per facebook.com accanto all'anteprima
Apri facebook.com, premi Ctrl+Alt+I — in una seconda finestra appare il pannello con la scheda CSS aperta. Scrivi un selettore, salvi, guardi facebook.com — l'elemento è sparito. Guardi facebook.com, manca chiaramente qualcosa, sposti il focus sul pannello e modifichi. Con due monitor lo fai senza Alt-Tab — con un solo monitor trascini la finestra a metà schermo e lavori in modalità split.
Caso d'uso 2 — una rapida modifica JS di un set esistente
Sei su YouTube, il tuo set "YouTube: nascondi i suggerimenti" ha smesso di funzionare dopo un aggiornamento del sito. Premi Ctrl+Alt+O — la seconda finestra si apre direttamente sulla scheda JS del tuo set YouTube (perché è l'unico set attivo su questa scheda). Lo correggi, salvi, ricarichi la prima scheda — funziona. Nessuna ricerca nell'albero.
Caso d'uso 3 — un secondo monitor come pannello permanente
Se lavori con due monitor: a sinistra hai il browser con la pagina che visiti; a destra è dedicato al pannello JustZix. Ctrl+Alt+I/O/P a sinistra apre o mette a fuoco il pannello a destra e salta alla scheda giusta. Un flusso di lavoro stile IDE con un pannello dev aperto, ma contro una pagina dal vivo.
Architettura
Sotto il cofano: il content script rileva la scorciatoia e invia un bersaglio (tipo di scorciatoia + URL della scheda corrente) al background. Il background controlla se la finestra del pannello esiste già:
- Non esiste → crea una nuova finestra (
chrome.windows.createtiponormal, 1200×850), salva un pending-nav inchrome.storage.local.jzPendingEditNav. All'avvio il pannello consuma il bersaglio dallo storage e seleziona il set + scheda. - Esiste → mette a fuoco la finestra (
chrome.windows.update focused:true), invia il bersaglio attraverso lo storage. Il pannello reagisce astorage.onChanged.
Questo approccio è completamente asincrono e non ha richiesto modifiche a options.js — esso semplicemente consuma _ruleEditorTab e jzPendingEditNav all'avvio e ai cambi nello storage.
Vedi anche
- Finestre nella pagina — le finestre per sviluppatori dentro la pagina
- Scorciatoie da tastiera di JustZix — il cheat sheet completo — tutte le scorciatoie integrate
- Le regole JS ora funzionano su Facebook, X e GitHub — lo stesso flusso di lavoro accanto alla pagina
Installa JustZix — e tieni un editor accanto alla pagina con una sola scorciatoia.
Valuta questo articolo
Nessuna valutazione — sii il primo.