Element.cpp 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469
  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-2023 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 "../Common/Mocks.h"
  29. #include "../Common/TestsInterface.h"
  30. #include "../Common/TestsShell.h"
  31. #include "../Common/TypesToString.h"
  32. #include <RmlUi/Core/Context.h>
  33. #include <RmlUi/Core/Element.h>
  34. #include <RmlUi/Core/ElementDocument.h>
  35. #include <RmlUi/Core/Factory.h>
  36. #include <doctest.h>
  37. using namespace Rml;
  38. static const String document_clone_rml = R"(
  39. <rml>
  40. <head>
  41. <title>Test</title>
  42. <link type="text/rcss" href="/assets/rml.rcss"/>
  43. <link type="text/rcss" href="/assets/invader.rcss"/>
  44. <style>
  45. body
  46. {
  47. left: 0;
  48. top: 0;
  49. right: 0;
  50. bottom: 0;
  51. }
  52. div {
  53. drag: clone;
  54. background-color: #fff;
  55. height: 100px;
  56. }
  57. div.blue {
  58. background-color: #00f;
  59. }
  60. span {
  61. color: red;
  62. }
  63. </style>
  64. </head>
  65. <body>
  66. <div style="background-color: #f00">This is a <span>sample</span>.</div>
  67. </body>
  68. </rml>
  69. )";
  70. static const String document_scroll_rml = R"(
  71. <rml>
  72. <head>
  73. <title>Test</title>
  74. <style>
  75. body {
  76. left: 0;
  77. top: 0;
  78. width: 100px;
  79. height: 100px;
  80. padding: 0;
  81. margin: 0;
  82. overflow: scroll;
  83. }
  84. div {
  85. display: block;
  86. width: 200px;
  87. height: 50px;
  88. padding: 0;
  89. margin: 0;
  90. }
  91. #row0 { background: #3a3; }
  92. #row1 { background: #aa3; }
  93. #row2 { background: #3aa; }
  94. #row3 { background: #aaa; }
  95. span {
  96. display: inline-block;
  97. box-sizing: border-box;
  98. width: 50px;
  99. height: 50px;
  100. padding: 0;
  101. margin: 0;
  102. border: 1px #000;
  103. }
  104. span:nth-child(2) { border-color: #fff; }
  105. span:nth-child(3) { border-color: #f00; }
  106. span:nth-child(4) { border-color: #ff0; }
  107. scrollbarvertical,
  108. scrollbarhorizontal {
  109. width: 0;
  110. height: 0;
  111. }
  112. </style>
  113. </head>
  114. <body id="scrollable">
  115. <div id="row0">
  116. <span id="cell00"></span>
  117. <span id="cell01"></span>
  118. <span id="cell02"></span>
  119. <span id="cell03"></span>
  120. </div>
  121. <div id="row1">
  122. <span id="cell10"></span>
  123. <span id="cell11"></span>
  124. <span id="cell12"></span>
  125. <span id="cell13"></span>
  126. </div>
  127. <div id="row2">
  128. <span id="cell20"></span>
  129. <span id="cell21"></span>
  130. <span id="cell22"></span>
  131. <span id="cell23"></span>
  132. </div>
  133. <div id="row3">
  134. <span id="cell30"></span>
  135. <span id="cell31"></span>
  136. <span id="cell32"></span>
  137. <span id="cell33"></span>
  138. </div>
  139. </body>
  140. </rml>
  141. )";
  142. void Run(Context* context)
  143. {
  144. context->Update();
  145. context->Render();
  146. TestsShell::RenderLoop();
  147. }
  148. TEST_CASE("Element")
  149. {
  150. Context* context = TestsShell::GetContext();
  151. REQUIRE(context);
  152. ElementDocument* document = context->LoadDocumentFromMemory(document_clone_rml);
  153. REQUIRE(document);
  154. document->Show();
  155. context->Update();
  156. context->Render();
  157. Element* div = document->GetFirstElementChild();
  158. Element* span = div->GetChild(1);
  159. REQUIRE(div);
  160. REQUIRE(div->GetTagName() == "div");
  161. REQUIRE(span);
  162. REQUIRE(span->GetTagName() == "span");
  163. SUBCASE("Attribute")
  164. {
  165. Element* button = As<Element*>(document->AppendChild(document->CreateElement("button")));
  166. SUBCASE("Event listener")
  167. {
  168. namespace tl = trompeloeil;
  169. static constexpr auto ON_CLICK_ATTRIBUTE = "onclick";
  170. static constexpr auto ON_CLICK_VALUE = "moo";
  171. std::vector<UniquePtr<tl::expectation>> expectations;
  172. UniquePtr<MockEventListener> mockEventListener;
  173. const auto configureMockEventListener = [&]() {
  174. mockEventListener.reset(new MockEventListener());
  175. expectations.emplace_back(NAMED_ALLOW_CALL(*mockEventListener, OnAttach(button)));
  176. expectations.emplace_back(NAMED_ALLOW_CALL(*mockEventListener, OnDetach(button)).LR_SIDE_EFFECT(mockEventListener.reset()));
  177. };
  178. MockEventListenerInstancer mockEventListenerInstancer;
  179. const auto configureMockEventListenerInstancer = [&](const auto value) {
  180. expectations.emplace_back(NAMED_REQUIRE_CALL(mockEventListenerInstancer, InstanceEventListener(value, button))
  181. .LR_SIDE_EFFECT(configureMockEventListener())
  182. .LR_RETURN(mockEventListener.get()));
  183. };
  184. Factory::RegisterEventListenerInstancer(&mockEventListenerInstancer);
  185. configureMockEventListenerInstancer(ON_CLICK_VALUE);
  186. button->SetAttribute(ON_CLICK_ATTRIBUTE, ON_CLICK_VALUE);
  187. SUBCASE("Replacement")
  188. {
  189. static constexpr auto REPLACEMENT_ON_CLICK_VALUE = "boo";
  190. configureMockEventListenerInstancer(REPLACEMENT_ON_CLICK_VALUE);
  191. button->SetAttribute(ON_CLICK_ATTRIBUTE, REPLACEMENT_ON_CLICK_VALUE);
  192. }
  193. button->RemoveAttribute(ON_CLICK_ATTRIBUTE);
  194. }
  195. SUBCASE("Simple")
  196. {
  197. static constexpr auto DISABLED_ATTRIBUTE = "disabled";
  198. REQUIRE_FALSE(button->HasAttribute(DISABLED_ATTRIBUTE));
  199. button->SetAttribute(DISABLED_ATTRIBUTE, "");
  200. REQUIRE(button->HasAttribute(DISABLED_ATTRIBUTE));
  201. SUBCASE("Replacement")
  202. {
  203. static constexpr auto VALUE = "something";
  204. button->SetAttribute(DISABLED_ATTRIBUTE, VALUE);
  205. const auto* attributeValue = button->GetAttribute(DISABLED_ATTRIBUTE);
  206. REQUIRE(attributeValue);
  207. REQUIRE(attributeValue->GetType() == Variant::Type::STRING);
  208. CHECK(attributeValue->Get<String>() == VALUE);
  209. }
  210. button->RemoveAttribute(DISABLED_ATTRIBUTE);
  211. CHECK_FALSE(button->HasAttribute(DISABLED_ATTRIBUTE));
  212. }
  213. }
  214. SUBCASE("CloneDrag")
  215. {
  216. // Simulate input for mouse click and drag
  217. context->ProcessMouseMove(10, 10, 0);
  218. context->Update();
  219. context->Render();
  220. context->ProcessMouseButtonDown(0, 0);
  221. context->Update();
  222. context->Render();
  223. // This should initiate a drag clone.
  224. context->ProcessMouseMove(10, 11, 0);
  225. context->Update();
  226. context->Render();
  227. context->ProcessMouseButtonUp(0, 0);
  228. }
  229. SUBCASE("CloneManual")
  230. {
  231. Element* element = document->GetFirstElementChild();
  232. REQUIRE(element->GetProperty<String>("background-color") == "#ff0000");
  233. CHECK(element->Clone()->GetProperty<String>("background-color") == "#ff0000");
  234. element->SetProperty("background-color", "#0f0");
  235. CHECK(element->Clone()->GetProperty<String>("background-color") == "#00ff00");
  236. element->RemoveProperty("background-color");
  237. Element* clone = As<Element*>(document->AppendChild(element->Clone()));
  238. context->Update();
  239. CHECK(clone->GetProperty<String>("background-color") == "#ffffff");
  240. element->SetClass("blue", true);
  241. clone = As<Element*>(document->AppendChild(element->Clone()));
  242. context->Update();
  243. CHECK(clone->GetProperty<String>("background-color") == "#0000ff");
  244. }
  245. SUBCASE("SetInnerRML")
  246. {
  247. Element* element = document->GetFirstElementChild();
  248. CHECK(element->GetInnerRML() == "This is a <span>sample</span>.");
  249. element->SetInnerRML("text");
  250. CHECK(element->GetInnerRML() == "text");
  251. const char* inner_rml = R"(before<div class="blue">child</div>after)";
  252. element->SetInnerRML(inner_rml);
  253. CHECK(element->GetInnerRML() == inner_rml);
  254. ElementPtr element_ptr = document->CreateElement("div");
  255. CHECK(element_ptr->GetInnerRML() == "");
  256. element_ptr->SetInnerRML("text");
  257. CHECK(element_ptr->GetInnerRML() == "text");
  258. }
  259. SUBCASE("GetInnerRML")
  260. {
  261. String inner_rml;
  262. inner_rml = document->GetInnerRML();
  263. CHECK(inner_rml == R"(<div style="background-color: #ff0000;">This is a <span>sample</span>.</div>)");
  264. div->SetProperty("background-color", "white");
  265. inner_rml = document->GetInnerRML();
  266. CHECK(inner_rml == R"(<div style="background-color: #ffffff;">This is a <span>sample</span>.</div>)");
  267. div->RemoveProperty("background-color");
  268. inner_rml = document->GetInnerRML();
  269. CHECK(inner_rml == R"(<div>This is a <span>sample</span>.</div>)");
  270. div->SetProperty("cursor", "x<y");
  271. inner_rml = document->GetInnerRML();
  272. CHECK(inner_rml == R"(<div style="cursor: x&lt;y;">This is a <span>sample</span>.</div>)");
  273. span->SetProperty("font-weight", "bold");
  274. inner_rml = document->GetInnerRML();
  275. CHECK(inner_rml == R"(<div style="cursor: x&lt;y;">This is a <span style="font-weight: bold;">sample</span>.</div>)");
  276. }
  277. SUBCASE("InsertBefore")
  278. {
  279. String inner_rml;
  280. inner_rml = document->GetInnerRML();
  281. CHECK(inner_rml == R"(<div style="background-color: #ff0000;">This is a <span>sample</span>.</div>)");
  282. div->InsertBefore(document->CreateElement("img"), span);
  283. inner_rml = document->GetInnerRML();
  284. CHECK(inner_rml == R"(<div style="background-color: #ff0000;">This is a <img /><span>sample</span>.</div>)");
  285. Element* button = As<Element*>(div->InsertBefore(document->CreateElement("button"), nullptr));
  286. button->SetInnerRML("Click me");
  287. inner_rml = document->GetInnerRML();
  288. CHECK(inner_rml == R"(<div style="background-color: #ff0000;">This is a <img /><span>sample</span>.<button>Click me</button></div>)");
  289. }
  290. document->Close();
  291. TestsShell::ShutdownShell();
  292. }
  293. TEST_CASE("Element.ScrollIntoView")
  294. {
  295. Context* context = TestsShell::GetContext();
  296. REQUIRE(context);
  297. ElementDocument* document = context->LoadDocumentFromMemory(document_scroll_rml);
  298. REQUIRE(document);
  299. document->Show();
  300. Run(context);
  301. Element* scrollable = document->GetElementById("scrollable");
  302. REQUIRE(scrollable);
  303. Element* cells[4][4]{};
  304. for (int i = 0; i < 4; ++i)
  305. {
  306. for (int j = 0; j < 4; ++j)
  307. {
  308. cells[i][j] = document->GetElementById(CreateString("cell%d%d", i, j));
  309. REQUIRE(cells[i][j]);
  310. }
  311. }
  312. REQUIRE(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(0, 0));
  313. REQUIRE(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(100, 100));
  314. REQUIRE(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(150, 150));
  315. REQUIRE(scrollable->GetScrollLeft() == 0);
  316. REQUIRE(scrollable->GetScrollTop() == 0);
  317. SUBCASE("LegacyScroll")
  318. {
  319. cells[2][2]->ScrollIntoView(true);
  320. Run(context);
  321. CHECK(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-50, -100));
  322. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(50, 0));
  323. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(100, 50));
  324. CHECK(scrollable->GetScrollLeft() == 50);
  325. CHECK(scrollable->GetScrollTop() == 100);
  326. cells[2][2]->ScrollIntoView(false);
  327. Run(context);
  328. CHECK(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-50, -50));
  329. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(50, 50));
  330. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(100, 100));
  331. CHECK(scrollable->GetScrollLeft() == 50);
  332. CHECK(scrollable->GetScrollTop() == 50);
  333. }
  334. SUBCASE("AdvancedScroll")
  335. {
  336. cells[2][2]->ScrollIntoView({ScrollAlignment::Center, ScrollAlignment::Center});
  337. Run(context);
  338. CHECK(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-75, -75));
  339. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(25, 25));
  340. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(75, 75));
  341. SUBCASE("NearestAlready")
  342. {
  343. cells[2][2]->ScrollIntoView(ScrollAlignment::Nearest);
  344. Run(context);
  345. CHECK(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-75, -75));
  346. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(25, 25));
  347. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(75, 75));
  348. }
  349. SUBCASE("NearestBefore")
  350. {
  351. cells[1][1]->ScrollIntoView(ScrollAlignment::Nearest);
  352. Run(context);
  353. CHECK(cells[0][0]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-50, -50));
  354. CHECK(cells[1][1]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(0, 0));
  355. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(50, 50));
  356. }
  357. SUBCASE("NearestAfter")
  358. {
  359. cells[3][3]->ScrollIntoView(ScrollAlignment::Nearest);
  360. Run(context);
  361. CHECK(cells[1][1]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(-50, -50));
  362. CHECK(cells[2][2]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(0, 0));
  363. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(50, 50));
  364. }
  365. SUBCASE("Smoothscroll")
  366. {
  367. TestsSystemInterface* system_interface = TestsShell::GetTestsSystemInterface();
  368. system_interface->SetTime(0);
  369. cells[3][3]->ScrollIntoView({ScrollAlignment::Nearest, ScrollAlignment::Nearest, ScrollBehavior::Smooth});
  370. constexpr double dt = 1.0 / 15.0;
  371. system_interface->SetTime(dt);
  372. Run(context);
  373. // We don't define the exact offset at this time step, but it should be somewhere between the start and end offsets.
  374. Vector2f offset = cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border);
  375. CHECK(offset.x > 50.f);
  376. CHECK(offset.y > 50.f);
  377. CHECK(offset.x < 75.f);
  378. CHECK(offset.y < 75.f);
  379. // After one second it should be at the destination offset.
  380. for (double t = 2.0 * dt; t < 1.0; t += dt)
  381. {
  382. system_interface->SetTime(t);
  383. Run(context);
  384. }
  385. CHECK(cells[3][3]->GetAbsoluteOffset(Rml::BoxArea::Border) == Vector2f(50, 50));
  386. }
  387. }
  388. document->Close();
  389. TestsShell::ShutdownShell();
  390. }