Merge #35: Doppelt gerenderte Listen dokumentieren
Behebt Issue #28: Kommentar an der Dokumentenliste, Muster und drei tragfaehige Wege in e2e/hilfen.ts, Begruendung warum die Verdopplung bleibt. Closes #28
This commit was merged in pull request #35.
This commit is contained in:
@@ -117,3 +117,46 @@ export function beispielPdf(text = 'Bescheid'): Buffer {
|
|||||||
|
|
||||||
return Buffer.from(pdf, 'latin1')
|
return Buffer.from(pdf, 'latin1')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Doppelt gerenderte Listen — was beim Suchen schiefgeht.
|
||||||
|
*
|
||||||
|
* Die Dokumentenliste (und moeglicherweise kuenftig weitere) rendert
|
||||||
|
* denselben Inhalt ZWEIMAL: als Karten fuers Handy, als Tabelle ab
|
||||||
|
* Tablet. Eine der beiden Fassungen ist per Breakpoint versteckt, steht
|
||||||
|
* aber im DOM.
|
||||||
|
*
|
||||||
|
* Die Folge im Test:
|
||||||
|
*
|
||||||
|
* await expect(page.getByText('Bescheid').first()).toBeVisible()
|
||||||
|
* // -> "element is not visible", obwohl die Seite richtig aussieht
|
||||||
|
*
|
||||||
|
* `.first()` nimmt, was zuerst im Baum steht - und das ist die Karte,
|
||||||
|
* also am Schreibtisch die unsichtbare Fassung. Es liegt NICHT an der
|
||||||
|
* Anwendung.
|
||||||
|
*
|
||||||
|
* Nachgemessen an /dokumente mit acht Dokumenten: Ein Titel liefert 16
|
||||||
|
* Treffer, davon 8 sichtbar - und `.first()` ist unsichtbar.
|
||||||
|
*
|
||||||
|
* Drei Wege, die tragen:
|
||||||
|
*
|
||||||
|
* 1. Ueber den Seitentext pruefen, wenn es nur um "steht das da?" geht:
|
||||||
|
*
|
||||||
|
* const inhalt = await page.locator('body').innerText()
|
||||||
|
* expect(inhalt).toContain('Bescheid')
|
||||||
|
*
|
||||||
|
* innerText liefert nur sichtbaren Text - die versteckte Fassung
|
||||||
|
* faellt von selbst weg. (Fuer Inhalt in einem zugeklappten
|
||||||
|
* <details> braucht es dagegen textContent.)
|
||||||
|
*
|
||||||
|
* 2. Auf die sichtbare Fassung einschraenken, wenn geklickt wird:
|
||||||
|
*
|
||||||
|
* page.getByRole('link', { name: 'Bescheid' }).locator('visible=true')
|
||||||
|
*
|
||||||
|
* 3. Die Zusammenfassungszeile pruefen ("12 Dokumente"), wenn es um
|
||||||
|
* Anzahlen geht - die steht nur einmal.
|
||||||
|
*
|
||||||
|
* Was nicht traegt: eine feste Anzahl erwarten. `getByText(...)` findet
|
||||||
|
* jeden Eintrag zweimal, und wer das mit toHaveCount(1) prueft, schreibt
|
||||||
|
* einen Test, der bei jeder Layoutaenderung umfaellt.
|
||||||
|
*/
|
||||||
|
|||||||
@@ -17,6 +17,21 @@ import {
|
|||||||
*
|
*
|
||||||
* Am Handy eine Karte je Dokument, ab Tablet eine Tabelle - die Tabelle
|
* Am Handy eine Karte je Dokument, ab Tablet eine Tabelle - die Tabelle
|
||||||
* scrollt dabei im eigenen Rahmen, nie die ganze Seite.
|
* scrollt dabei im eigenen Rahmen, nie die ganze Seite.
|
||||||
|
*
|
||||||
|
* ACHTUNG, jeder Inhalt steht ZWEIMAL im DOM: einmal als Karte, einmal
|
||||||
|
* als Tabellenzeile. Eine der beiden Fassungen ist per Breakpoint
|
||||||
|
* versteckt, steht aber trotzdem im Baum.
|
||||||
|
*
|
||||||
|
* Fuer Tests heisst das: getByText(...).first() trifft womoeglich die
|
||||||
|
* unsichtbare Kopie, und die Pruefung scheitert mit "element is not
|
||||||
|
* visible" an einer Stelle, die augenscheinlich in Ordnung ist. Der Weg,
|
||||||
|
* der traegt, steht in e2e/hilfen.ts unter "Doppelt gerenderte Listen".
|
||||||
|
*
|
||||||
|
* Warum nicht eine Fassung fuer beide? Eine Tabelle, die sich zu Karten
|
||||||
|
* umbricht, verlangt display:block auf Zeilen und Zellen. Damit ist es
|
||||||
|
* keine Tabelle mehr - Vorlesesoftware verliert den Zusammenhang von
|
||||||
|
* Spaltenkopf und Wert, und genau der macht eine Dokumentenliste mit
|
||||||
|
* acht Spalten erst benutzbar. Die Verdopplung ist der Preis dafuer.
|
||||||
*/
|
*/
|
||||||
export function DokumentListe({ eintraege }: { eintraege: Listeneintrag[] }) {
|
export function DokumentListe({ eintraege }: { eintraege: Listeneintrag[] }) {
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user