Debugging del reflow dei frame

Home
- Traduzioni
  - Risorse su Gecko
    - Debugging del reflow dei frame

Debugging del reflow dei frame

Articolo originale: http://www.mozilla.org/newlayout/doc/frame_reflow_debug.html

Traduzione: Gabriele Romanato (20 febbraio 2008)

Sguardo d'insieme generale

Il reflow dei frame può essere monitorato in un log con le capacità di debug implementate in nsFrame.cpp. Fornisce le seguenti informazioni per ciascun frame all'inizio del suo reflow:

motivo del reflow
larghezza disponibile, altezza disponibile
larghezza calcolata, altezza calcolata
il frame precedente e successivo nel flusso
un numero di conteggio.

Quando il reflow del frame è terminato, vengono visualizzate le seguenti informazioni:

larghezza e altezza metrica del reflow (desiderata)
larghezza massima dell'elemento
larghezza massima
stato del frame
area di overflow

Ottenere il log

Assicuratevi che la vostra build sia una build debug (in breve, avete bisogno di ac_add_options -- enable-debug nel vostro file .mozconfig).
Create un file di testo (per esempio reflow_rules.txt).
Inserite questa riga nel file di testo * 1
Dovrebbe apparire come:
puntate la variabile d'ambiente GECKO_DISPLAY_REFLOW_RULES_FILE sul percorso del file reflow_rules.txt.
Lanciate mozilla > logfile.txt e caricate il vostro test case. Il file di log conterrà tutte le informazioni attese.

Analisi del file di log

Il file di log per una semplice tabella come

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="content-type" content="text/html; 
  charset=ISO-8859-1">
</head>
<body>
<table width="100">
  <tbody>
    <tr>
      <td>foo</td>
    </tr>
  </tbody>
</table>
</body>
</html>

creerà il seguente listato:

VP 00B97C30 r=0 a=9180,4470 c=9180,4470 cnt=856 
 scroll 00B97EE0 r=0 a=9180,4470 c=9180,4470 cnt=857 
 scroll 00B97EE0 r=0 a=9180,4470 c=9180,4470 cnt=858 
  canvas 00B97C6C r=0 a=9180,UC c=9180,4470 cnt=859 
   area 02D7AFE4 r=0 a=9180,UC c=9180,UC cnt=860 
    text 02D7B150 r=0 a=9180,UC c=UC,UC cnt=861 
    text 02D7B150 d=0,0 
    block 02D7B210 r=0 a=9180,UC c=8940,UC cnt=862 
    block 02D7B210 d=8940,0 
   area 02D7AFE4 d=9180,120 
  canvas 00B97C6C d=9180,4470 
 scroll 00B97EE0 d=9180,4470 
 scroll 00B97EE0 d=9180,4470 
VP 00B97C30 d=9180,4470 
VP 00B97C30 r=1 a=9180,4470 c=9180,4470 cnt=863 
 scroll 00B97EE0 r=1 a=9180,4470 c=9180,4470 cnt=864 
 scroll 00B97EE0 r=1 a=9180,4470 c=9180,4470 cnt=865 
  canvas 00B97C6C r=1 a=9180,UC c=9180,4470 cnt=866 
   area 02D7AFE4 r=1 a=9180,UC c=9180,UC cnt=867 
    block 02D7B210 r=1 a=9180,UC c=8940,UC cnt=868 
     text 02D7B3F8 r=0 a=8940,UC c=UC,UC cnt=869 
     text 02D7B3F8 d=0,0 
     tblO 02D7B5F0 r=0 a=8940,UC c=0,0 cnt=870 
      tbl 02D7B7EC r=0 a=8940,UC c=1500,UC cnt=871 
       rowG 00B984A4 r=0 a=UC,UC c=UC,UC cnt=872 
        row 02D7BAF8 r=0 a=UC,UC c=UC,UC cnt=873 
         cell 02D7BC98 r=0 a=UC,UC c=UC,UC cnt=874 
          block 02D7BCF8 r=0 a=UC,UC c=UC,UC cnt=875 
           text 02D7BE84 r=0 a=UC,UC c=UC,UC cnt=876 
           text 02D7BE84 d=300,285 me=300 
          block 02D7BCF8 d=300,300 me=300 
         cell 02D7BC98 d=330,330 me=330 
        row 02D7BAF8 d=UC,330 
       rowG 00B984A4 d=UC,330 
       colG 02D7BFB0 r=0 a=UC,UC c=UC,UC cnt=877 
        col 02D7C0D8 r=0 a=0,0 c=1500,UC cnt=878 
        col 02D7C0D8 d=0,0 
       colG 02D7BFB0 d=0,0 
       rowG 00B984A4 r=2 a=1500,UC c=1500,UC cnt=879 
        row 02D7BAF8 r=2 a=1500,UC c=1500,UC cnt=880 
         cell 02D7BC98 r=2 a=1440,UC c=1410,UC cnt=881 
          block 02D7BCF8 r=2 a=1410,UC c=1410,UC cnt=882 
          block 02D7BCF8 d=1410,300 
         cell 02D7BC98 d=1440,330 
        row 02D7BAF8 d=1500,330 
       rowG 00B984A4 d=1500,330 
       colG 02D7BFB0 r=2 a=1500,UC c=1500,UC cnt=883 
        col 02D7C0D8 r=0 a=0,0 c=1500,UC cnt=884 
        col 02D7C0D8 d=0,0 
       colG 02D7BFB0 d=0,0 
      tbl 02D7B7EC d=1500,390 
     tblO 02D7B5F0 d=1500,390 
     text 02D7C130 r=0 a=8940,UC c=UC,UC cnt=885 
     text 02D7C130 d=0,0 
    block 02D7B210 d=8940,390 
   area 02D7AFE4 d=9180,630 
  canvas 00B97C6C d=9180,4470 
 scroll 00B97EE0 d=9180,4470 
 scroll 00B97EE0 d=9180,4470 
