Jak uživatelské avatary a špatné DPI rozbily dvojkliky v našem průzkumníku souborů

Tento týden jsem musel řešit kuriózní situaci v našem hlavním CMS pro správu kiosků.

Nejnovější beta verze systému byla téměř připravena k nasazení do produkce a zcela změnila způsob, jakým zpracováváme přístup ke zdrojům. Nové způsoby práce s oprávněními, rolemi, rozsahy a mnoha dalšími věcmi. Nyní dokonce umožňujeme sdílení entit. A jako součást nového uživatelského rozhraní nyní umožňujeme našim uživatelům přidat do svého profilu avatar, který se zobrazuje vedle jejich jména na většině míst v systému, kde se má uživatelské jméno zobrazovat – tohle bude v tomto příběhu relevantní později.

Nyní přichází to hlavní. Přišel za mnou kolega s tím, že je něco v nepořádku s naším vestavěným průzkumníkem souborů. Tvrdil, že někdy prostě nemůže otevřít soubor nebo procházet složku - ale pouze pokud je komponenta zobrazena jako modální dialog, nikoliv jako součást webové stránky - to funguje v pohodě.

Otravní testeři, nemám pravdu?

Každopádně jsem nahodil svou lokální kopii systému a pokusil se problém replikovat. Nenašel jsem žádný problém, vše fungovalo jak má. Otevřel jsem naši částečně nasazenou beta verzi určenou k testování, ale stále nikde žádný problém. Říkám svému kolegovi, že všechno funguje, jsi si jistý, že nepoužíváš nějakou starou verzi v mezipaměti nebo tak něco? Ne, určitě používá nejnovější verzi.

Více kolegů na scéně. Hackerská hudba v pozadí. Nyní testujeme systém na jejich počítačích. Různé stanice, různé OS, různé prohlížeče - Brave, Chrome, Edge, Firefox. Fedora, Windows 10, Windows 11... Funguje to všude. Ani jeden problém.

Vracíme se na pracoviště našeho kolegy. Ještě jednou maže mezipaměť. Je to rozbité. Anonymní okno. Stále rozbité. Jiný prohlížeč... A funguje to? Proč to funguje v Edge, ale ne v jeho - a POUZE JEHO - Chrome? No, alespoň je to pokrok. Možná to rozbije nějaké rozšíření? Ne, žádná rozšíření v jeho anonymním okně. Restartujeme PC. Nepomohlo (šokující).

Víte, v naší kanceláři máme takový meme, že pokud se něco chová divně, může to být problém s DPI. Takže můj kolega se rozhodl změnit své DPI (nebo teda takové to škálování GUI ve Windows) na 100% místo toho, co používal. Violá! Už to funguje! A když to vrátíme, je to zase rozbité.

Co je to za nesmysl? Jak může mít změna měřítka vliv na chování dvojitého kliknutí ve webové komponentě? A jen v jednom prohlížeči a v jiném ne a pouze v modálním okně? A tak se můj kolega rozhodl, že si s tím pohraje.

Jako základ našeho průzkumníka souborů používáme knihovnu s názvem Chonky a v nejnovější verzi jsme se rozhodli přidat malý stavový řádek zobrazující oprávnění vybraných souborů, jejich vlastníky a s kým jsou soubory sdíleny. Rozbila tato maličkost nějak dvojkliky, ale pouze v určitých prohlížečích a s určitým DPI / měřítkem?

Ano. Přesně to se stalo. Než vysvětlím, k čemu přesně docházelo, vypíšu pár faktů:

• Stavový řádek nyní zobrazuje některé informace o uživatelích, jak je uvedeno výše. To zahrnuje také uživatelské avatary.
• Pokud nemáte nic vybraného, ve stavovém řádku se nic nezobrazí. Když vyberete soubor nebo složku, stavový řádek se naplní.
• Průzkumník souborů dokonale vyplňuje modální okno, které je závislé na rozlišení / velikosti prohlížeče.
• Stavový řádek nemá předem definovanou výšku, protože to nebylo potřeba.

Co se tedy vlastně dělo?

Zjistili jsme, že prvek s avatarem, který byl vykreslován ve stavovém řádku, měl pravděpodobně určitou subpixelovou úroveň nedokonalosti, co se týče velikosti, a reálně mohl (a dělal to) natáhnout výšku stavového řádku. Ale nemluvíme o 1 pixelu nebo více. Doslova mluvíme o sub-pixelovém vykreslování. Něco, co by na subatomární úrovni neviděl ani Ant-man. Graficky nedošlo v podstatě k žádné změně a pouze když měl kolega 150% měřítko GUI Windows a pouze v konkrétním prohlížeči, dělalo to problémy.

A co to má společného s dvojklikem? No, protože stavový řádek se technicky "mírně změnil" (i když reálně ne), také se mírně změnil samotný průzkumník souborů, aby se vešel do modálního okna. A to způsobilo opětovné vykreslení komponenty Chonky. A opětovné vykreslení způsobilo ztrátu výběru. Uživatel tedy klikl, došlo k výběru. Ve stavovém řádku se objevily nové informace. Velikost komponenty byla „teoreticky“ změněna, a proto byla aktualizována. Výběr byl ztracen. A dvojité kliknutí funguje v Chonky pouze na soubor, který je již vybrán. Ale kvůli této chybě nikdy nic vybráno nebylo.

No nic, uzamkl jsem výšku stavového řádku a avatarů a nyní dvojkliky zase fungují.

To není souvětí, které jsem si myslel, že někdy vyslovím. Ale co už. FML.