From ff1f281cc8b134b5edbaca0a05942dc3046a0730 Mon Sep 17 00:00:00 2001 From: shadowusr Date: Tue, 23 Jun 2026 02:36:19 +0300 Subject: [PATCH 1/3] fix: do not fail if capture element disappears mid-capture and we already have some chunks available --- package.json | 2 +- .../screen-shooter/elements-screen-shooter.ts | 10 +++ .../capture-area-disappears-after-scroll.html | 86 +++++++++++++++++++ test/e2e/tests/assert-view.testplane.js | 8 ++ 4 files changed, 105 insertions(+), 1 deletion(-) create mode 100644 test/e2e/static/capture-area-disappears-after-scroll.html diff --git a/package.json b/package.json index 4ab705a26..bff383280 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "test-e2e-testplane": "npm run test-e2e-testplane:generate-fixtures && npm run test-e2e-testplane:run-tests", "test-e2e-testplane:run-tests": "node bin/testplane --config test/e2e/testplane.config.ts", "test-e2e-testplane:generate-fixtures": "node bin/testplane --config test/e2e/fixtures/basic-report/testplane.config.ts || true", - "test-e2e:gui": "node bin/testplane --config test/e2e/testplane.config.ts gui", + "test-e2e-testplane:gui": "node bin/testplane --config test/e2e/testplane.config.ts gui", "test-browser-env": "TS_NODE_PROJECT=./test/browser-env/tsconfig.json node bin/testplane -r tsconfig-paths/register --config test/browser-env/testplane.config.ts", "test-browser-env:gui": "TS_NODE_PROJECT=./test/browser-env/tsconfig.json node bin/testplane gui -r tsconfig-paths/register --config test/browser-env/testplane.config.ts", "toc": "doctoc docs --title '### Contents'", diff --git a/src/browser/screen-shooter/elements-screen-shooter.ts b/src/browser/screen-shooter/elements-screen-shooter.ts index 2d327d75d..52818be8f 100644 --- a/src/browser/screen-shooter/elements-screen-shooter.ts +++ b/src/browser/screen-shooter/elements-screen-shooter.ts @@ -631,6 +631,16 @@ export class ElementsScreenShooter { opts, async currentState => { if (currentState.captureSpecs.length === 0) { + if (iterations > 0) { + debug( + "Capture area disappeared after %d chunk(s), rendering already captured data for selectors: %s", + iterations, + selectorsToCapture.join("; "), + ); + + return; + } + throw new Error(getEmptyCaptureSpecsErrorMessage(selectorsToCapture)); } diff --git a/test/e2e/static/capture-area-disappears-after-scroll.html b/test/e2e/static/capture-area-disappears-after-scroll.html new file mode 100644 index 000000000..297fbb4f2 --- /dev/null +++ b/test/e2e/static/capture-area-disappears-after-scroll.html @@ -0,0 +1,86 @@ + + + + + + Capture Area Disappears After Scroll + + + +
Safe area interference
+ +
+
Popup top
+
Popup middle
+
Popup bottom
+
+ + + + diff --git a/test/e2e/tests/assert-view.testplane.js b/test/e2e/tests/assert-view.testplane.js index 68ccd469b..e2cef5b92 100644 --- a/test/e2e/tests/assert-view.testplane.js +++ b/test/e2e/tests/assert-view.testplane.js @@ -61,6 +61,14 @@ describe("assertView", () => { }); }); + it("should use captured chunk when capture area disappears after scrolling", async ({ browser }) => { + await browser.url("capture-area-disappears-after-scroll.html"); + + await browser.assertView("scroll-sensitive-popup", "[data-testid=scroll-sensitive-popup]", { + captureElementFromTop: true, + }); + }); + it("should treat sticky content inside capture target as interference", async ({ browser }) => { await browser.url("sticky-interference-behind-capture-target.html"); From ab9961cbfdf86760fc7d3d102dbd5da5de5bee71 Mon Sep 17 00:00:00 2001 From: shadowusr Date: Tue, 23 Jun 2026 03:33:30 +0300 Subject: [PATCH 2/3] fix: only shrink safe area if sticky element is inside of capture element --- .../screen-shooter/operations.ts | 3 +- ...area-root-sticky-behind-absolute-popup.png | Bin 0 -> 28599 bytes .../computeSafeArea.testplane.ts | 13 ++++ .../root-sticky-behind-absolute-popup.html | 71 ++++++++++++++++++ .../8b8b177/chrome/scroll-sensitive-popup.png | Bin 0 -> 8790 bytes 5 files changed, 86 insertions(+), 1 deletion(-) create mode 100644 test/browser-env/screens/40bec12/chrome/compute-safe-area-root-sticky-behind-absolute-popup.png create mode 100644 test/browser-env/tests/desktop/screenshooter/fixtures/safe-areas/root-sticky-behind-absolute-popup.html create mode 100644 test/e2e/screens/8b8b177/chrome/scroll-sensitive-popup.png diff --git a/src/browser/client-scripts/screen-shooter/operations.ts b/src/browser/client-scripts/screen-shooter/operations.ts index 4f1486969..d46cb5ed4 100644 --- a/src/browser/client-scripts/screen-shooter/operations.ts +++ b/src/browser/client-scripts/screen-shooter/operations.ts @@ -333,7 +333,8 @@ export function computeSafeArea( const scrollParentBcr = scrollParent.getBoundingClientRect(); topValue += isRootLikeElement(scrollParent) ? 0 : scrollParentBcr.top; shouldSkipZIndexCheck = - scrollParent === scrollEl || (isRootLikeElement(scrollParent) && isRootLikeElement(scrollEl)); + captureElements.some(capEl => capEl === el || capEl.contains(el)) && + (scrollParent === scrollEl || (isRootLikeElement(scrollParent) && isRootLikeElement(scrollEl))); if (!isNaN(topValue)) { adjustedRect = { diff --git a/test/browser-env/screens/40bec12/chrome/compute-safe-area-root-sticky-behind-absolute-popup.png b/test/browser-env/screens/40bec12/chrome/compute-safe-area-root-sticky-behind-absolute-popup.png new file mode 100644 index 0000000000000000000000000000000000000000..e43299c710e4a3b49c2505bc5957b04d4d83760b GIT binary patch literal 28599 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 literal 0 HcmV?d00001 diff --git a/test/browser-env/tests/desktop/screenshooter/computeSafeArea.testplane.ts b/test/browser-env/tests/desktop/screenshooter/computeSafeArea.testplane.ts index 19432971b..bc875d537 100644 --- a/test/browser-env/tests/desktop/screenshooter/computeSafeArea.testplane.ts +++ b/test/browser-env/tests/desktop/screenshooter/computeSafeArea.testplane.ts @@ -336,6 +336,19 @@ describe("computeSafeArea", () => { await browser.assertView("compute-safe-area-stacking-context-filter-in-front"); }); + it("should not shrink when root sticky element is behind absolute popup target", async ({ browser }) => { + const { default: html } = await import("./fixtures/safe-areas/root-sticky-behind-absolute-popup.html?raw"); + document.body.innerHTML = html; + + const selectors = [".popup"]; + const safeArea = computeSafeArea(selectors); + const captureSpecs = computeCaptureSpecs(selectors); + + visualizeCaptureSpecs(captureSpecs); + visualizeSafeArea(safeArea.top, safeArea.height); + await browser.assertView("compute-safe-area-root-sticky-behind-absolute-popup"); + }); + it("should shrink for fixed header that creates stacking context via filter and is in front", async ({ browser, }) => { diff --git a/test/browser-env/tests/desktop/screenshooter/fixtures/safe-areas/root-sticky-behind-absolute-popup.html b/test/browser-env/tests/desktop/screenshooter/fixtures/safe-areas/root-sticky-behind-absolute-popup.html new file mode 100644 index 000000000..29d9885b2 --- /dev/null +++ b/test/browser-env/tests/desktop/screenshooter/fixtures/safe-areas/root-sticky-behind-absolute-popup.html @@ -0,0 +1,71 @@ + + +
+
Sticky filter behind popup
+ +
+

Listing card

+

The sticky filter belongs to page content and is below the popup in stacking order.

+
+
+ +
Popup target above sticky filter
diff --git a/test/e2e/screens/8b8b177/chrome/scroll-sensitive-popup.png b/test/e2e/screens/8b8b177/chrome/scroll-sensitive-popup.png new file mode 100644 index 0000000000000000000000000000000000000000..f694d25894e75dd4fd12b346c1b223a930abd8ca GIT binary patch literal 8790 zcmd^_S6GuvyRaz&8bm;v(xS3lDn(pMQA$7rS%4s+DltSh^EWyd&<03JNh!Jf>F6aTB@LJSjJL{5N|uce;iaVZ>A5(b^hpR@n&gq7zD45Ijbrk1 z>gvYT2UWK2wcon!H-|lcO(nBBc~i*_Ne-#EG-Yo6uIE&ndIt&y@7mqae}7;-u5b^ziSu!VHr6hn-J9?+87I}fmOD)RcA9%+6PARGH8(LxoDSPd$aH&7l zrIn;I_LWHQ0dFyr`mL6d8YsRhC1oaEO#1o1YtHm%{mO=$y{!E{^yW^o)L&cw1FL@5 zBTp-1Ney;WyG;bQOyhRx&@$;ef1ebUI{>9TP0+-dT8olSu3Bqa3trqr)(S&St*JHf zmT4ba)qADP^om2;YPZ5Op9~VCuYCv!STkD0PaJ0v9AF2Lv=_xWQ=F-c_VKj=-adudu2AJp2#Y$ARN^*XmQqL4;3-#5sN&5zsDtk+aSwxA|2 ztyUv0%O))h6*~o=LV>gfIwH|Q9nq)z0?%U@*b~45C0aHcDcq@bt0zH z%E6s3sLt%75p?oU|5U}G*tt~sv(J~Tj0>X*u_UD|$2g7qiRT$gS*L@wr339^uomXg zq2m4EywkUy2W}*fw9XRQKTMl}c_Q{BkYW?KPPzRobj0>!var*O{$8HbEWoN}hYGag z2)o<%#y&+Q9~W1Kg4-PGC$dv5xddv{bE(YNY(hJL%=k^&HIqUb3p&%Rlv%bm_1)Hn zdG{oEykzODGaU>Uh^V5QJG|qs9_Sc^nHw8Y!*ogb*EL=GihiRC%`(H3e&XJ zOWtGa;DDTWC?`ZRKEwG<`{ULbOOuxdhP;^1fTyqOUP$BkgfkrCx0(DKq2t&npTNl4 z3JY#acEL@qU>2{UX~(NtX(OC+n*lIJ@uG5{sqp@r;AA=e*AVeJLm0n^bmhRuR~Lr& zOxV4y>D4##^Ofi1Q#Vzw+VSb+$Sy+lQ-^bJDy(i2K)bV*;tgKCDjvK*A^AAR^bsa* z=XOnHHTZY(dGN=gQJvp&dOc$8nU3G+;ej;D5V{`kUC=JWpWqs}&dd>j+5LM3R@Q(fJ;F`^LLcH+mX^Hd$%T&7AUS@&H3z7q4hdhKjF7>JWM$y!(+LVA3; z%p4C@(YchQ^1d~@FTLKdqexAUd=q5@ftzvxpPA6B>b>FKhe||3o>EMtNwZcFC!+Jg zaC}ZL+TIjB+wCC8>%l_tOH%zswma%1dxX2`e5IF1UvsSY;@2s~Mlk&mQrt%F3BKv) zh^b4O!2;sm;y*U9OTc&BX<)cfT53wmrZlb~li*R2$~{nWq2f@!t7JeN0d_Y+aC>~_ zX3W&ISaY<=+Za@`B#fz7A;&0dEJ*ztkgqB^Wk)+my_%q$mVr0m{$BoMbiB<^=MpZx z&ahbnm--JA-Uiv^U57lqL$F&NXaykX_XB{VHR|L|`AYbX$-{d`3>9Hj7TGcZL1C@9 zzjKkMf3r5CeDL(fWVc{YNr2K_!^`G&hOK+!;|untG5DVLwCsH_Qesj~#K@bR@+IDR-d}XC_=)D+8L%V@`2I&LF`!zu5U?0^ z(VU(-@MJts<A6JFQEOZqVJ7L|`zQ3^1klA6(f&d4ej{(PK;xj- zp^}yXT9(6_dMU2FAd>LvQPW|dXBf2%g}$_tv}K6Il{<@78L$X1UE}}IF#9UYSEN1| zp!m(r@OfxN+x$ZCOrID!CfQLgW@$Vhmv81UIJjz{oWtA(>Q%%M_asJ*@Ho)MD z4!Ia%yQjc|4EI)k9h>{=7^I^h$LQi>=8?2)?5!iy*fs$@v(rWd+ zhPdWML47T62j#CoiIl{!kxj`GZY+4hSKXg&WXu+Qgr2wr?>1XH3-``o-`DSZj*y4+e=FC)0IR|J~5^N$Q=p1+Q>#3b78qR$wt2g)V z*NQc^2Ex-5P|+XiM$_t zZ|0DPKcuE`Kg6YpRtF+S4K5^!QjY}9zFqkmqXWQv{uUasl{T1{`o8A%9Hc%>mR4XE z;kC{;gX%VjCPfbpr}Pc zzA^3h32`FnL!|XL+(moR*UFP$*tq0d#{yy%Vc}G3&Texn-4l&w!s+gtX%=GP^qVe_ zkWn0|q=1C#T5R-(P(4&SQH}(yUFYn1r6QZ{iSOM zru%$O{NU7ck%CqZ4ZU7qJ3jJ`O6P4037jx#UKp`koM_sUd=@Q^ODm}?i(fjwix#i* z7{R>f&jHxp&g=!DvgsHjEix7zg3KjFB*BMDVFXjYanC@mO3DW1L034Nk>1XApGt}g z&pnEY=4!8jLRijo*MnATcYo=Iu?~$WX!oUr;A)lOa&@>46r-#f&3usf#ak=h#S5rj9bnp(}p;=gzka&~s;PFnLv2qSd-*c?~puG=+ z2P>ck-Vyk%Gt90fl)}cF5s~qiJTD544u!9X`~fG6wkK!lLgx>l<{kzQ&CSU2JBwKW zt++)9{D4)c{>!*1PHUD9nI4%3TNRZ3{efwUINU6&-Hny33LsgaY<2AfOq(m2~=SHQ2ypP;-5Pa>ed$*bE`$)P1)5NB7=pKrhu@bI;lfZu4t?+_CfEoWK;BK?_r__gt{La>c@{IXItH+;k;? z%d%9~RjpspR%qe67zEI<6)HYbG_HviR}n%ORHUQ&m5caFeN*h=!_|j)(vv-D9rYJu zy#hO;JTxZ&p^(ie8U7muKPQB6-6L*8C50@XDP}j6o#hfUt+fbwXT!-@veb zz91WLJ(M|X;G$>Gy@*J}h*#1XZ*!``E&DTQ3yt(A^qc4X>Wek91t+d$HnJPv%Qr93 zkAA3sCxR5^ zUhI|EC1xnMpCVMz6%lv z*}A#jf&+KtDOPE6mp=4RPRB{UbDL+Bn1AfwfGFN}dY zSE>s?D41;eiQdeN9?D}r*Scd)AZhwsLOqkbB+p}NtB6cvsSVkxzyigXMHA%UQbbR*BFcLSEffpPmD!l z%NqzP9Nw0&f=5FcNAZ$Ga_reEI2mWNihw1iT>ce>LyGizP?*3&8ki%F{F$qpcb3dR zPxN07+x9qe0?wbl2^;-*c~)riosj~w$$cjQb!PR_8=JVPZw`=EY23;u22+jPJ`QL4 z0N_}eUf=w(8c9#4&S?P20UjZJI=bZL+sl_Dm#zHih7W?&dYqP8+TXTfzKq|NYxZy; zOg_aZHt}k9KE3cR;}R*^&v#36@y&W=x!R>^|Epy z!rk(TkcBGnf({uq)n*)4CFWvei`6BQo{z8>tPP zME}vk$FZ!}pgkNamY###^#Vgr-Tc6$mo;)H6+$ds+0l~|BY$HF9vImGe-G}-Jw*v? zw}J!fgX1@7G0@QOw=0&k;M*nNJV_MprMUES%hPTB>IyV0B8zlv6ZQmPna=-kFH+R5 z9nA3{BWdd?Uj(3)*fKJE_XA%9yuU9aZ!S>++F3;VC;VN=$ zgC2h;l3%r2DFUDFE9^el#-?!wXmrwd+jGxgEIV-n|}ge|epCzJ6SxdA?Lr zZytx#&4v1fcQ*RnfZu%$lYvNr6m0{YT>#G*A@y_hsNauE)_@XduTH4}WP;`0B`_LT0nNdzNl^?XwBi9iOj)$lg@Vev&Elm{Iaa z2>z76X8X41`=br1v7S?b&m+*uIIJHjtZL9JD}WabFH9lu=X#^K9xd?(7vJ3Y+sprs3><{soZUJPkhoBH35Y#NtxrvrC#(Oj zg>b3kAO3Sa=>MDFrR*kW3BR0>vRC_$7sdY_AkLx1CppU*AZA`VL2E$@ZUw^ry<@&5 zi{Up0WF5mL-Dcx~JKG0xbu4USUXm5UBq?O*>c*4jv{Y_;|5L38V!^RAqUU1=d*J4{ z!Ix&mj$k@0VQ|@@%^1{P)tpt!>bpMMHFv(=P$r;!CWg*6I?)k_@7nDB%hw2iDLt5$ zs!zh43Kg`-am)=WA1|no;RF9ddS^rcq&kLWos~XRKs~)S@bX#mO97Q(IO1fSmP#yP zuYBV6$u;W*DN1L~e$>zM8Ll>;Cfx(cH$sFC5LuZY|oH zBK3aZ&e@45x8s|e!)X@En3Xd@K>f{?@gt(w6ml&!x2|}Qu&}#+-tKVS@stvBU}*^5 zNF7t8%Jg@RTi$T*{}3!vYju_gW;_0X+PH5Q6}d}$AY$C0aJcg9%M{`LhPf620OS8v zHi?3;?s~znRlSXa?j}ZcH`K8PVdDp4b&uIDqBo`-lEWvbThj|F`?tZqA2}F~nys+y z^0(RnusmD*clHK9q-9wTLHEjISmLL1L(@PyKQm$i} z3&@2{T!jUSD1y(MV}sVcI;6jF?scTIt(CT^p%A@9Eh6^w^a_J5(ZtO=>>;S$DHHI< zO9Zq0;kgr9Q#Llb{Gn6-QqwP*Q&1V7 zD5kBejJV8wtv65<-Ms;y9)4HQ&@+WGjLkpZ4ttV|7H%$V zNtj7pO(Pt=+Sk7L4el&@0&*5_N&(Zw9y7I|lBy;8&e4_}rnYG8Xl5!DG|@Wn4nr22 zac~~5ZS#jDG!4~fcsBgQ0gpt<1=rQOoS>&2XZRPEH#NM&;l~A-M#&g8atV>3Mf<^$F7iQ<{^CRRydyb~ zWExv!ZdY4%(@YtV`95NNqT5=L4z>${1*&!ZM0bl44f&K?I5(7aFXbOYQ)>w+t35>G z`=TMvG-?F*kwIVIEnq8QIe@8iEM?pzKY zi-t;=7W?Q^b|C}g3FCHL@pZDNQhS|uJmJrSLQeX`Ga>I(RILG{{rfwf(BzvB=V2gi zuNW`$xmqYwkwlMk#&Ar)lKE1}5Hipi|L$kvV7vK5Da{ICY2BKQu zf1vfCn)IQP&A?fGl_Uz&zRuS%_Y~YNxXh0EvMtnECbT9 z-BVkz!RMu>zW;EA~p?O{qM$*Oil%b>Mo%oIEuY@zKHpKHiEi>)ktIfXw zMr^K#H2(3&>lE5L9*bx4z3ehK&?14`zvt+@go0D+nc#~i(nh@Ba$)aE6MZC;>Tf-_ zVv@#nd$5!_8)afb4~Rwf4~Dvex-@}%)KHPeTT(nM+3}rT8f2~&5Ozl608G_>o0r=)q7FDN4+boidv>{l~bUVsF%qx zM+%3MsRlYuJct*1SJmEPJXT`H3(rV)u>HHqH4W0ZBdasT&)Q|S*t5U Date: Tue, 23 Jun 2026 03:34:04 +0300 Subject: [PATCH 3/3] fix: use visualViewport instead of window.innerHeight when available --- .../client-scripts/screen-shooter/operations.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/browser/client-scripts/screen-shooter/operations.ts b/src/browser/client-scripts/screen-shooter/operations.ts index d46cb5ed4..ba6a5dbb2 100644 --- a/src/browser/client-scripts/screen-shooter/operations.ts +++ b/src/browser/client-scripts/screen-shooter/operations.ts @@ -48,6 +48,16 @@ export function computeScrollOffset(element: Element): Coord<"page", "css", "y"> } export function computeViewportSize(): Size<"css"> { + const visualViewport = window.visualViewport; + + // Visual viewport occasionally returns more correct values than innerWidth/Height, but may not be available in older browsers + if (visualViewport && visualViewport.width > 0 && visualViewport.height > 0) { + return { + width: visualViewport.width as Length<"css", "x">, + height: visualViewport.height as Length<"css", "y"> + }; + } + return { width: window.innerWidth as Length<"css", "x">, height: window.innerHeight as Length<"css", "y">