From 2dd0ec7578cffdbfa669174eab60b793d4109a93 Mon Sep 17 00:00:00 2001 From: Sherry-hue <37186915+Sherry-hue@users.noreply.github.com> Date: Tue, 20 May 2025 18:06:15 +0800 Subject: [PATCH] fix(web): x-list should observe property list-type change. --- .changeset/shiny-eyes-follow.md | 9 ++++++ .../web-elements/src/XList/XListAttributes.ts | 2 -- .../web-elements/src/XList/XListWaterfall.ts | 22 ++++++++++---- .../web-elements/src/XList/x-list.css | 1 + .../web-tests/tests/web-elements.spec.ts | 28 ++++++++++++++++++ .../list-type-change/flow-chromium-linux.png | Bin 0 -> 2567 bytes .../list-type-change/flow-firefox-linux.png | Bin 0 -> 20719 bytes .../list-type-change/flow-webkit-linux.png | Bin 0 -> 6967 bytes .../list-type-change/index-chromium-linux.png | Bin 0 -> 2571 bytes .../list-type-change/index-firefox-linux.png | Bin 0 -> 20755 bytes .../list-type-change/index-webkit-linux.png | Bin 0 -> 7119 bytes .../single-chromium-linux.png | Bin 0 -> 2510 bytes .../list-type-change/single-firefox-linux.png | Bin 0 -> 18042 bytes .../list-type-change/single-webkit-linux.png | Bin 0 -> 6718 bytes .../waterfall-chromium-linux.png | Bin 0 -> 2571 bytes .../waterfall-firefox-linux.png | Bin 0 -> 20755 bytes .../waterfall-webkit-linux.png | Bin 0 -> 7119 bytes 17 files changed, 55 insertions(+), 7 deletions(-) create mode 100644 .changeset/shiny-eyes-follow.md create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-webkit-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-webkit-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-webkit-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-webkit-linux.png diff --git a/.changeset/shiny-eyes-follow.md b/.changeset/shiny-eyes-follow.md new file mode 100644 index 0000000000..2c7dab0fa3 --- /dev/null +++ b/.changeset/shiny-eyes-follow.md @@ -0,0 +1,9 @@ +--- +"@lynx-js/web-elements": patch +--- + +fix: x-list should observe property list-type change. + +Before this commit, list-type only works when it was first assigned. + +use `requestAnimationFrame` instead of `queueMicrotask` to layoutListItem, this is because it may cause crashes in webkit. diff --git a/packages/web-platform/web-elements/src/XList/XListAttributes.ts b/packages/web-platform/web-elements/src/XList/XListAttributes.ts index f299520e0f..8d91ce96f5 100644 --- a/packages/web-platform/web-elements/src/XList/XListAttributes.ts +++ b/packages/web-platform/web-elements/src/XList/XListAttributes.ts @@ -11,8 +11,6 @@ import { } from '@lynx-js/web-elements-reactive'; import type { XList } from './XList.js'; -const WATERFALL_SLOT = 'waterfall-slot'; - export class XListAttributes implements InstanceType> { diff --git a/packages/web-platform/web-elements/src/XList/XListWaterfall.ts b/packages/web-platform/web-elements/src/XList/XListWaterfall.ts index fd9a55fdc3..7eb40a131e 100644 --- a/packages/web-platform/web-elements/src/XList/XListWaterfall.ts +++ b/packages/web-platform/web-elements/src/XList/XListWaterfall.ts @@ -4,8 +4,8 @@ // LICENSE file in the root directory of this source tree. */ import { - boostedQueueMicrotask, genDomGetter, + registerAttributeHandler, type AttributeReactiveClass, } from '@lynx-js/web-elements-reactive'; import type { XList } from './XList.js'; @@ -16,7 +16,7 @@ const WATERFALL_STYLE = 'waterfall-style'; export class XListWaterfall implements InstanceType> { - static observedAttributes = []; + static observedAttributes = ['list-type']; #dom: XList; #getListContainer = genDomGetter(() => this.#dom.shadowRoot!, '#content'); @@ -182,7 +182,7 @@ export class XListWaterfall this.#resizeObserver = new ResizeObserver(() => { // may cause: Resizeobserver loop completed with undelivered notifications // https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver#observation_errors - boostedQueueMicrotask(() => { + requestAnimationFrame(() => { this.#layoutListItem( spanCount, isScrollVertical, @@ -194,8 +194,9 @@ export class XListWaterfall }); }; - connectedCallback() { - if (this.#dom.getAttribute('list-type') === 'waterfall') { + @registerAttributeHandler('list-type', true) + #handlerListType(newVal: string | null) { + if (newVal === 'waterfall') { const spanCount = parseFloat( this.#dom.getAttribute('span-count') || this.#dom.getAttribute('column-count') @@ -227,6 +228,17 @@ export class XListWaterfall childList: true, }); } + } else { + this.#resizeObserver?.disconnect(); + this.#resizeObserver = undefined; + this.#childrenObserver?.disconnect(); + this.#childrenObserver = undefined; + for (let i = 0; i < this.#dom.children.length; i++) { + const listItem = this.#dom.children[i] as HTMLElement; + listItem.removeAttribute('slot'); + } + this.#dom.shadowRoot?.querySelector(`slot[name=${WATERFALL_SLOT}]`) + ?.remove(); } } } diff --git a/packages/web-platform/web-elements/src/XList/x-list.css b/packages/web-platform/web-elements/src/XList/x-list.css index fab0e4241f..65efa7d210 100644 --- a/packages/web-platform/web-elements/src/XList/x-list.css +++ b/packages/web-platform/web-elements/src/XList/x-list.css @@ -59,6 +59,7 @@ list-item { display: none; content-visibility: auto; flex: 0 0 auto !important; + position: static; } x-list > list-item, x-list > lynx-wrapper > list-item { diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts b/packages/web-platform/web-tests/tests/web-elements.spec.ts index 324d876fb5..6f4a974226 100644 --- a/packages/web-platform/web-tests/tests/web-elements.spec.ts +++ b/packages/web-platform/web-tests/tests/web-elements.spec.ts @@ -2351,6 +2351,34 @@ test.describe('web-elements test suite', () => { await gotoWebComponentPage(page, title); await diffScreenShot(page, title, 'index'); }); + test('list-type-change', async ({ page }) => { + await gotoWebComponentPage(page, 'x-list/basic-waterfall'); + await diffScreenShot(page, 'x-list/list-type-change', 'index'); + await page.evaluate(() => { + document.querySelector('x-list')?.setAttribute( + 'list-type', + 'single', + ); + }); + await wait(100); + await diffScreenShot(page, 'x-list/list-type-change', 'single'); + await page.evaluate(() => { + document.querySelector('x-list')?.setAttribute( + 'list-type', + 'flow', + ); + }); + await wait(100); + await diffScreenShot(page, 'x-list/list-type-change', 'flow'); + await page.evaluate(() => { + document.querySelector('x-list')?.setAttribute( + 'list-type', + 'waterfall', + ); + }); + await wait(100); + await diffScreenShot(page, 'x-list/list-type-change', 'waterfall'); + }); }); test.describe('x-input', () => { test('placeholder', async ({ page }, { titlePath }) => { diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-chromium-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..6c2d74d59749ee960bf38525105ee32a37c4ac97 GIT binary patch literal 2567 zcmeAS@N?(olHy`uVBq!ia0y~yVC-aIV7ku11QhvxS^EQ!Vk{1FcVbv~PUa;81Lr|c z7srr_IdAVcb{%pMa0sma5cl}(myE|JtEPFS39xM3|8Q@pli5~|`HMIu+fOqtc$WQ@ zf#LrJwFMrt8t-o&@`%CiAKlgq+?;*LK*Kcp#8%?XD`4v)T$%gYEnAiLI z73Yr#l$2B?c24{3=NMZi>%@GfE_k{F6@sH2`h@|o!r7R?*HDcTH&X4VUkNh&+hC4V w>s*{sylx(2!s*ehjT9)O_3|)lj(p+%_*Z=U*@a7|09$qpp00i_>zopr03c{ywg3PC literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/flow-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..a634455b5ba63e1fbe8d8ef80f1c235ed56587d5 GIT binary patch literal 20719 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 literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..4bfd42f94a0a1d00cafaaed19cdc44b6d1746cbf GIT binary patch literal 20755 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%0D7bT;5<@zaA?DFKOTBC{_Tvc z_vcx2(B!-^&+%(8G#EL5U`6TK2Dd4X<40Gu@=!6z%E9@1Qe=d<4)V2R%jxG0JC@KN z>x?fSEf$Y&kc>B9hJD=-jZ<;g>9IR+a){BD6A$b0`FtHga zhv1xtkza^{V<5Qc)KyV%Bm}2b-Vz0;L-5-l!^HTXif}pR5)~y1;*MXkG5?e(_!$Jh z{D-aB(F}p$t}|hq8dNQZ;OogzF`{4y1UH;KC<;!1;LPgLqF^Tot~(qimeZ-2QS{go zHCGhG)xJc1Vv8t<`?G3x?RrtL2?UpH3lqDZatO|O6g6KI#E`Be^Y}_p5LvFOG0G7y zZaTYz6wi5UTq5qyRP4^N4w2);b&%hoi;M&@KHd)q;=NqpUux5anoj=REi_ zOyrJl@z?JV|8J0u?Iv6fKOp9u<=z(6*)0Sb7n_WHZ`tb?w*MZuQnhiN?a1QQW_)V{4dQBkKtC>F!PRgS5uREJIuQ;VqG(Ne@3N5 z8T4ppq~LbzHat$SYgOvakz#q-R(RP+^G}B*y;(L)e1h@o(Q#ozWYrrp#<5fV2~v+6 zZ;%F$I4as0&t{M8h#uLlZTd^vQ;ga-ZNwuAAA#_l8nrZdeBbeopF!Au)o&E8g7CZ$ zSMI|a2>A`Zmy=QRB%7%pOvY1ogfj)GI{C=iq$KGr4t`)WM*h>T!YH$^j%#_L|xJ zovS12mU_dAeWbn&>dRB@+3BTV*8(q0a1&Flus5iChqi#4B(+e7M~py;$^ z>ZPQ{6(-NFG{Gh^D6;I!7BG}yqdAQGFsEQKR!Nb`kf?RW;%G|+kEa-86 zn7ul&Bf0KEmAiZ6*veR<(@IS_V@b1h1}r*XEeZo+cHoSy++9Od2ZR0|a+A;L=g9}gFRfPh%bq7lrQ~7L(ui)ksMdhB2dp~t zR|CM><5`{Q?OVXw!`)6;Tx<6G9I*Ci7?&vR$#MOqMtiV~O77Dp{`!aZ|0wqVD|vym z|5#0Xs$GWF%B<{|-#O^=^48tG$UJz2^naxAkbNL@GC$k>=89=y5e7OKVI>Nnnw7ndB| z)AD3@T&c=naP91Vg@sD@+l?E{{-jMZxw;^~yScs=JshuG53@TrEvDI{kuR!yq!15EI{1uP()t%rKi#K z_}8Fzx3*?s8jTid%#+??SMR9%{d5TyTauT?QHL|$whr;MW~g8?620YM2B}x$?e9a) z29O$dga3)l8Z!A~eF!J_#muHmG~H&XB0F_ha_<&Jd4JOXQcC#l@+lHo{^?d(${! zamMy!6nnNNHLeWaQBMN6HnPv7ciSSaeF5oIw$p;b6Cs>i zu?O5|mRASDLjZSpEPW^K0C?zPFLr<`G;Q97kEJPoSHNLwyj&?A2)L}=M)XPiWnlghua1QK1Kw6{M(O&vT5;Bk-?dffRlVcOO$dJsc+*c_{8fua z=aLYPGbX=Nw<7x77p>L8Vddh?AinT(h@X7r#a~@$LQr(}EUptT_>R%_lBs2P;BS!T)sUQ=~Z#%>d#DpOh~(X*6{O%=115y@ZuM}8r+nH zDOJfrgJ(Q(s{h2FPBWrxBLtp9o9vrhTX*KP5^HGCyOE$$28>Xs+>2{ zZm&Y(ugX0{Sm)|dxvg-&k!I1`m%lBo?IlJ)yfUe9QC-!c2sgoLyQd-JLZ^c4gH}IJ zydo7Z^cvcqMfO6g?sgGO)Y0!3uXG&$SFW7@gf5tb#k9W21i-sa5uUtxs&wk+GQ556 zlPglm*7+Eu^8*>3lAVse<;vxA0i@oA#k9Udor9uf?L94Nwa#fV4R0R}xZ=-}jY_Ef z2}}*EyI7Xd**XVRI+EearK0Ynet^XuobzQbp!;#|ZwR@+MT}!F;0(<&e)2G-W{KEX zgCoPqwb-!km{41Hf6?N}-Fcf3wQN`+QGOaV#U)t;=k&MAIyhm3WDX?`u{J$U*)PHUG;Tc^oZUOdPlt1 zC+S-rHhKEg(5HqzHKf6!zI*wvb}#ylMQf<7k3D_ty+4uEM}$5i^bygJ1^U6$|Leh1 arQgjB``f+lWZO@`UxNn(1!VVEE&dmv3~1>9 literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-webkit-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/index-webkit-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..6f0f59cb361b6b6015f8d87db90b07ced5543c4e GIT binary patch literal 7119 zcmeHMZ%h+s7{5DOEv1A4g?14QcPHf_H|O>tBDf&L?gE@NP>uK^Oiw`+`uScXS^r zy4l*c7>5%)fjFe`8?prAbc%5s_>u|3=I~a|ZrLS@=qLum32P!Pvd#t!oR9zUhIX&K zd!UgQ*+R&R`d!~GTD`4v8;L9MG&QwsbSM;nIhag~?gh8@!|YuYS&^6sfHg5n`wyYi zDh9LVu(E-UXoxbzmuOnTUD*&@LW@58=na@~kLbMkT-#(~I#n-J+7B2@V8Sc7hfW=z zjTWcpLyBrLgJP%~jB&7QCJ50SMCab~4#&2f|bpt+ZcuShS!= zX}HJNbE6#eC~%H3nmcdnK!(1Lr=Q3*)aR`tmj-wH-+Oe}^o77u`2Od4_O;4VfZPu{ zIyLXQ0MX-kl8GqE29P#22qfP5dtJ%O>_JV>0*V4uj<94c@Ytt^M-{&J#&kdG^x4>l16L>u|l zv&W7@Fp}uZP~@KCf|XLph!zBG26PY*Gay#{#}r{ke(?9;kMCT0iYsf?f{@2|=K4BL zy7?f6e3cUtV~Z(Led(uCaInD8g5SN&sjrw8#pbx)0#!4>(BOWU0}v@ZiAHm$ISXo5 zDQL2E#IggFcMW_Itisw(SQnQT=kmhQ&p$0z27=}OPxmMeXZfWQ@uN*plAg(AWz}b| zX9HLlARr@J5VRTo*9Rf6tzqY}1oLtC_~W6Li-W-agq1ybv$~ zA^pAPK!I~+Q~cwxUbofScC|&N@vl4+a2g)S=cWIiHk!o}iFnudaV<#dD%4xoZoB$` zb5AkG+WON#)V^F+R@Y-H0KQDdJtJ-z^ak186gjF`Xa>esLHo}}D*l{o+^_$78mPM# zwiB_h0@imA5cByl7r=}Nly?3t2OwXAf@t$m6W3ydnl0uu3CMNOihT9qF972PdQO(@ z1LRTY6WsrHS`RSWDN>bxixY(;8YPHU5bZ&9ND$5Zmxv={dF?}mvf^};~vc=mTL2Kzg{4in87U2n07 zWC{l?LE~K9dFJ!pOu+~Dj(s-TMLnw_DSk9EM?i?4OO-qC+s#l@XpSq5fl}Y={U3H_ z@;`WXth5BLI_#+wclsTbLCesf07*W#vzonO>S!%9TDcD2BKQUKzW}~ZJ1?;x0yfYX NJYD@<);T3K0RUlYsPX^+ literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..5948552a04f35b3ede0aa4fd14c7771f874fa641 GIT binary patch literal 18042 zcmeHPYfKea5T4yG*M$OExeZdab&dEag$Sv|*5_LAfl(xtBBTOWjjOIwP`7>qF0H%Mo~$OfyhG)5lpO)s43VG@gVGacW3?4rp2oB>z>@* zbN0;4`DVVEo$Stp`1t{TBmDp%AZ|hIhX6io$Tx^K_H$utYZ8DAaj|m}v(s)io!IbY z!fV2u)AeP;3*V^=OW$>9)1`HGuK9LJ=Zvb3S$Tpe$%+ab?==YZiRU77mQ`3>>h%-V zH+jR|kLNpGDum3cTI;onwyvOLnbz;Wq9nIRLEEzI!&Xzu`L38oJ5+e0^Nl-WGaXA5 zXgTuhDg2}uo^NkBym-7>9I44JLHGLgQE1!lZ&i42)4HX;+Fo^u{}cpwZPCYz(9R=6 zWe9wuIni5Rk7qk)a@=RPJA>^=o&LU}8smxHL!uazMpmH%Mp!X881i7`jLmV4;tEB3 zA}$705Cq~~-pWgl}-C|~+D60EySe}1#cYNto zL>y#A4wqp^LB>e@Y>sOfWnm~OSb{pwySuP1Rk$92iix5mzACC$I|}Dvy(nyb)%s^%!r=)pbLIa_J&_HO=H1PbRp*rJApwVRva47XZaR-$T&b1Z8%y53ZYpZ^DIHp-p) z%RYmT>kny;1qzIwR(((huRh3SeN%1cA|_}O=rV-_W&5k$l4>zW2;;lzB+m7D>U0z@ zg-%wycrX!=I7%riwCw#MV-(iSQPzmnCjc&;e8<+hyEzjVLiUZ2psR%Sz3Flc4xB%# zkbJBv)BHcj-(!OI+5yQaC$M_X*~Xu7J;#xzK=C#nu#9I|QSQNS)wn2E&q_V_mH^Vf zs-!3op57RZH=M(a`Op`1z3YQXY^`fIF5|LMiZ{jmA68my`Ap7{SoYyVblu*tefRNhnQ!vpI(s;gfjoE!N z=+N6l1HJ$6UpZ4jMn9eOHqkqF(Ytj$1t+IOPKi2AG!jE-AT$sf2o2AuN0JCD5!RvZ zGZBD;Mo2MDSvkI literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-webkit-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/single-webkit-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..b6d01b1f97fea7dac48bf0f2a0a292dc57be7810 GIT binary patch literal 6718 zcmeAS@N?(olHy`uVBq!ia0y~yU~FSxV4A_f1{5jZ5aY>Ev zO!M_+&;qhK7#Q0#8CXC{fLIEM85o!sFfuR$X-1IP0w$O&W7`5|7@KJZNTKY8ifarE zk}Eu2978G?-`+ONiwzfY4cxS_u`)v{>U__;1@k!w+DU@%l~k z@2_7e2~zwglj;8ca^?MoYdSfB{7X!SCfMzN$|<0*f$7i&H8r4V9^4$xzy3^92b#sj zad_4YpjisK3Op}AN6%wmWYSjP$xdn|x?vG=!|6l8S7Oc=;_{YC&^H0*F742wy zVzdo5+SD9vQIGaQ2DY=czwFD`uYa#+XSsnYD^|w+h9c{7+<}#04X_H7Pxu)KWQwq~ zEG$U176NuNnHdv*Fr4lOG8X{lTeWXb1nQCpc0So7>ZX7VNYseA*$1pAe*h~?y91vV z1DP5e9L^6^<1-0h%#ET%hfbIs>ST4R;uI+-S&+rn%7!Fhg@@*ei-P8E NJYD@<);T3K0RYSdZ)yMl literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-chromium-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..ab63e8db70b4d0747486f6d1b8ecb2bda38cf0d5 GIT binary patch literal 2571 zcmeAS@N?(olHy`uVBq!ia0y~yVC-aIV7ku11QhvxS^EQ!Vk{1FcVbv~PUa;81Lsjs z7srr_Id5+{W*rKUa0`q-xi2ex*}65QsV@UKmtJVBHGeoKa851r&Oa?Zm%p+Ed^W3Q zIKaP!Q{$4_0*~1Zi&8&Vf6bb+Ut<5i#B1ySM;~JB`TY3iT^5l{;eaK+4in87U2lzY zM#F%Jbg<=&+<}R`pWm>)nYJ62yp(d8y5MOI%J~#)p}*yv+<|>P%hSt|Q(5l)*8bN^ z6dC;Q;7fQHzwQ3;wf2(0x6C`~`VSW1RXdt|@rC4Y3!RIbe%ij9+{R#2XpXPcy8Zsp z_0vlf-(22tHtvAq&e;vv5-Fr~9F@TrI*U@jG4$mCbA28DK)m1j*=hdto7^|1_TMJ4 wZZWx5I(IK)!s*cp315mHt)Yi@=zQVrN*6u2A;2~S*t%ozboFyt=akR{00od=EdT%j literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..4bfd42f94a0a1d00cafaaed19cdc44b6d1746cbf GIT binary patch literal 20755 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%0D7bT;5<@zaA?DFKOTBC{_Tvc z_vcx2(B!-^&+%(8G#EL5U`6TK2Dd4X<40Gu@=!6z%E9@1Qe=d<4)V2R%jxG0JC@KN z>x?fSEf$Y&kc>B9hJD=-jZ<;g>9IR+a){BD6A$b0`FtHga zhv1xtkza^{V<5Qc)KyV%Bm}2b-Vz0;L-5-l!^HTXif}pR5)~y1;*MXkG5?e(_!$Jh z{D-aB(F}p$t}|hq8dNQZ;OogzF`{4y1UH;KC<;!1;LPgLqF^Tot~(qimeZ-2QS{go zHCGhG)xJc1Vv8t<`?G3x?RrtL2?UpH3lqDZatO|O6g6KI#E`Be^Y}_p5LvFOG0G7y zZaTYz6wi5UTq5qyRP4^N4w2);b&%hoi;M&@KHd)q;=NqpUux5anoj=REi_ zOyrJl@z?JV|8J0u?Iv6fKOp9u<=z(6*)0Sb7n_WHZ`tb?w*MZuQnhiN?a1QQW_)V{4dQBkKtC>F!PRgS5uREJIuQ;VqG(Ne@3N5 z8T4ppq~LbzHat$SYgOvakz#q-R(RP+^G}B*y;(L)e1h@o(Q#ozWYrrp#<5fV2~v+6 zZ;%F$I4as0&t{M8h#uLlZTd^vQ;ga-ZNwuAAA#_l8nrZdeBbeopF!Au)o&E8g7CZ$ zSMI|a2>A`Zmy=QRB%7%pOvY1ogfj)GI{C=iq$KGr4t`)WM*h>T!YH$^j%#_L|xJ zovS12mU_dAeWbn&>dRB@+3BTV*8(q0a1&Flus5iChqi#4B(+e7M~py;$^ z>ZPQ{6(-NFG{Gh^D6;I!7BG}yqdAQGFsEQKR!Nb`kf?RW;%G|+kEa-86 zn7ul&Bf0KEmAiZ6*veR<(@IS_V@b1h1}r*XEeZo+cHoSy++9Od2ZR0|a+A;L=g9}gFRfPh%bq7lrQ~7L(ui)ksMdhB2dp~t zR|CM><5`{Q?OVXw!`)6;Tx<6G9I*Ci7?&vR$#MOqMtiV~O77Dp{`!aZ|0wqVD|vym z|5#0Xs$GWF%B<{|-#O^=^48tG$UJz2^naxAkbNL@GC$k>=89=y5e7OKVI>Nnnw7ndB| z)AD3@T&c=naP91Vg@sD@+l?E{{-jMZxw;^~yScs=JshuG53@TrEvDI{kuR!yq!15EI{1uP()t%rKi#K z_}8Fzx3*?s8jTid%#+??SMR9%{d5TyTauT?QHL|$whr;MW~g8?620YM2B}x$?e9a) z29O$dga3)l8Z!A~eF!J_#muHmG~H&XB0F_ha_<&Jd4JOXQcC#l@+lHo{^?d(${! zamMy!6nnNNHLeWaQBMN6HnPv7ciSSaeF5oIw$p;b6Cs>i zu?O5|mRASDLjZSpEPW^K0C?zPFLr<`G;Q97kEJPoSHNLwyj&?A2)L}=M)XPiWnlghua1QK1Kw6{M(O&vT5;Bk-?dffRlVcOO$dJsc+*c_{8fua z=aLYPGbX=Nw<7x77p>L8Vddh?AinT(h@X7r#a~@$LQr(}EUptT_>R%_lBs2P;BS!T)sUQ=~Z#%>d#DpOh~(X*6{O%=115y@ZuM}8r+nH zDOJfrgJ(Q(s{h2FPBWrxBLtp9o9vrhTX*KP5^HGCyOE$$28>Xs+>2{ zZm&Y(ugX0{Sm)|dxvg-&k!I1`m%lBo?IlJ)yfUe9QC-!c2sgoLyQd-JLZ^c4gH}IJ zydo7Z^cvcqMfO6g?sgGO)Y0!3uXG&$SFW7@gf5tb#k9W21i-sa5uUtxs&wk+GQ556 zlPglm*7+Eu^8*>3lAVse<;vxA0i@oA#k9Udor9uf?L94Nwa#fV4R0R}xZ=-}jY_Ef z2}}*EyI7Xd**XVRI+EearK0Ynet^XuobzQbp!;#|ZwR@+MT}!F;0(<&e)2G-W{KEX zgCoPqwb-!km{41Hf6?N}-Fcf3wQN`+QGOaV#U)t;=k&MAIyhm3WDX?`u{J$U*)PHUG;Tc^oZUOdPlt1 zC+S-rHhKEg(5HqzHKf6!zI*wvb}#ylMQf<7k3D_ty+4uEM}$5i^bygJ1^U6$|Leh1 arQgjB``f+lWZO@`UxNn(1!VVEE&dmv3~1>9 literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-webkit-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/list-type-change/waterfall-webkit-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..6f0f59cb361b6b6015f8d87db90b07ced5543c4e GIT binary patch literal 7119 zcmeHMZ%h+s7{5DOEv1A4g?14QcPHf_H|O>tBDf&L?gE@NP>uK^Oiw`+`uScXS^r zy4l*c7>5%)fjFe`8?prAbc%5s_>u|3=I~a|ZrLS@=qLum32P!Pvd#t!oR9zUhIX&K zd!UgQ*+R&R`d!~GTD`4v8;L9MG&QwsbSM;nIhag~?gh8@!|YuYS&^6sfHg5n`wyYi zDh9LVu(E-UXoxbzmuOnTUD*&@LW@58=na@~kLbMkT-#(~I#n-J+7B2@V8Sc7hfW=z zjTWcpLyBrLgJP%~jB&7QCJ50SMCab~4#&2f|bpt+ZcuShS!= zX}HJNbE6#eC~%H3nmcdnK!(1Lr=Q3*)aR`tmj-wH-+Oe}^o77u`2Od4_O;4VfZPu{ zIyLXQ0MX-kl8GqE29P#22qfP5dtJ%O>_JV>0*V4uj<94c@Ytt^M-{&J#&kdG^x4>l16L>u|l zv&W7@Fp}uZP~@KCf|XLph!zBG26PY*Gay#{#}r{ke(?9;kMCT0iYsf?f{@2|=K4BL zy7?f6e3cUtV~Z(Led(uCaInD8g5SN&sjrw8#pbx)0#!4>(BOWU0}v@ZiAHm$ISXo5 zDQL2E#IggFcMW_Itisw(SQnQT=kmhQ&p$0z27=}OPxmMeXZfWQ@uN*plAg(AWz}b| zX9HLlARr@J5VRTo*9Rf6tzqY}1oLtC_~W6Li-W-agq1ybv$~ zA^pAPK!I~+Q~cwxUbofScC|&N@vl4+a2g)S=cWIiHk!o}iFnudaV<#dD%4xoZoB$` zb5AkG+WON#)V^F+R@Y-H0KQDdJtJ-z^ak186gjF`Xa>esLHo}}D*l{o+^_$78mPM# zwiB_h0@imA5cByl7r=}Nly?3t2OwXAf@t$m6W3ydnl0uu3CMNOihT9qF972PdQO(@ z1LRTY6WsrHS`RSWDN>bxixY(;8YPHU5bZ&9ND$5Zmx