From b560f15bd6715125bb404f5569ac03ad2d63087e Mon Sep 17 00:00:00 2001 From: devjiangzhou Date: Tue, 4 Jul 2023 17:16:18 +0800 Subject: [PATCH 1/3] fix: checking for style updates of sibling nodes. --- webf/lib/src/css/query_selector.dart | 25 +++++++- webf/lib/src/dom/container_node.dart | 94 ++++++++++++++++++++++++++++ webf/lib/src/dom/element.dart | 15 +++++ 3 files changed, 132 insertions(+), 2 deletions(-) diff --git a/webf/lib/src/css/query_selector.dart b/webf/lib/src/css/query_selector.dart index 0305e68f61..2117789055 100644 --- a/webf/lib/src/css/query_selector.dart +++ b/webf/lib/src/css/query_selector.dart @@ -192,6 +192,9 @@ class SelectorEvaluator extends SelectorVisitor { // http://dev.w3.org/csswg/selectors-4/#the-first-child-pseudo case 'first-child': + if (_element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByFirstChildRules); + } if (_element!.previousElementSibling != null) { return _element!.previousElementSibling is HeadElement; } @@ -199,6 +202,9 @@ class SelectorEvaluator extends SelectorVisitor { // http://dev.w3.org/csswg/selectors-4/#the-last-child-pseudo case 'last-child': + if (_element!.nextSibling != null && _element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByLastChildRules); + } return _element!.nextSibling == null; //http://drafts.csswg.org/selectors-4/#first-of-type-pseudo @@ -218,14 +224,23 @@ class SelectorEvaluator extends SelectorVisitor { var isLast = index == children.length - 1; if (isFirst && node.name == 'first-of-type') { + if (_element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByForwardPositionalRules); + } return true; } if (isLast && node.name == 'last-of-type') { + if (_element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByBackwardPositionalRules); + } return true; } if (isFirst && isLast && node.name == 'only-of-type') { + if (_element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByFirstChildRules); + } return true; } @@ -235,8 +250,14 @@ class SelectorEvaluator extends SelectorVisitor { break; // http://dev.w3.org/csswg/selectors-4/#the-only-child-pseudo case 'only-child': - return _element!.previousSibling == null && _element!.nextSibling == null; - + if (_element!.parentElement != null) { + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByFirstChildRules); + _element!.parentElement!.addFlag(DynamicRestyleFlag.ChildrenAffectedByLastChildRules); + } + if (_element!.previousSibling == null && _element!.nextSibling == null) { + return true; + } + return false; // http://dev.w3.org/csswg/selectors-4/#link case 'link': return _element!.attributes['href'] != null; diff --git a/webf/lib/src/dom/container_node.dart b/webf/lib/src/dom/container_node.dart index 7193f756ba..e48e32ba44 100644 --- a/webf/lib/src/dom/container_node.dart +++ b/webf/lib/src/dom/container_node.dart @@ -10,6 +10,27 @@ import 'package:webf/src/dom/node_traversal.dart'; typedef InsertNodeHandler = void Function(ContainerNode container, Node child, Node? next); +enum DynamicRestyleFlag { + ChildrenAffectedByFirstChildRules, + ChildrenAffectedByLastChildRules, + ChildrenAffectedByDirectAdjacentRules, + ChildrenAffectedByForwardPositionalRules, + ChildrenAffectedByBackwardPositionalRules, +} + +extension StructuralRules on DynamicRestyleFlag { + bool childrenAffectedByStructuralRules() { + if (this == DynamicRestyleFlag.ChildrenAffectedByFirstChildRules || + this == DynamicRestyleFlag.ChildrenAffectedByLastChildRules || + this == DynamicRestyleFlag.ChildrenAffectedByDirectAdjacentRules || + this == DynamicRestyleFlag.ChildrenAffectedByForwardPositionalRules || + this == DynamicRestyleFlag.ChildrenAffectedByBackwardPositionalRules) { + return true; + } + return false; + } +} + bool collectChildrenAndRemoveFromOldParent(Node node, List nodes) { if (node is DocumentFragment) { getChildNodes(node, nodes); @@ -34,6 +55,15 @@ void getChildNodes(ContainerNode node, List nodes) { abstract class ContainerNode extends Node { ContainerNode(NodeType nodeType, [BindingContext? context]) : super(nodeType, context); + List? restyleFlags; + + void addFlag(DynamicRestyleFlag flag) { + restyleFlags ??= []; + if (restyleFlags?.contains(flag) == false) { + restyleFlags?.add(flag); + } + } + void _adoptAndAppendChild(ContainerNode container, Node child, Node? next) { child.parentOrShadowHostNode = this; if (lastChild != null) { @@ -333,6 +363,70 @@ abstract class ContainerNode extends Node { } } + void checkForSiblingStyleChanges(Element parent, bool isRemoved, Node? nodeBeforeChange, Node? nodeAfterChange) { + + if (!isRendererAttached) { + return; + } + + final elementBeforeChange = nodeBeforeChange as Element?; + final elementAfterChange = nodeAfterChange as Element?; + + // :first-child. In the parser callback case, we don't have to check anything, since we were right the first time. + // In the DOM case, we only need to do something if |afterChange| is not 0. + // |afterChange| is 0 in the parser case, so it works out that we'll skip this block. + if (elementAfterChange != null && + restyleFlags?.contains(DynamicRestyleFlag.ChildrenAffectedByFirstChildRules) == true) { + // Find our new first child. + final newFirstElement = parent.firstChild as Element?; + + // This is the insert/append case. + if (newFirstElement != elementAfterChange && elementAfterChange.isRendererAttached) { + elementAfterChange.recalculateStyle(); + } + + if (newFirstElement != null && isRemoved && newFirstElement == elementAfterChange) { + newFirstElement.recalculateStyle(); + } + } + + if (elementBeforeChange != null && + restyleFlags?.contains(DynamicRestyleFlag.ChildrenAffectedByLastChildRules) == true) { + // Find our new first child. + final newLastElement = parent.lastChild as Element?; + + // This is the insert/append case. + if (newLastElement != elementBeforeChange && elementBeforeChange.isRendererAttached) { + elementBeforeChange.recalculateStyle(); + } + + if (newLastElement != null && isRemoved && newLastElement == elementBeforeChange) { + newLastElement.recalculateStyle(); + } + } + + // The + selector. We need to invalidate the first element following the insertion point. It is the only possible element + // that could be affected by this DOM change. + if (restyleFlags?.contains(DynamicRestyleFlag.ChildrenAffectedByDirectAdjacentRules) == true && elementAfterChange != null) { + elementAfterChange.recalculateStyle(); + } + + // Forward positional selectors include the ~ selector, nth-child, nth-of-type, first-of-type and only-of-type. + // Backward positional selectors include nth-last-child, nth-last-of-type, last-of-type and only-of-type. + // We have to invalidate everything following the insertion point in the forward case, and everything before the insertion point in the + // backward case. + // |afterChange| is 0 in the parser callback case, so we won't do any work for the forward case if we don't have to. + // For performance reasons we just mark the parent node as changed, since we don't want to make childrenChanged O(n^2) by crawling all our kids + // here. recalcStyle will then force a walk of the children when it sees that this has happened. + if (elementAfterChange != null && + restyleFlags?.contains(DynamicRestyleFlag.ChildrenAffectedByForwardPositionalRules) == true) { + parent.recalculateStyle(); + } else if (elementBeforeChange != null && + restyleFlags?.contains(DynamicRestyleFlag.ChildrenAffectedByBackwardPositionalRules) == true) { + parent.recalculateStyle(); + } + } + Node? _firstChild; @override diff --git a/webf/lib/src/dom/element.dart b/webf/lib/src/dom/element.dart index d9bfd5184d..542c45cdf7 100644 --- a/webf/lib/src/dom/element.dart +++ b/webf/lib/src/dom/element.dart @@ -1184,6 +1184,20 @@ abstract class Element extends ContainerNode with ElementBase, ElementEventMixin } } + @override + void childrenChanged(ChildrenChange change) { + super.childrenChanged(change); + + if (change.byParser != ChildrenChangeSource.PARSER && change.isChildElementChange()) { + final changedElement = change.siblingChanged as Element?; + final removed = change.type == ChildrenChangeType.ELEMENT_REMOVED; + if (changedElement != null) { + checkForSiblingStyleChanges(this, removed, change.siblingBeforeChange, + change.siblingAfterChange); + } + } + } + void _updateNameMap(String? newName, {String? oldName}) { if (oldName != null && oldName.isNotEmpty) { final elements = ownerDocument.elementsByName[oldName]; @@ -1787,6 +1801,7 @@ abstract class Element extends ContainerNode with ElementBase, ElementEventMixin } void _applySheetStyle(CSSStyleDeclaration style) { + CSSStyleDeclaration matchRule = _elementRuleCollector.collectionFromRuleSet(ownerDocument.ruleSet, this); style.union(matchRule); } From 5db71c97dadb7c9ba78ad4e7555d19155fc4216f Mon Sep 17 00:00:00 2001 From: devjiangzhou Date: Wed, 2 Aug 2023 23:38:40 +0800 Subject: [PATCH 2/3] feat: spec test --- .../child-selectors.ts.3726a6511.png | Bin 0 -> 2861 bytes .../child-selectors.ts.3726a6512.png | Bin 0 -> 3206 bytes .../child-selectors.ts.3726a6513.png | Bin 0 -> 2906 bytes .../child-selectors.ts.5214bfb91.png | Bin 0 -> 2848 bytes .../child-selectors.ts.5214bfb92.png | Bin 0 -> 3189 bytes .../child-selectors.ts.5214bfb93.png | Bin 0 -> 3105 bytes .../css/css-selectors/child-selectors.ts | 89 ++++++++++++++++++ 7 files changed, 89 insertions(+) create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.3726a6511.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.3726a6512.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.3726a6513.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb91.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb92.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb93.png diff --git a/integration_tests/snapshots/css/css-selectors/child-selectors.ts.3726a6511.png b/integration_tests/snapshots/css/css-selectors/child-selectors.ts.3726a6511.png new file mode 100644 index 0000000000000000000000000000000000000000..8a5049a4fbbf21df6240897252ab2a0d76fe0404 GIT binary patch literal 2861 zcmeAS@N?(olHy`uVBq!ia0y~yV9a1(U~1rC1Bz^vdbAu!F%}28J29*~C-V}>VJUX< z4B-HR8jh3>1_rL{o-U3d6?5L+*_aiQDbet-evXS`R$^kZx<-e2!s5Aem$vryc8Div zRxoZeJE+tb4;Zf#fY);YR4Wr1a$W``?h+W60Gw2W^%JbV6oo=Bg| zCcF$qeP?YM80yt7Fa$F33aCPe$9kpBkF5+|er&S3|1-JtRK3_;CVBVw*`AwgZGKGR@!#LyldG$% zYySVMeRi^;Il?FVS4Hi{h@N(S`95}jxt_Ia*BTy^0IEpd8FS9&rvB<5V#m*&JGZ0y z`#bx(f1jV9FMN7x>c-u>t5;mVz20>1*@UIns*V=Exv}x%x3{-9?%ivh6I>ThqN<}djF zu{_?5nAK^X^?=Z*Onmzdt`eK0Ms+y!T$++LyU(+NCP{(#o&I>?lawQ~5b9 zCoiurdVAhkx%3AKYb>sv`TF|$@!jR`k97*GADe4kehlcn=W?7D3XO5f-{0St*N@*P zbJ?Uf`}(@x<^J=}*$REIzu|cP$p-sxtHam#g|Cn6&75_tTU`Ix^YionfBXduri#D6 zzAlU_w!ikpta+-Hk@X9pf_wMw-AP_^=H=z($0hdvGq?+M$oA_%A6aBCX#8t!r2azc z{|5OV`ejr}E6^0Tb;h#HS=Ag2b0)e2e)R54>Mv!GM$y zq3Lmyg5}K7kQfaKcriVi7)BGrXktJ#TSoH(mGZ+Yed)}-+n!jxKMQQ~GI+ZBxvXfC=xO3OuK4XkEZdMF7)al!g&fp?bfj!ez19t zv~??6Nh-Ez1kqL*66w^#DH0Epgh+xsH4@3bx7+@KU2i|-{mbhEybz@J(IJi+ADQ!K`Y04 zrMxF8I;8&I^35j986cmw1P1_pXSi|Hdja7;yc3w`EyBmrm*2d(sWQ`dV~`0)n%+Uo zf@r&h`n73|-R&x$yMIGZ9sHa&v3M0Xne;R-J(qc`q~~u>4^0LKsCbonm}36Rg5CL_ zTU*t;k171a?HSn$mf2TIeSzb%TInSRn;l^lcp8nyA5n4JZ4lbLwOh}2eVy)PG+l1? z`$VJB=*z_o2;GeguY*Dd(Fk6#o0`JJZA~1$inPi36VEFZ5HZN6?e+C_5=APNLNaGN zmY*u}VL5V-da+onKAeFFK-K{!lPSSjuVqn2pn_RqdtYB)Fm7{vSa&2EU@$_ZqZ-Lj zbm#|^;lt?;cv%r`a8R(fJRs9)q#Q1nJFMoni(IV|&{;^R%(z`IE1)8@`!7}tmy!p- zdQ_{+UchSfO8R;#L5(RYD&o^ta#1^q+{L(F)glT@1f8fD1-XKYC99Vx#RE_|ZL=mv zZr#>OBogVMoT15!c90SI9E(+cIOUzyX_ByY!`aR?kpow)?uo_hOi~3+5@*exfiPkA zen~AS-OBS~J7K{Hy;e4SwEI}(YLO6eKWN_A2Ih|)KA3QJc4oc4iWmVkvu`!Pp`f$- z9T#!vj0|!rlaQ@Lr^!mk`|nCX*Xe}gqdkdaw()9MFpr=S4@HLr2sk7XDwmFlC58kx z`z5zcx>c5wlNmHgf10PW9eFC~VEZHWtev7IQzU&$bK|1|k(J zy5Bt-SluK-$PASQs`N+b-focy1jX)xS}Wru;@Ryuhfv`lk5D%HcJq7nPB)1!VMsec zgNkBFVemw9QmcSeN%(1rfpo&7aO3stvl~?3g1o#ZlJnN=sYdTizS{c zE6jOmdrBB+E7Y@aD9B`EWW>LT_$L_u6?*E9DO^A=-n(z~(8SUG(mMm4Qbb{r%S-`X zT_2d4LK~y8)Y5UI_dQ<$aVM+{V6edO3JgIo%mTwWG;D~ N%xAGtVJUX< z4B-HR8jh3>1_o{xPZ!6KiaBrZ?(Mn~F4OSPIQdUPfa66s)`PBVwteOb*>J;JAZHI} z;I&iL0vkov90|%kc*{-4)sg$Hhzl#Lx~m6=r$@o&$(6>xZNv@!-#_&5=^M+>hBMDU z|IFxcuH+^&!-wlEQVL!R7#C58s*C!@&}}r+XPWJy`?JnJzx}Jq`tAGHxd-@AED8HI z>BDzESt}DWGqYp={{BAx_V)Jaw&xDbu`11q*;i9J$ELE#M{RQ9|9^i!zPPwJwVyTT zV#>Zn*I!RQnUa&2*Oz^LUGL2tvttsEe}8|Ue0^Q4_q;da-4)`;_f~&Dw$yw2u^PMo zZ)0WW+t&$|JozJbG*v$lKOFbB$oTnzjy8V-xZ>&wd@zrMbn zw47<%A;IHaI}08jx&gG`qU_C$8+Y!=JU>5Qo?qTB=3B%8u^lQglm5RtJt=N)m8stx z3&XPa_x7$m|2t57*O`QcZx)2#D6x`l=a(0A|1rOaZLib2dwZ?t*;bp~+h1?rCvR`J zE@r0@pPbE(OY`Togl6-WJ*%;k@0Yii6W5QExxcUW zHr%t;Y8OnqIlknWNvEHiBf0rz&YsH8X?yDaRz=VMn7`(QQFE)%3)PR^S_kY4Jvjta zFE9i$@lr}{-L(G|?}z$yc8X0xb literal 0 HcmV?d00001 diff --git a/integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb91.png b/integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb91.png new file mode 100644 index 0000000000000000000000000000000000000000..8d64421a956c61b8d032bfd6db41f13dab9ccf7c GIT binary patch literal 2848 zcmeAS@N?(olHy`uVBq!ia0y~yV9a1(U~1rC1Bz^vdbAu!F%}28J29*~C-V}>VJUX< z4B-HR8jh3>1_rKEo-U3d6?5L+S=belD|6ss`JC9+(B^|l!XihcH)L#<~HlFvn1mMgKrf$hH;Y3T(}u7Zz-I&MoHp)2?j4?79A%&pV3~&egXa&X2oSJmaW| z?_~ys=Qr*!Gkhp#;uTQ6zz|3sO1hYTgI4#^q<4bqtV>-gj2{l}j@dsgx7&CNTD8QC{n(|!?O`|C^Q9NX%$wc!`)KR-P^ePfK? z@spF)`M=iu-nwkMla8S?~Lhte}DgZTeboQroG4B-Q8^tbYt56dN#geV#j^L zfVThq^mOCy-PUGiX2*Vhetx{2U!D(c#Kej-?^f(AczCGd^Ru%z?%a{to_BYa?YRR7 zZ#;@HzP>(Q{{6kZ(&~P5B!Iyqd49hA{A!g44J=i?clOuU@2UA&eNd3Lo{ z-#rfePvEaoYyZ17es5Ljo~o}|K-suG6^3^8|Nh+m2n?o=zrMb9wtZf==4C3Ic4^AD z1NuFB8PKdNc)9U{SE#<;?-13F2F>$ zb;h#HS=Ag2|58vB33bxrs3}y+*rNeC8j#egBu3NHXj&RgOVq4Hsn>v`QQrK@pZs~- VgXEN@!1gZ#gQu&X%Q~loCID{54)6c~ literal 0 HcmV?d00001 diff --git a/integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb92.png b/integration_tests/snapshots/css/css-selectors/child-selectors.ts.5214bfb92.png new file mode 100644 index 0000000000000000000000000000000000000000..77c80d9b4db80ddf2a7e77e01e293324a969cf35 GIT binary patch literal 3189 zcmeHKX-wJ&6#v^2Yqjb+Q_VckMvcw1?VMJn#WIi8Vym{ct8=lab%GIXtR000MSoE&WymiG$X1`gQtqrOTyI(^#! z07v}ciE-D zf{%=dl6a+TSy@(ajt%;#qCj-x{1ujC0JUleu{GTP9YM>H@)xR5_h-vO-d%3 zs``!s!6Hu~`eW#6G%AC^z-xF$`G`9#%lLKoS;76E$ZM0oToPC;7Jri2vZoOUgR0!} zco|HDnf?;9@PY-^NfLaxGMo&L%52Gp#Ki2ZZkf&IH6b~|hl6OM|4{XP9)UpM?{5n} zL{(`tOadjrIEQA6xL5@ejYg+ZV#1jN7L!V?9`Doe`_vO|qoK_H&rxD(`^LrwgkVth zTP=HR4ksGJ-<9_!)iuw2(<0g*l*6i04G;XQ+WOSJ=(4ghY2*ZrVam7SXfBqu)@&pS zg(~UWc;1ZAApJ%wFg(3*7NrEQN&0Q+V3&vM@tZ@36mMTY)@sEt zaR-y%t7hc{gDMhYHwO=D$9yotp`jtDS@(w$tdKwrGkMz05qI%Jj}RnMZqh4X%3+RC zG)_#EglCkUn`UOy78e)s+pj|uHu`QFFFug(?`pAvlN{l%*XVK^589nolK6M@v^3VU z^IpR68AxXWTdNR%Fd=a`92GAorWo48CNy)hUJ3wTBQ%B!*NI>h6z22>>I_A8=koz4yu5N%m% zS4l9-`ff)Cb6i2I=1-z!k49$V2F!+e?Wk9_Fb!so#4S}Cp?fMe)}&kK-d=kHweD*} zc{0(QWWF)5tjO(fYd*QIuI>)0v>=rVg+x@lOnan3x6;JbR^**zO_QD%5KR& zZ`oPJFV}lXBae1US+jA|zJC&Wjy+(>csw3g!{0+{bJ}#&^QS10`VQvPacigE)9di9BSOQ!|J0V1p6+quS5Gq_VJUX< z4B-HR8jh3>1_tiao-U3d6?5L+H9T?ksoa5&_bd0VKPs))E5*VksL zNB1_f^PlS!R)2P&k$H23&a=qJUk4vCGGvay`K-V%b)r7?OV;ao9VCRa#ioue!pv3^5Q~H zZtmHI&h5_*wQ_IXyxDku&8L&Q+?n4UbbG(x|EaUH&4F&Q{d^<2-}XW0yDtjwn(Mw? zbbr46e%);Ox*v&r@^&@x>&v&BmCQWomHUP7*ZMa%H>cMDZ7%Kq=rG5wwkj=c->+Az zP5qhfbobh+{3&1VH+R!R(*N#=Jxjdy1!qqSH9o- z{hF;<0l(ZV2YJh)6uUnk4*vv()AOy@+R1@=2Zv8Py2G&-~Q}me>=Emc5BkJI8+$oM+4;^Km#??U-}m!b?cRHLZ(T@b)84wVz2*0}x3g#7epvN#>GXe(e@dI@tuei@ zy5P}~PHQ>+>8E$r{QR`%>$T|YSsXv=bKda%O8m|A8ugIU zc7ale*MjRu^j9(bKkX(j#Pnw_r-{Q92WA%vsoXc~tC;`Xz3E7?NfbI{R6C_nIU0ha qAvl_gDK8R7^U-KN8dmw}ukeB1Z=ZUM-`fM5`3#<}elF{r5}E+?p7kF9 literal 0 HcmV?d00001 diff --git a/integration_tests/specs/css/css-selectors/child-selectors.ts b/integration_tests/specs/css/css-selectors/child-selectors.ts index 35e45b56da..df60b7687c 100644 --- a/integration_tests/specs/css/css-selectors/child-selectors.ts +++ b/integration_tests/specs/css/css-selectors/child-selectors.ts @@ -304,4 +304,93 @@ describe('css child selector', () => { document.body.appendChild(p9); await snapshot(); }); + + fit("015", async () => { + const style = ( + + ); + const div =
; + const item1 =
1
; + const item2 =
2
; + div.appendChild(item1); + div.appendChild(item2); + document.head.appendChild(style); + document.body.appendChild(div); + await snapshot(); + + const item3 =
3
; + div.appendChild(item3); + await snapshot(0.5); + + div.removeChild(item2); + await snapshot(0.5); + }); + + + fit("016", async () => { + const style = ( + + ); + const div =
; + const item1 =
1
; + const item2 =
2
; + div.appendChild(item1); + div.appendChild(item2); + document.head.appendChild(style); + document.body.appendChild(div); + await snapshot(); + + const item3 =
3
; + div.appendChild(item3); + await snapshot(0.5); + + div.removeChild(item1); + await snapshot(0.5); + }); }); From 265135d74fe133ec80e381acd60155017bcb5ff5 Mon Sep 17 00:00:00 2001 From: devjiangzhou Date: Tue, 8 Aug 2023 22:26:01 +0800 Subject: [PATCH 3/3] feat: only-child --- .../child-selectors.ts.c51e455f1.png | Bin 0 -> 2779 bytes .../child-selectors.ts.c51e455f2.png | Bin 0 -> 2515 bytes .../css/css-selectors/child-selectors.ts | 44 +++++++++++++++++- 3 files changed, 42 insertions(+), 2 deletions(-) create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f1.png create mode 100644 integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f2.png diff --git a/integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f1.png b/integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f1.png new file mode 100644 index 0000000000000000000000000000000000000000..25fa5bba92fd97782246ed7ccc4e69c4ebf1449c GIT binary patch literal 2779 zcmeAS@N?(olHy`uVBq!ia0y~yV9a1(U~1rC1Bz^vdbAu!F%}28J29*~C-V}>VJUX< z4B-HR8jh3>1_rKHPZ!6KiaBrZ?(YgompJgSJZABO`G*c2^9vBjKj3C1 z^X{ni*IzR#JioAwo#DY}7AXa<1&oWRL-FNTH~jCtnsr;a=4MsxhWXpKd~Q|H&S=nR zWa|)uP(_nJWY4iOEq;6JOsB9hzkFWxto-MPT4&BSPd_*3=AVDBuAXUTH-3LFw_Gox z<7(C0vLEx-gc;lavnYOl@65*J+1Ksr=G?q_^Ic5+Pci?(H}B5f+4uM5Yk9jfF}qAY z|M_`PE`NW_Hk}6DzP}bF8PAS(pVj*G_I9rSXJA0u7ytXCcFn!-%%3lp&+yxyv8mef z_GE(Kng!oqy+6lT@9($g zF^M@YxVhW9-0b)J+xP0*S~ncs818-l(T<8j;b({2)6dPDTlx1_LjU%7y=bum$z^}G z7e7y%XM6jO!k)t9--RIc2dBsGwfg+&>6wd*jko8WwW-_lwll$yWmbLp_jhOX_vdUA zUKca-=g;T4{w&=|{8j6xZDX(f`RUC1{dsoZPfng`|L@0_zjyD>T<*{RZN~41n^GCy zIM%QITJ_oY(EF<=C(oY0`s$glum9Kl-+q6abVdY&_KUqyx8yg(-}>n^!4@SVpz%R2 z6}9&Izj|ATiJ~SBQyiFGI7g|`AQ(*rqZwheEEp{gM{9)PQ5#;FAKKpXNa>Zo4zPjB N;OXk;vd$@?2>{wJH+TR5 literal 0 HcmV?d00001 diff --git a/integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f2.png b/integration_tests/snapshots/css/css-selectors/child-selectors.ts.c51e455f2.png new file mode 100644 index 0000000000000000000000000000000000000000..a3c6144e58d45e41034775584d821aa32631bf67 GIT binary patch literal 2515 zcmeAS@N?(olHy`uVBq!ia0y~yV9a1(U~1rC1Bz^vdbAu!F%}28J29*~C-V}>VJUX< z4B-HR8jh3>1_sVrPZ!6KiaBp@8)k(BO0+#JR@X9G;yF=CxX-`*flRyts+d&m63gcnXAa*oZs7gA^7}+RyVy0hj5jP$ zokw9v=oX*b`Hh32?pYIChfqd?M&l?o8U&-MU^F9)mIb55;b@I8JZi&Ve5W{!W}G`Y SM-$jEWAJqKb6Mw<&;$Tyb0}^A literal 0 HcmV?d00001 diff --git a/integration_tests/specs/css/css-selectors/child-selectors.ts b/integration_tests/specs/css/css-selectors/child-selectors.ts index df60b7687c..895fec15d7 100644 --- a/integration_tests/specs/css/css-selectors/child-selectors.ts +++ b/integration_tests/specs/css/css-selectors/child-selectors.ts @@ -305,7 +305,7 @@ describe('css child selector', () => { await snapshot(); }); - fit("015", async () => { + it("015", async () => { const style = ( + ); + const div =
; + const item1 =
1
; + const item2 =
2
; + div.appendChild(item1); + div.appendChild(item2); + document.head.appendChild(style); + document.body.appendChild(div); + await snapshot(); + + div.removeChild(item2); + await snapshot(0.5); + }); });