• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1 /*
2  * Copyright (c) 2021 Huawei Device Co., Ltd.
3  * Licensed under the Apache License, Version 2.0 (the "License");
4  * you may not use this file except in compliance with the License.
5  * You may obtain a copy of the License at
6  *
7  *     http://www.apache.org/licenses/LICENSE-2.0
8  *
9  * Unless required by applicable law or agreed to in writing, software
10  * distributed under the License is distributed on an "AS IS" BASIS,
11  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12  * See the License for the specific language governing permissions and
13  * limitations under the License.
14  */
15 
16 #include "gtest/gtest.h"
17 
18 #include "core/components/box/box_component.h"
19 #include "core/components/flex/flex_component.h"
20 #include "core/components/padding/padding_component.h"
21 #include "core/components/root/root_component.h"
22 #include "core/components/root/root_element.h"
23 #include "core/components/text/render_text.h"
24 #include "core/components/text/text_component.h"
25 #include "core/pipeline/base/composed_component.h"
26 #include "core/pipeline/base/composed_element.h"
27 
28 #include "core/components/test/json/json_frontend.h"
29 
30 using namespace testing;
31 using namespace testing::ext;
32 using namespace std;
33 
34 namespace OHOS::Ace {
35 
36 const ComposeId ROOT_COMPOSE_ID = "root";
37 const string ROOT_COMPOSE_NAME = "rootCompose";
38 
39 class NodeInfo {
40 public:
NodeInfo(const string & tag,int32_t depth,int32_t childrenNum)41     NodeInfo(const string& tag, int32_t depth, int32_t childrenNum)
42         : tag_(tag), depth_(depth), childrenNum_(childrenNum), data_()
43     {}
44 
NodeInfo(const string & tag,int32_t depth,int32_t childrenNum,string data)45     NodeInfo(const string& tag, int32_t depth, int32_t childrenNum, string data)
46         : tag_(tag), depth_(depth), childrenNum_(childrenNum), data_(data)
47     {}
48 
49     ~NodeInfo() = default;
50 
51 public:
52     string tag_;
53     int32_t depth_ = 0;
54     int32_t childrenNum_ = 0;
55     string data_;
56 };
57 
58 class ViewUpdateTest : public testing::Test {
59 public:
SetUpTestCase()60     static void SetUpTestCase() {}
TearDownTestCase()61     static void TearDownTestCase() {}
62     void SetUp();
63     void TearDown();
64 
65     void BuildEmptyTrees();
66     void BuildSingleChildTrees(const string& child, const string& textData = "");
67     void BuildMultipleChildrenTrees(const vector<string>& children, const vector<string>& textData = vector<string>());
68     void UpdateAndValidate();
69 
70     static void DumpElementTree(const RefPtr<Element>& element, int32_t depth, vector<NodeInfo>& treeInfo);
71     static void DumpRenderTree(const RefPtr<RenderNode>& renderNode, int32_t depth, vector<NodeInfo>& treeInfo);
72     static void PrintTreeInfo(const vector<NodeInfo>& treeInfo);
73     static bool IsTreeEqual(const vector<NodeInfo>& treeInfoA, const vector<NodeInfo>& treeInfoB);
74 
75 private:
76     RefPtr<ComposedElement> composedElement_;
77     RefPtr<RootElement> rootElement_;
78     RefPtr<RenderNode> rootRender_;
79 
80     RefPtr<ComposedComponent> newComposedComponent_;
81     vector<NodeInfo> newElementTree_;
82     vector<NodeInfo> newRenderTree_;
83 
84     RefPtr<PipelineContext> pipelineContext_;
85 };
86 
SetUp()87 void ViewUpdateTest::SetUp()
88 {
89     // setup component tree
90     RefPtr<ComposedComponent> rootCompose =
91         AceType::MakeRefPtr<ComposedComponent>(ROOT_COMPOSE_ID, ROOT_COMPOSE_NAME, nullptr);
92     RefPtr<RootComponent> rootComponent = AceType::MakeRefPtr<RootComponent>(rootCompose);
93 
94     auto platformWindow = PlatformWindow::Create(nullptr);
95     auto window = std::make_unique<Window>(std::move(platformWindow));
96     auto frontend = Frontend::CreateDefault();
97     pipelineContext_ = AceType::MakeRefPtr<PipelineContext>(
98         std::move(window), nullptr, nullptr, nullptr, frontend, 0);
99 
100     // setup element tree and render tree
101     rootElement_ = AceType::MakeRefPtr<RootElement>();
102     ASSERT_TRUE(rootElement_);
103     rootElement_->SetPipelineContext(pipelineContext_);
104     rootElement_->SetNewComponent(rootComponent);
105     rootElement_->Mount(nullptr);
106     ASSERT_FALSE(rootElement_->GetChildren().empty());
107     composedElement_ = AceType::DynamicCast<ComposedElement>(rootElement_->GetChildren().front());
108     ASSERT_TRUE(composedElement_);
109     rootRender_ = rootElement_->GetRenderNode();
110     ASSERT_TRUE(rootRender_);
111 }
112 
TearDown()113 void ViewUpdateTest::TearDown()
114 {
115     rootElement_ = nullptr;
116     composedElement_ = nullptr;
117     rootRender_ = nullptr;
118 
119     newComposedComponent_ = nullptr;
120     newElementTree_.clear();
121     newRenderTree_.clear();
122 }
123 
DumpElementTree(const RefPtr<Element> & element,int32_t depth,vector<NodeInfo> & treeInfo)124 void ViewUpdateTest::DumpElementTree(const RefPtr<Element>& element, int32_t depth, vector<NodeInfo>& treeInfo)
125 {
126     const list<RefPtr<Element>>& children = element->GetChildren();
127     treeInfo.emplace_back(AceType::TypeName(element), depth, children.size());
128     for (const auto& item : children) {
129         DumpElementTree(item, depth + 1, treeInfo);
130     }
131 }
132 
DumpRenderTree(const RefPtr<RenderNode> & renderNode,int32_t depth,vector<NodeInfo> & treeInfo)133 void ViewUpdateTest::DumpRenderTree(const RefPtr<RenderNode>& renderNode, int32_t depth, vector<NodeInfo>& treeInfo)
134 {
135     const list<RefPtr<RenderNode>>& children = renderNode->GetChildren();
136     RefPtr<RenderText> renderText = AceType::DynamicCast<RenderText>(renderNode);
137     if (renderText) {
138         treeInfo.emplace_back(AceType::TypeName(renderNode), depth, children.size(), renderText->GetTextData());
139     } else {
140         treeInfo.emplace_back(AceType::TypeName(renderNode), depth, children.size());
141     }
142     for (const auto& item : children) {
143         DumpRenderTree(item, depth + 1, treeInfo);
144     }
145 }
146 
PrintTreeInfo(const vector<NodeInfo> & treeInfo)147 void ViewUpdateTest::PrintTreeInfo(const vector<NodeInfo>& treeInfo)
148 {
149     for (const auto& node : treeInfo) {
150         ostringstream nodeInfo;
151         nodeInfo << "[" << node.depth_ << "]\t[" << node.childrenNum_ << "]\t[" << node.tag_;
152         if (node.data_.empty()) {
153             nodeInfo << "]";
154         } else {
155             nodeInfo << "]\t[" << node.data_ << "]";
156         }
157         GTEST_LOG_(INFO) << nodeInfo.str();
158     }
159 }
160 
IsTreeEqual(const vector<NodeInfo> & treeInfoA,const vector<NodeInfo> & treeInfoB)161 bool ViewUpdateTest::IsTreeEqual(const vector<NodeInfo>& treeInfoA, const vector<NodeInfo>& treeInfoB)
162 {
163     if (treeInfoA.size() != treeInfoB.size()) {
164         return false;
165     }
166     for (size_t i = 0; i < treeInfoA.size(); ++i) {
167         if (treeInfoA[i].tag_ != treeInfoB[i].tag_ ||
168             treeInfoA[i].depth_ != treeInfoB[i].depth_ ||
169             treeInfoA[i].childrenNum_ != treeInfoB[i].childrenNum_ ||
170             treeInfoA[i].data_ != treeInfoB[i].data_) {
171             return false;
172         }
173     }
174     return true;
175 }
176 
BuildEmptyTrees()177 void ViewUpdateTest::BuildEmptyTrees()
178 {
179     newElementTree_.clear();
180     newElementTree_.emplace_back("RootElement", 0, 1);
181     newElementTree_.emplace_back("ComposedElement", 1, 0);
182 
183     newRenderTree_.clear();
184     newRenderTree_.emplace_back("FlutterRenderRoot", 0, 0);
185 
186     newComposedComponent_ = AceType::MakeRefPtr<ComposedComponent>(ROOT_COMPOSE_ID, ROOT_COMPOSE_NAME, nullptr);
187 };
188 
BuildSingleChildTrees(const string & child,const string & textData)189 void ViewUpdateTest::BuildSingleChildTrees(const string& child, const string& textData)
190 {
191     newElementTree_.clear();
192     newElementTree_.emplace_back("RootElement", 0, 1);
193     newElementTree_.emplace_back("ComposedElement", 1, 1);
194 
195     newRenderTree_.clear();
196     newRenderTree_.emplace_back("FlutterRenderRoot", 0, 1);
197 
198     RefPtr<Component> childComponent;
199     if (child == "text") {
200         childComponent = AceType::MakeRefPtr<TextComponent>(textData);
201         newElementTree_.emplace_back("TextElement", 2, 0);
202         newRenderTree_.emplace_back("FlutterRenderText", 1, 0, textData);
203     } else if (child == "box") {
204         childComponent = AceType::MakeRefPtr<BoxComponent>();
205         newElementTree_.emplace_back("BoxElement", 2, 0);
206         newRenderTree_.emplace_back("FlutterRenderBox", 1, 0);
207     } else if (child == "padding") {
208         childComponent = AceType::MakeRefPtr<PaddingComponent>();
209         newElementTree_.emplace_back("PaddingElement", 2, 0);
210         newRenderTree_.emplace_back("FlutterRenderPadding", 1, 0);
211     }
212     newComposedComponent_ = AceType::MakeRefPtr<ComposedComponent>(ROOT_COMPOSE_ID, ROOT_COMPOSE_NAME, childComponent);
213 }
214 
BuildMultipleChildrenTrees(const vector<string> & children,const vector<string> & textData)215 void ViewUpdateTest::BuildMultipleChildrenTrees(const vector<string>& children, const vector<string>& textData)
216 {
217     size_t textChildrenNum = count(children.begin(), children.end(), "text");
218     ASSERT_EQ(textChildrenNum, textData.size());
219 
220     newElementTree_.clear();
221     newElementTree_.emplace_back("RootElement", 0, 1);
222     newElementTree_.emplace_back("ComposedElement", 1, 1);
223     newElementTree_.emplace_back("RowElement", 2, children.size());
224 
225     newRenderTree_.clear();
226     newRenderTree_.emplace_back("FlutterRenderRoot", 0, 1);
227     newRenderTree_.emplace_back("RenderFlex", 1, children.size());
228 
229     std::list<RefPtr<Component>> rowChildren;
230     size_t textId = 0;
231     for (const auto& node : children) {
232         if (node == "text") {
233             rowChildren.emplace_back(AceType::MakeRefPtr<TextComponent>(textData.at(textId)));
234             newElementTree_.emplace_back("TextElement", 3, 0);
235             newRenderTree_.emplace_back("FlutterRenderText", 2, 0, textData.at(textId));
236             ++textId;
237         } else if (node == "box") {
238             rowChildren.emplace_back(AceType::MakeRefPtr<BoxComponent>());
239             newElementTree_.emplace_back("BoxElement", 3, 0);
240             newRenderTree_.emplace_back("FlutterRenderBox", 2, 0);
241         } else if (node == "padding") {
242             rowChildren.emplace_back(AceType::MakeRefPtr<PaddingComponent>());
243             newElementTree_.emplace_back("PaddingElement", 3, 0);
244             newRenderTree_.emplace_back("FlutterRenderPadding", 2, 0);
245         }
246     }
247     RefPtr<RowComponent> rowComponent =
248         AceType::MakeRefPtr<RowComponent>(FlexAlign::CENTER, FlexAlign::CENTER, rowChildren);
249     newComposedComponent_ = AceType::MakeRefPtr<ComposedComponent>(ROOT_COMPOSE_ID, ROOT_COMPOSE_NAME, rowComponent);
250 }
251 
UpdateAndValidate()252 void ViewUpdateTest::UpdateAndValidate()
253 {
254     vector<NodeInfo> elementTreeInfo;
255     vector<NodeInfo> renderTreeInfo;
256     composedElement_->SetNewComponent(newComposedComponent_);
257     composedElement_->Rebuild();
258     DumpElementTree(rootElement_, 0, elementTreeInfo);
259     DumpRenderTree(rootRender_, 0, renderTreeInfo);
260 
261     ASSERT_TRUE(IsTreeEqual(elementTreeInfo, newElementTree_));
262     ASSERT_TRUE(IsTreeEqual(renderTreeInfo, newRenderTree_));
263 }
264 
265 /**
266  * @tc.name: ViewUpdateTest001
267  * @tc.desc: View Updates caused by adding components.
268  * @tc.type: FUNC
269  */
270 HWTEST_F(ViewUpdateTest, ViewUpdateTest001, TestSize.Level1)
271 {
272     GTEST_LOG_(INFO) << "ViewUpdateTest001";
273 
274     /**
275      * @tc.steps: step1. Build a composed component tree containing only one TextComponent, update and check results.
276      * @tc.expected: step1. Element tree and render tree are the same as expected.
277      */
278     BuildSingleChildTrees("text", "text data");
279     UpdateAndValidate();
280 }
281 
282 /**
283  * @tc.name: ViewUpdateTest002
284  * @tc.desc: View Updates caused by adding components.
285  * @tc.type: FUNC
286  */
287 HWTEST_F(ViewUpdateTest, ViewUpdateTest002, TestSize.Level1)
288 {
289     GTEST_LOG_(INFO) << "ViewUpdateTest002";
290     vector<string> children;
291     vector<string> textData;
292 
293     /**
294      * @tc.steps: step1. Build a composed component tree containing a Row Component, update and check results.
295      * @tc.expected: step1. Element tree and render tree are the same as expected.
296      */
297     children.emplace_back("text");
298     children.emplace_back("text");
299     textData.emplace_back("first text");
300     textData.emplace_back("second text");
301     BuildMultipleChildrenTrees(children, textData);
302     UpdateAndValidate();
303 }
304 
305 /**
306  * @tc.name: ViewUpdateTest003
307  * @tc.desc: View Updates caused by adding components.
308  * @tc.type: FUNC
309  */
310 HWTEST_F(ViewUpdateTest, ViewUpdateTest003, TestSize.Level1)
311 {
312     GTEST_LOG_(INFO) << "ViewUpdateTest003";
313     vector<string> children;
314     vector<string> textData;
315 
316     /**
317      * @tc.steps: step1. Build a composed component tree containing a Row Component with two children,
318      * update and check results.
319      * @tc.expected: step1. Element tree and render tree are the same as expected.
320      */
321     children.emplace_back("text");
322     children.emplace_back("text");
323     textData.emplace_back("first text");
324     textData.emplace_back("second text");
325     BuildMultipleChildrenTrees(children, textData);
326     UpdateAndValidate();
327 
328     /**
329      * @tc.steps: step2. Build a composed component tree containing a Row Component with three children,
330      * update and check results.
331      * @tc.expected: step2. New elements are correctly added into element tree,
332      * and new render objects are correctly added into render tree.
333      */
334     children.clear();
335     textData.clear();
336     children.emplace_back("text");
337     children.emplace_back("text");
338     children.emplace_back("text");
339     textData.emplace_back("first text");
340     textData.emplace_back("second text");
341     textData.emplace_back("third text");
342     BuildMultipleChildrenTrees(children, textData);
343     UpdateAndValidate();
344 }
345 
346 /**
347  * @tc.name: ViewUpdateTest004
348  * @tc.desc: View Updates caused by deleting components.
349  * @tc.type: FUNC
350  */
351 HWTEST_F(ViewUpdateTest, ViewUpdateTest004, TestSize.Level1)
352 {
353     GTEST_LOG_(INFO) << "ViewUpdateTest004";
354 
355     /**
356      * @tc.steps: step1. Build a composed component tree containing only one TextComponent, update and check results.
357      * @tc.expected: step1. Element tree and render tree are the same as expected.
358      */
359     BuildSingleChildTrees("text", "text data");
360     UpdateAndValidate();
361 
362     /**
363      * @tc.steps: step2. Build an empty composed component tree, update and check results.
364      * @tc.expected: step2. TextElement is removed form element tree and RenderText is removed from render tree.
365      */
366     BuildEmptyTrees();
367     UpdateAndValidate();
368 }
369 
370 /**
371  * @tc.name: ViewUpdateTest005
372  * @tc.desc: View Updates caused by deleting components.
373  * @tc.type: FUNC
374  */
375 HWTEST_F(ViewUpdateTest, ViewUpdateTest005, TestSize.Level1)
376 {
377     GTEST_LOG_(INFO) << "ViewUpdateTest005";
378     vector<string> children;
379     vector<string> textData;
380 
381     /**
382      * @tc.steps: step1. Build a composed component tree containing a Row Component with three children,
383      * update and check results.
384      * @tc.expected: step1. Element tree and render tree are the same as expected.
385      */
386     children.emplace_back("text");
387     children.emplace_back("text");
388     children.emplace_back("text");
389     textData.emplace_back("first text");
390     textData.emplace_back("second text");
391     textData.emplace_back("third text");
392     BuildMultipleChildrenTrees(children, textData);
393     UpdateAndValidate();
394 
395     /**
396      * @tc.steps: step2. Build an empty composed component tree, update and check results.
397      * @tc.expected: step2. All TextElement is removed form element tree and All RenderText is removed from render tree.
398      */
399     BuildEmptyTrees();
400     UpdateAndValidate();
401 }
402 
403 /**
404  * @tc.name: ViewUpdateTest006
405  * @tc.desc: View Updates caused by deleting components.
406  * @tc.type: FUNC
407  */
408 HWTEST_F(ViewUpdateTest, ViewUpdateTest006, TestSize.Level1)
409 {
410     GTEST_LOG_(INFO) << "ViewUpdateTest006";
411     vector<string> children;
412     vector<string> textData;
413 
414     /**
415      * @tc.steps: step1. Build a composed component tree containing a Row Component with three children,
416      * update and check results.
417      * @tc.expected: step1. Element tree and render tree are the same as expected.
418      */
419     children.emplace_back("text");
420     children.emplace_back("text");
421     children.emplace_back("text");
422     textData.emplace_back("first text");
423     textData.emplace_back("second text");
424     textData.emplace_back("third text");
425     BuildMultipleChildrenTrees(children, textData);
426     UpdateAndValidate();
427 
428     /**
429      * @tc.steps: step2. Build a composed component tree containing a Row Component with two children,
430      * update and check results.
431      * @tc.expected: step2. One TextElement is removed form element tree and One RenderText is removed from render tree.
432      */
433     children.clear();
434     textData.clear();
435     children.emplace_back("text");
436     children.emplace_back("text");
437     textData.emplace_back("first text");
438     textData.emplace_back("second text");
439     BuildMultipleChildrenTrees(children, textData);
440     UpdateAndValidate();
441 }
442 
443 /**
444  * @tc.name: ViewUpdateTest007
445  * @tc.desc: View Updates caused by updating components.
446  * @tc.type: FUNC
447  */
448 HWTEST_F(ViewUpdateTest, ViewUpdateTest007, TestSize.Level1)
449 {
450     GTEST_LOG_(INFO) << "ViewUpdateTest007";
451 
452     /**
453      * @tc.steps: step1. Build a composed component tree containing only one TextComponent which content is "text data",
454      * update and check results.
455      * @tc.expected: step1. Element tree and render tree are the same as expected.
456      */
457     BuildSingleChildTrees("text", "text data");
458     UpdateAndValidate();
459 
460     /**
461      * @tc.steps: step2. Build a composed component tree containing only one TextComponent which content is "updated
462      * text data", update and check results.
463      * @tc.expected: step2. Content of RenderText is changed as expected.
464      */
465     BuildSingleChildTrees("text", "updated text data");
466     UpdateAndValidate();
467 }
468 
469 /**
470  * @tc.name: ViewUpdateTest008
471  * @tc.desc: View Updates caused by updating components.
472  * @tc.type: FUNC
473  */
474 HWTEST_F(ViewUpdateTest, ViewUpdateTest008, TestSize.Level1)
475 {
476     GTEST_LOG_(INFO) << "ViewUpdateTest008";
477 
478     /**
479      * @tc.steps: step1. Build a composed component tree containing only one TextComponent which content is "text data",
480      * update and check results.
481      * @tc.expected: step1. Element tree and render tree are the same as expected.
482      */
483     BuildSingleChildTrees("text", "text data");
484     UpdateAndValidate();
485 
486     /**
487      * @tc.steps: step2. Build a composed component tree containing one BoxComponent, update and check results.
488      * @tc.expected: step2. Elements in element tree and render objects in render tree are changed as expected.
489      */
490     BuildSingleChildTrees("box");
491     UpdateAndValidate();
492 }
493 
494 /**
495  * @tc.name: ViewUpdateTest009
496  * @tc.desc: View Updates caused by updating components.
497  * @tc.type: FUNC
498  */
499 HWTEST_F(ViewUpdateTest, ViewUpdateTest009, TestSize.Level1)
500 {
501     GTEST_LOG_(INFO) << "ViewUpdateTest009";
502     vector<string> children;
503     vector<string> textData;
504 
505     /**
506      * @tc.steps: step1. Build a composed component tree containing a Row Component with five children, all of them are
507      * Text Component. The content of these child nodes as follows:
508      * "first text" | "second text" | "third text" | "fourth text" | "fifth text"
509      * update and check results.
510      * @tc.expected: step1. Element tree and render tree are the same as expected.
511      */
512     children.emplace_back("text");
513     children.emplace_back("text");
514     children.emplace_back("text");
515     children.emplace_back("text");
516     children.emplace_back("text");
517     textData.emplace_back("first text");
518     textData.emplace_back("second text");
519     textData.emplace_back("third text");
520     textData.emplace_back("fourth text");
521     textData.emplace_back("fifth text");
522     BuildMultipleChildrenTrees(children, textData);
523     UpdateAndValidate();
524 
525     /**
526      * @tc.steps: step2. Build a composed component tree containing a Row Component with five children, all of them are
527      * Text Component. The content of these child nodes as follows:
528      * "first text" | "updated second text" | "third text" | "fourth text" | "fifth text"
529      * update and check results.
530      * @tc.expected: step2. Element tree and render tree are the same as expected.
531      */
532     children.clear();
533     textData.clear();
534     children.emplace_back("text");
535     children.emplace_back("text");
536     children.emplace_back("text");
537     children.emplace_back("text");
538     children.emplace_back("text");
539     textData.emplace_back("first text");
540     textData.emplace_back("updated second text");
541     textData.emplace_back("third text");
542     textData.emplace_back("fourth text");
543     textData.emplace_back("fifth text");
544     BuildMultipleChildrenTrees(children, textData);
545     UpdateAndValidate();
546 }
547 
548 /**
549  * @tc.name: ViewUpdateTest010
550  * @tc.desc: View Updates caused by updating components.
551  * @tc.type: FUNC
552  */
553 HWTEST_F(ViewUpdateTest, ViewUpdateTest010, TestSize.Level1)
554 {
555     GTEST_LOG_(INFO) << "ViewUpdateTest010";
556     vector<string> children;
557     vector<string> textData;
558 
559     /**
560      * @tc.steps: step1. Build a composed component tree containing a Row Component with five children, all of them are
561      * Text Component. The content of these child nodes as follows:
562      * "first text" | "second text" | "third text" | "fourth text" | "fifth text"
563      * update and check results.
564      * @tc.expected: step1. Element tree and render tree are the same as expected.
565      */
566     children.emplace_back("text");
567     children.emplace_back("text");
568     children.emplace_back("text");
569     children.emplace_back("text");
570     children.emplace_back("text");
571     textData.emplace_back("first text");
572     textData.emplace_back("second text");
573     textData.emplace_back("third text");
574     textData.emplace_back("fourth text");
575     textData.emplace_back("fifth text");
576     BuildMultipleChildrenTrees(children, textData);
577     UpdateAndValidate();
578 
579     /**
580      * @tc.steps: step2. Build a composed component tree containing a Row Component with five children, all of them are
581      * Text Component. The content of these child nodes as follows:
582      * "first text" | "updated second text" | "third text" | "updated fourth text" | "fifth text"
583      * update and check results.
584      * @tc.expected: step2. Element tree and render tree are the same as expected.
585      */
586     children.clear();
587     textData.clear();
588     children.emplace_back("text");
589     children.emplace_back("text");
590     children.emplace_back("text");
591     children.emplace_back("text");
592     children.emplace_back("text");
593     textData.emplace_back("first text");
594     textData.emplace_back("updated second text");
595     textData.emplace_back("third text");
596     textData.emplace_back("updated fourth text");
597     textData.emplace_back("fifth text");
598     BuildMultipleChildrenTrees(children, textData);
599     UpdateAndValidate();
600 }
601 
602 /**
603  * @tc.name: ViewUpdateTest011
604  * @tc.desc: View Updates caused by updating components.
605  * @tc.type: FUNC
606  */
607 HWTEST_F(ViewUpdateTest, ViewUpdateTest011, TestSize.Level1)
608 {
609     GTEST_LOG_(INFO) << "ViewUpdateTest011";
610     vector<string> children;
611     vector<string> textData;
612 
613     /**
614      * @tc.steps: step1. Build a composed component tree containing a Row Component with five children, all of them are
615      * Text Component.
616      * @tc.expected: step1. Element tree and render tree are the same as expected.
617      */
618     children.emplace_back("text");
619     children.emplace_back("text");
620     children.emplace_back("text");
621     children.emplace_back("text");
622     children.emplace_back("text");
623     textData.emplace_back("first text");
624     textData.emplace_back("second text");
625     textData.emplace_back("third text");
626     textData.emplace_back("fourth text");
627     textData.emplace_back("fifth text");
628     BuildMultipleChildrenTrees(children, textData);
629     UpdateAndValidate();
630 
631     /**
632      * @tc.steps: step2. Build a composed component tree containing a Row Component with five children, four of them are
633      * Text Component and one is Box Component.
634      * @tc.expected: step2. Element tree and render tree are the same as expected.
635      */
636     children.clear();
637     textData.clear();
638     children.emplace_back("text");
639     children.emplace_back("box");
640     children.emplace_back("text");
641     children.emplace_back("text");
642     children.emplace_back("text");
643     textData.emplace_back("first text");
644     textData.emplace_back("third text");
645     textData.emplace_back("fourth text");
646     textData.emplace_back("fifth text");
647     BuildMultipleChildrenTrees(children, textData);
648     UpdateAndValidate();
649 }
650 
651 /**
652  * @tc.name: ViewUpdateTest012
653  * @tc.desc: View Updates caused by updating components.
654  * @tc.type: FUNC
655  */
656 HWTEST_F(ViewUpdateTest, ViewUpdateTest012, TestSize.Level1)
657 {
658     GTEST_LOG_(INFO) << "ViewUpdateTest012";
659     vector<string> children;
660     vector<string> textData;
661 
662     /**
663      * @tc.steps: step1. Build a composed component tree containing a Row Component with five children, all of them are
664      * Text Component.
665      * @tc.expected: step1. Element tree and render tree are the same as expected.
666      */
667     children.emplace_back("text");
668     children.emplace_back("text");
669     children.emplace_back("text");
670     children.emplace_back("text");
671     children.emplace_back("text");
672     textData.emplace_back("first text");
673     textData.emplace_back("second text");
674     textData.emplace_back("third text");
675     textData.emplace_back("fourth text");
676     textData.emplace_back("fifth text");
677     BuildMultipleChildrenTrees(children, textData);
678     UpdateAndValidate();
679 
680     /**
681      * @tc.steps: step2. Build a composed component tree containing a Row Component with five children, three of them
682      * are Text Component and two are Box Component.
683      * @tc.expected: step2. Element tree and render tree are the same as expected.
684      */
685     children.clear();
686     textData.clear();
687     children.emplace_back("text");
688     children.emplace_back("text");
689     children.emplace_back("box");
690     children.emplace_back("box");
691     children.emplace_back("text");
692     textData.emplace_back("first text");
693     textData.emplace_back("second text");
694     textData.emplace_back("fifth text");
695     BuildMultipleChildrenTrees(children, textData);
696     UpdateAndValidate();
697 }
698 
699 /**
700  * @tc.name: ViewUpdateTest013
701  * @tc.desc: View Updates caused by updating components.
702  * @tc.type: FUNC
703  */
704 HWTEST_F(ViewUpdateTest, ViewUpdateTest013, TestSize.Level1)
705 {
706     GTEST_LOG_(INFO) << "ViewUpdateTest0013";
707     vector<string> children;
708     vector<string> textData;
709 
710     /**
711      * @tc.steps: step1. Build a composed component tree containing a Row Component with five children, all of them are
712      * Text Component. The content of these child nodes as follows:
713      * "first text" | "second text" | "third text" | "fourth text" | "fifth text"
714      * update and check results.
715      * @tc.expected: step1. Element tree and render tree are the same as expected.
716      */
717     children.emplace_back("text");
718     children.emplace_back("text");
719     children.emplace_back("text");
720     children.emplace_back("text");
721     children.emplace_back("text");
722     textData.emplace_back("first text");
723     textData.emplace_back("second text");
724     textData.emplace_back("third text");
725     textData.emplace_back("fourth text");
726     textData.emplace_back("fifth text");
727     BuildMultipleChildrenTrees(children, textData);
728     UpdateAndValidate();
729 
730     /**
731      * @tc.steps: step2. Build a composed component tree containing a Row Component with five children, three of them
732      * are Text Component and two are Box Component. The content of those Text Component as follows:
733      * "updated second text" | "updated fourth text" | "fifth text"
734      * update and check results.
735      * @tc.expected: step2. Element tree and render tree are the same as expected.
736      */
737     children.clear();
738     textData.clear();
739     children.emplace_back("box");
740     children.emplace_back("text");
741     children.emplace_back("box");
742     children.emplace_back("text");
743     children.emplace_back("text");
744     textData.emplace_back("updated second text");
745     textData.emplace_back("updated fourth text");
746     textData.emplace_back("fifth text");
747     BuildMultipleChildrenTrees(children, textData);
748     UpdateAndValidate();
749 }
750 
751 } // namespace OHOS::Ace
752