LayoutIsolation.cpp 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438
  1. /*
  2. * This source file is part of RmlUi, the HTML/CSS Interface Middleware
  3. *
  4. * For the latest information, see http://github.com/mikke89/RmlUi
  5. *
  6. * Copyright (c) 2008-2010 CodePoint Ltd, Shift Technology Ltd
  7. * Copyright (c) 2019-2025 The RmlUi Team, and contributors
  8. *
  9. * Permission is hereby granted, free of charge, to any person obtaining a copy
  10. * of this software and associated documentation files (the "Software"), to deal
  11. * in the Software without restriction, including without limitation the rights
  12. * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  13. * copies of the Software, and to permit persons to whom the Software is
  14. * furnished to do so, subject to the following conditions:
  15. *
  16. * The above copyright notice and this permission notice shall be included in
  17. * all copies or substantial portions of the Software.
  18. *
  19. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  20. * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  21. * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  22. * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  23. * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  24. * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
  25. * THE SOFTWARE.
  26. *
  27. */
  28. #include "../../../Source/Core/Layout/FormattingContextDebug.h"
  29. #include "../../../Source/Core/Layout/LayoutNode.h"
  30. #include "../Common/TestsShell.h"
  31. #include "../Common/TypesToString.h"
  32. #include <RmlUi/Core/Context.h>
  33. #include <RmlUi/Core/Core.h>
  34. #include <RmlUi/Core/Element.h>
  35. #include <RmlUi/Core/ElementDocument.h>
  36. #include <RmlUi/Core/ElementText.h>
  37. #include <RmlUi/Core/ElementUtilities.h>
  38. #include <doctest.h>
  39. using namespace Rml;
  40. struct ElementLayoutInfo {
  41. ElementLayoutInfo(int tree_depth, const String& address, const Box& box, Vector2f absolute_offset) :
  42. tree_depth(tree_depth), address(address), box(box), absolute_offset(absolute_offset)
  43. {}
  44. int tree_depth;
  45. String address;
  46. Box box;
  47. Vector2f absolute_offset;
  48. bool operator==(const ElementLayoutInfo& other) const
  49. {
  50. return tree_depth == other.tree_depth && address == other.address && box == other.box && absolute_offset == other.absolute_offset;
  51. }
  52. bool operator!=(const ElementLayoutInfo& other) const { return !(*this == other); }
  53. String ToString() const
  54. {
  55. return String(size_t(4 * tree_depth), ' ') +
  56. CreateString("%s :: box = %g x %g (outer %g x %g) :: absolute_offset = %g x %g", address.c_str(), box.GetSize().x, box.GetSize().y,
  57. box.GetSizeAcross(BoxDirection::Horizontal, BoxArea::Margin), box.GetSizeAcross(BoxDirection::Vertical, BoxArea::Margin),
  58. absolute_offset.x, absolute_offset.y);
  59. }
  60. };
  61. static Vector<ElementLayoutInfo> CaptureLayoutTree(Element* root_element)
  62. {
  63. Vector<ElementLayoutInfo> layout_info_list;
  64. ElementUtilities::VisitElementsDepthOrder(root_element, [&](Element* element, int tree_depth) {
  65. layout_info_list.emplace_back(tree_depth, element->GetAddress(false, false), element->GetBox(), element->GetAbsoluteOffset());
  66. });
  67. return layout_info_list;
  68. }
  69. static void LogLayoutTree(const Vector<ElementLayoutInfo>& layout_info_list)
  70. {
  71. String message = "Element layout tree:\n";
  72. for (const auto& layout_info : layout_info_list)
  73. message += layout_info.ToString() + "\n";
  74. Rml::Log::Message(Rml::Log::LT_DEBUG, "%s", message.c_str());
  75. }
  76. static void LogDirtyLayoutTree(Element* root_element)
  77. {
  78. String tree_dirty_state;
  79. ElementUtilities::VisitElementsDepthOrder(root_element, [&](Element* element, int tree_depth) {
  80. tree_dirty_state += String(size_t(4 * tree_depth), ' ');
  81. tree_dirty_state += CreateString("%s: Dirty: %d Dirty Self: %d", element->GetAddress(false, tree_depth == 0).c_str(),
  82. element->GetLayoutNode()->IsDirty(), element->GetLayoutNode()->IsSelfDirty());
  83. tree_dirty_state += '\n';
  84. });
  85. Log::Message(Log::LT_INFO, "Dirty layout tree:\n%s\n", tree_dirty_state.c_str());
  86. }
  87. static const String document_isolation_rml = R"(
  88. <rml>
  89. <head>
  90. <link type="text/rcss" href="/assets/rml.rcss"/>
  91. <style>
  92. body {
  93. width: 800px;
  94. height: 600px;
  95. background-color: #ddd;
  96. font-family: LatoLatin;
  97. font-size: 14px;
  98. }
  99. scrollbarvertical {
  100. width: 12px;
  101. cursor: arrow;
  102. margin-right: -1px;
  103. padding-right: 1px;
  104. }
  105. scrollbarvertical slidertrack {
  106. background-color: #f0f0f0;
  107. }
  108. scrollbarvertical sliderbar {
  109. background-color: #666;
  110. }
  111. .container {
  112. width: 200px;
  113. margin: 20px;
  114. padding: 10px;
  115. background-color: #bbb;
  116. }
  117. .container > div {
  118. background-color: #aaa;
  119. margin: 5px;
  120. padding: 10px;
  121. }
  122. #flex-container {
  123. display: flex;
  124. flex-direction: column;
  125. }
  126. #overflow-container {
  127. overflow: auto;
  128. height: 150px;
  129. }
  130. #absolute-container {
  131. position: absolute;
  132. top: 300px;
  133. left: 300px;
  134. }
  135. </style>
  136. </head>
  137. <body>
  138. <div class="container" id="flex-container">
  139. <div>Flex item 1</div>
  140. <div id="flex-item">Flex item 2</div>
  141. <div id="flex-item-next">Flex item 3</div>
  142. </div>
  143. <div class="container" id="overflow-container">
  144. <div>Overflow item 1</div>
  145. <div id="overflow-item">Overflow item 2</div>
  146. <div>Overflow item 3</div>
  147. <div>Overflow item 4</div>
  148. <div>Overflow item 5</div>
  149. </div>
  150. <div class="container" id="absolute-container">
  151. <div id="absolute-item">Absolute item 1</div>
  152. <div>Absolute item 2</div>
  153. </div>
  154. <div class="container" id="normal-container">
  155. <div id="normal-item">Normal block box</div>
  156. </div>
  157. </body>
  158. </rml>
  159. )";
  160. TEST_CASE("LayoutIsolation.InsideOutsideFormattingContexts")
  161. {
  162. Context* context = TestsShell::GetContext();
  163. ElementDocument* document = context->LoadDocumentFromMemory(document_isolation_rml);
  164. document->Show();
  165. TestsShell::RenderLoop();
  166. SUBCASE("Flex")
  167. {
  168. Element* element = document->GetElementById("flex-item");
  169. Element* next_sibling = element->GetNextSibling();
  170. Element* next_outside_overflow = document->GetElementById("normal-container");
  171. REQUIRE(element);
  172. REQUIRE(next_sibling);
  173. REQUIRE(next_outside_overflow);
  174. const Vector2f absolute_offset_element = element->GetAbsoluteOffset();
  175. const Vector2f absolute_offset_next_sibling = next_sibling->GetAbsoluteOffset();
  176. const Vector2f absolute_offset_next_outside_overflow = next_outside_overflow->GetAbsoluteOffset();
  177. rmlui_dynamic_cast<ElementText*>(element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  178. TestsShell::RenderLoop();
  179. CHECK(element->GetAbsoluteOffset() == absolute_offset_element);
  180. CHECK(next_sibling->GetAbsoluteOffset() != absolute_offset_next_sibling);
  181. CHECK(next_outside_overflow->GetAbsoluteOffset() != absolute_offset_next_outside_overflow);
  182. }
  183. SUBCASE("Overflow")
  184. {
  185. Element* element = document->GetElementById("overflow-item");
  186. Element* next_sibling = element->GetNextSibling();
  187. Element* next_outside_overflow = document->GetElementById("normal-container");
  188. REQUIRE(element);
  189. REQUIRE(next_sibling);
  190. REQUIRE(next_outside_overflow);
  191. const Vector2f absolute_offset_element = element->GetAbsoluteOffset();
  192. const Vector2f absolute_offset_next_sibling = next_sibling->GetAbsoluteOffset();
  193. const Vector2f absolute_offset_next_outside_overflow = next_outside_overflow->GetAbsoluteOffset();
  194. rmlui_dynamic_cast<ElementText*>(element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  195. TestsShell::RenderLoop();
  196. CHECK(element->GetAbsoluteOffset() == absolute_offset_element);
  197. CHECK(next_sibling->GetAbsoluteOffset() != absolute_offset_next_sibling);
  198. CHECK(next_outside_overflow->GetAbsoluteOffset() == absolute_offset_next_outside_overflow);
  199. }
  200. SUBCASE("Absolute")
  201. {
  202. Element* element = document->GetElementById("absolute-item");
  203. Element* next_sibling = element->GetNextSibling();
  204. REQUIRE(element);
  205. REQUIRE(next_sibling);
  206. const Vector2f absolute_offset_element = element->GetAbsoluteOffset();
  207. const Vector2f absolute_offset_next_sibling = next_sibling->GetAbsoluteOffset();
  208. rmlui_dynamic_cast<ElementText*>(element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  209. TestsShell::RenderLoop();
  210. CHECK(element->GetAbsoluteOffset() == absolute_offset_element);
  211. CHECK(next_sibling->GetAbsoluteOffset() != absolute_offset_next_sibling);
  212. }
  213. SUBCASE("Normal")
  214. {
  215. Element* element = document->GetElementById("normal-item");
  216. REQUIRE(element);
  217. const float initial_width = element->GetBox().GetSize().x;
  218. element->SetProperty("width", "250px");
  219. TestsShell::RenderLoop();
  220. float new_width = element->GetBox().GetSize().x;
  221. CHECK(new_width != initial_width);
  222. CHECK(new_width == doctest::Approx(250.0f));
  223. }
  224. document->Close();
  225. TestsShell::ShutdownShell();
  226. }
  227. #ifdef RMLUI_DEBUG
  228. // Wrap all the following tests under this condition, since the format independent debug tracker is only available in debug mode.
  229. TEST_CASE("LayoutIsolation.FullLayoutFormatIndependentCount")
  230. {
  231. Context* context = TestsShell::GetContext();
  232. FormatIndependentDebugTracker format_independent_tracker;
  233. ElementDocument* document = context->LoadDocumentFromMemory(document_isolation_rml);
  234. document->Show();
  235. TestsShell::RenderLoop();
  236. format_independent_tracker.LogMessage();
  237. const auto count_level_1 = std::count_if(format_independent_tracker.entries.begin(), format_independent_tracker.entries.end(),
  238. [](const auto& entry) { return entry.level == 1; });
  239. CHECK_MESSAGE(count_level_1 == 3, "Expecting one entry for each of flex, overflow, and absolute");
  240. // There are quite a few flex item format occurrences being performed currently. We might reduce the following
  241. // number while working on the flex formatting engine. If this fails for any other reason, it is likely a bug.
  242. CHECK(format_independent_tracker.CountEntries() == 10);
  243. CHECK(format_independent_tracker.CountFormattedEntries() == 10);
  244. document->Close();
  245. TestsShell::ShutdownShell();
  246. }
  247. static const String document_isolation_absolute_rml = R"(
  248. <rml>
  249. <head>
  250. <link type="text/rcss" href="/assets/rml.rcss"/>
  251. <style>
  252. body {
  253. width: 800px;
  254. height: 600px;
  255. background-color: #ddd;
  256. font-family: LatoLatin;
  257. font-size: 14px;
  258. }
  259. scrollbarvertical {
  260. width: 12px;
  261. cursor: arrow;
  262. margin-right: -1px;
  263. padding-right: 1px;
  264. }
  265. scrollbarvertical slidertrack {
  266. background-color: #f0f0f0;
  267. }
  268. scrollbarvertical sliderbar {
  269. background-color: #666;
  270. }
  271. .container {
  272. width: 200px;
  273. margin: 20px;
  274. padding: 10px;
  275. background-color: #bbb;
  276. }
  277. .container > div {
  278. background-color: #aaa;
  279. margin: 5px;
  280. padding: 10px;
  281. }
  282. #absolute-container {
  283. position: absolute;
  284. top: 300px;
  285. left: 300px;
  286. width: 30%;
  287. }
  288. </style>
  289. </head>
  290. <body>
  291. <div class="container" id="absolute-container">
  292. <div id="absolute-item">Absolutely positioned box</div>
  293. </div>
  294. <div class="container" id="normal-container">
  295. <div id="normal-item">Normal block box</div>
  296. </div>
  297. </body>
  298. </rml>
  299. )";
  300. TEST_CASE("LayoutIsolation.Absolute")
  301. {
  302. Context* context = TestsShell::GetContext();
  303. ElementDocument* document = context->LoadDocumentFromMemory(document_isolation_absolute_rml);
  304. document->Show();
  305. TestsShell::RenderLoop();
  306. FormatIndependentDebugTracker format_independent_tracker;
  307. SUBCASE("Modify absolute content")
  308. {
  309. Element* element = document->GetElementById("absolute-item");
  310. const float initial_height = element->GetOffsetHeight();
  311. rmlui_dynamic_cast<ElementText*>(element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  312. TestsShell::RenderLoop();
  313. CHECK(element->GetOffsetHeight() != initial_height);
  314. CHECK(format_independent_tracker.CountFormattedEntries() == 1);
  315. }
  316. SUBCASE("Modify absolute width")
  317. {
  318. Element* container = document->GetElementById("absolute-container");
  319. Element* element = document->GetElementById("absolute-item");
  320. const float container_initial_width = container->GetOffsetWidth();
  321. const float element_initial_width = element->GetOffsetWidth();
  322. container->SetProperty("width", "300px");
  323. LogDirtyLayoutTree(document);
  324. document->UpdatePropertiesForDebug();
  325. LogDirtyLayoutTree(document);
  326. TestsShell::RenderLoop();
  327. CHECK(container->GetOffsetWidth() != container_initial_width);
  328. CHECK(element->GetOffsetWidth() != element_initial_width);
  329. CHECK(format_independent_tracker.CountEntries() == 1);
  330. CHECK(format_independent_tracker.CountFormattedEntries() == 1);
  331. }
  332. SUBCASE("Modify document width")
  333. {
  334. Element* container = document->GetElementById("absolute-container");
  335. Element* element = document->GetElementById("absolute-item");
  336. const float document_width = document->GetOffsetWidth();
  337. const float container_width = container->GetOffsetWidth();
  338. const float element_width = element->GetOffsetWidth();
  339. document->SetProperty("width", "1000px");
  340. TestsShell::RenderLoop();
  341. CHECK(document->GetOffsetWidth() != document_width);
  342. CHECK(container->GetOffsetWidth() != container_width);
  343. CHECK(element->GetOffsetWidth() != element_width);
  344. }
  345. SUBCASE("Modify normal content")
  346. {
  347. Element* element = document->GetElementById("normal-item");
  348. const float initial_height = element->GetOffsetHeight();
  349. LogLayoutTree(CaptureLayoutTree(document));
  350. rmlui_dynamic_cast<ElementText*>(element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  351. TestsShell::RenderLoop();
  352. CHECK(element->GetOffsetHeight() != initial_height);
  353. CHECK(format_independent_tracker.CountFormattedEntries() == 1);
  354. }
  355. SUBCASE("Modify normal content and absolute content")
  356. {
  357. Element* absolute_element = document->GetElementById("absolute-item");
  358. Element* normal_element = document->GetElementById("normal-item");
  359. const float absolute_initial_height = absolute_element->GetOffsetHeight();
  360. const float normal_initial_height = normal_element->GetOffsetHeight();
  361. rmlui_dynamic_cast<ElementText*>(absolute_element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  362. rmlui_dynamic_cast<ElementText*>(normal_element->GetFirstChild())->SetText("Modified text that is long enough to cause line break");
  363. TestsShell::RenderLoop();
  364. CHECK(absolute_element->GetOffsetHeight() != absolute_initial_height);
  365. CHECK(normal_element->GetOffsetHeight() != normal_initial_height);
  366. CHECK(format_independent_tracker.CountFormattedEntries() == 2);
  367. }
  368. format_independent_tracker.LogMessage();
  369. document->Close();
  370. TestsShell::ShutdownShell();
  371. }
  372. #endif // RMLUI_DEBUG