VP 00B97C30 d=9180,4470

La prima riga mostra il reflow del viewport (VP). Il viewport ha l'indirizzo 00B97C30. Si tratta del reflow iniziale: r=0. Altri motivi del reflow sono:

reflow incrementale
reflow di ridimensionamento
reflow del cambiamento di stile
reflow sporco.

La larghezza disponibile è di 9180 twip. L'altezza disponibile è di 4470 twip (a=9180,4470). La larghezza calcolata è di 9180 twip. L'altezza calcolata è di 4470 twip (c=9180,4470). Il conteggio di riga è 856 (cnt=856).

Di seguito abbiamo una riga che riporta:

tblO 02D7B5F0 r=0 a=8940,UC c=0,0 cnt=870

Qui UC mostra che sul reflow iniziale l'altezza disponibile per il frame di tabella esterno è senza restrizioni.

La cella di tabella ha bisogno che i suoi figli calcolino il MES. Viene riportato nel blocco come:

block 02D7BCF8 d=300,300 me=300

Il blocco della dimensione massima dell'elemento è di 300 twip.

Il secondo reflow della tabella inizia a

rowG 00B984A4 r=2 a=1500,UC c=1500,UC cnt=879

dove vengono usate le precedenti informazioni. Il blocco ha dovuto calcolare una sola volta la dimensione massima dell'elemento e lo riporta ora:

block 02D7BCF8 d=1410,300

Il blocco mostra lo stesso indirizzo del precedente.

I frame con figli che fuoriescono dal genitore hanno il flag NS_FRAME_OUTSIDE_CHILDREN impostato. Per questi frame l'area di overflow viene visualizzata come block 025ED8F0 d=8940,1020 o=(0,0) 9180 x 1020. L'area di overflow viene specificata come origine (x, y) e larghezza per altezza.

Il reflow termina allo stesso livello in cui è iniziato.

Debugging avanzato del reflow

La tecnica descritta in precedenza fa il dump dei dati per ogni frame. A volte il logo è più chiaro se vengono mostrati solo i frame principali. Le voci nel log di reflow possono essere controllate a livello di frame. Per esempio, aggiungendo text 0 alle regole in reflow_rules.txt si nascondono le voci testuali dal reflow. La visualizzazione dei seguenti frame può essere abilitata aggiungendo una riga con il nome del frame e 1, o disabilitata aggiungendo una riga con il nome del frame e 0:

nome abbreviato	tag di layout
area	area
block	block
br	br
bullet	bullet
button	gfxButtonControl
hr	hr
frameI	htmlFrameInner
frameO	htmlFrameOuter
img	image
inline	inline
letter	letter
line	line
select	select
obj	object
page	page
place	placeholder
posInline	positionedInline
canvas	canvas
root	root
scroll	scroll
caption	tableCaption
cell	tableCell
bcCell	bcTableCell
col	tableCol
colG	tableColGroup
tbl	table
tblO	tableOuter
rowG	tableRowGroup
row	tableRow
textCtl	textInput
text	text
VP	viewport

Una volta che il problema viene ridotto a livello di un singolo frame, inserire un punto di interruzione su DisplayReflowEnterPrint in nsFrame.cpp è un modo molto efficiente di passare in rassegna l'albero di reflow.

Altre opzioni del debug del reflow

GECKO_DISPLAY_REFLOW_FLAG_PIXEL_ERRORS

Impostare questa opzione tramite set GECKO_DISPLAY_REFLOW_FLAG_PIXEL_ERRORS = 1 permette di verificare, per ciascun valore di coordinata, che le coordinate siano allineate ai pixel circostanti.

              row 0268A594 r=0 a=UC,UC c=UC,20 cnt=870 
VALUE 20 is not a whole pixel 
               cell 0268A6C0 r=0 a=UC,UC c=UC,15 cnt=871 
                block 0268A764 r=0 a=UC,UC c=UC,UC cnt=872 
                block 0268A764 d=0,0 me=0 
               cell 0268A6C0 d=0,0 me=0 
              row 0268A594 d=UC,20 
VALUE 20 is not a whole pixel 
             rowG 0268A02C d=UC,695 
VALUE 695 is not a whole pixel

Sebbene i valori non allineati all'ingresso del reflow di un frame possano essere ignorati, se appaiono all'uscita di una routine possono causare errori di visualizzazione come linee isolate. OS2 è molto vulnerabile agli errori di allineamento dei pixel quando il testo viene visualizzato sui pixel circostanti.

Impostare questa opzione tramite set GECKO_DISPLAY_REFLOW_INDENT_UNDISPLAYED_FRAMES = 1 farà avanzare l'indentazione anche per i frame bloccati tramite le regole del file di reflow.

CSS Zibaldone