L’autofocus in WebKit

Ho appena dato gli ultimi ritocchi alla patch per il supporto dei controlli autofocus in WebKit.

Giusto come prologo: l’autofocus è applicabile a tutti gli elementi input, select, textarea e button che già sono “focusabili” (visibili e potenzialmente vittime di focus); per farli diventare dei controlli autofocus è necessario che abbiano specificato l’attributo autofocus=”autofocus” o autofocus (per l’HTML). Ad esempio:

<form><input type="text" size="20" autofocus="autofocus" /></form>
equivalente a
<form><input type="text" size="20" autofocus /></form>

Lo standard prevede che il controllo che abbia l’attributo attivo sia immediatamente reso sotto focus non appena il documento (la pagina web) viene correttamente e completamente caricato. Ciò ovviamente rende molto più semplice, ad esempio, far puntare il browser dell’utente sul primo input che questi deve riempire, lasciando quindi da parte i controlli per il caricamento. Cosa non da poco è il fatto che se il controllo si trova oltre l’attuale viewport (l’area visualizzata della pagina web) non è necessario fare magie particolari in quanto è lo stesso browser a puntare direttamente il viewport in modo da visualizzare correttamente il controllo in oggetto.

Ciò detto. Ho terminato la prima implementazione per il supporto dell’autofocus questa mattina (ieri per chi legge), mentre il pomeriggio è stato dedicato a fare un pò di sano refactoring per seguire un pò meglio le convenzioni sui nomi e per la scrittura di un paio di testcase minimali che dovranno essere integrati con robe più sofisticate quanto prima.

La patch è disponibile come attachment al bug 18887. Se qualcuno si sente di provarla sono ansioso di ricevere feedback (sotto forma di commenti al ticket), tant’è che è una primissima implementazione che sarà certamente soggetta a diverse modifiche prima di sbarcare nel trunk.

Insieme alle modifiche alle componenti è stato aggiunto anche un nuovo attributo DOM (come previsto dallo standard) cosicché se da JavaScript si volesse testare l’autofocus su un certo controllo basterebbe usare la proprietà “autofocus”, esempio:

<script language="JavaScript" type="text/javascript">
function testaAutofocus(o)
{
 if (o.autofocus) ...
}
</script>

La proprietà è read-write, quindi è possibile settare il valore anche da JavaScript, tipo con o.autofocus = true. Sinceramente credo che sta cosa non verrà quasi mai usata in quanto l’autofocus viene valutato al termine del caricamento della pagina e solo sull’ultimo elemento che lo ha specificato, se ce ne sono più d’uno (e me pare pure normale…:)).