Mirrors/eepp
1
0
Fork 0
mirror of https://github.com/SpartanJ/eepp.git synced 2026-05-28 17:16:29 +03:00
Code Issues Packages Projects Releases Wiki Activity

Split borders tests into two to fit in 650px height, which seems to be the maximum height we can use in macOS CI worker.

Browse Source
This commit is contained in:
Martín Lucas Golini
2026-04-29 00:56:01 -03:00
parent e1d9642dc6
commit dcd8ecee55
5 changed files with 121 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
bin/unit_tests/assets/html/border_tests.html
View File

@@ -123,49 +123,6 @@
<div class="box" style="border: 4px solid #8e44ad; border-radius: 20px;">r20</div>
</div>
<div class="row">
<div class="label">radius diff</div>
<div class="box" style="border: 4px solid #e74c3c; border-top-left-radius: 16px; border-bottom-right-radius: 16px;">tl+br</div>
<div class="box" style="border: 4px solid #27ae60; border-top-right-radius: 16px; border-bottom-left-radius: 16px;">tr+bl</div>
<div class="box" style="border: 4px solid #2980b9; border-top-left-radius: 4px; border-top-right-radius: 8px; border-bottom-right-radius: 12px; border-bottom-left-radius: 2px;">mixed</div>
<div class="box" style="border: 4px solid #8e44ad; border-top-left-radius: 32px;">tl32</div>
</div>
<!-- ============ PARTIAL BORDERS + RADIUS ============ -->
<div class="row">
<div class="label">part+radius</div>
<div class="box" style="border-top: 4px solid #e74c3c; border-right: 4px solid #27ae60; border-radius: 8px;">t+r r8</div>
<div class="box" style="border-bottom: 4px solid #2980b9; border-left: 4px solid #8e44ad; border-radius: 12px;">b+l r12</div>
<div class="box" style="border-top: 4px solid #e74c3c; border-bottom: 4px solid #2980b9; border-radius: 8px;">t+b r8</div>
<div class="box" style="border: 4px solid #27ae60; border-left: 0px; border-radius: 8px;">noL r8</div>
</div>
<div class="row">
<div class="label">part+radius2</div>
<div class="box" style="border: 4px solid #e74c3c; border-bottom: 0px; border-radius: 8px;">noB r8</div>
<div class="box" style="border: 4px solid #2980b9; border-top: 0px; border-radius: 8px;">noT r8</div>
<div class="box" style="border: 4px solid #8e44ad; border-right: 0px; border-radius: 8px;">noR r8</div>
<div class="box" style="border-top: 2px solid #e74c3c; border-left: 6px solid #8e44ad; border-radius: 6px;">t2+l6</div>
</div>
<!-- ============ THICK BORDERS + RADIUS ============ -->
<div class="row">
<div class="label">thick+radius</div>
<div class="box" style="border: 8px solid #e74c3c; border-radius: 12px;">8px/r12</div>
<div class="box" style="border: 12px solid #27ae60; border-radius: 16px;">12/r16</div>
<div class="box" style="border: 3px solid #2980b9; border-radius: 32px;">3px/r32</div>
<div class="box" style="border-top: 12px solid #e74c3c; border-radius: 8px;">t12</div>
</div>
<!-- ============ DIFFERENT SIZES ============ -->
<div class="row">
<div class="label">large boxes</div>
<div class="box" style="width: 96px; height: 96px; border: 6px solid #e74c3c; border-radius: 16px;">96x96</div>
<div class="box" style="width: 96px; height: 48px; border: 4px solid #27ae60;">96x48</div>
<div class="box" style="width: 48px; height: 96px; border: 4px solid #2980b9; border-radius: 8px;">48x96</div>
<div class="box" style="width: 96px; height: 96px; border: 2px solid #e74c3c; border-top: 10px solid #8e44ad; border-left: 1px solid #2ecc71;">mixed96</div>
</div>
<div class="clearfix"></div>
</body>
</html>

86
bin/unit_tests/assets/html/border_tests_2.html Normal file
View File

@@ -0,0 +1,86 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
background-color: #f5f5f5;
font: 11px Verdana, Sans-Serif;
color: #333;
padding: 8px;
}
.row { clear: both; margin-bottom: 4px; }
.label {
float: left;
width: 130px;
font-size: 9px;
line-height: 1.2;
color: #555;
padding-top: 2px;
padding-right: 4px;
text-align: right;
}
.box {
float: left;
width: 48px;
height: 48px;
margin: 2px;
background-color: #e8f0f8;
font-size: 8px;
text-align: center;
padding: 4px;
overflow: hidden;
}
.clearfix { clear: both; }
</style>
</head>
<body>
<!-- ============ 4 BORDERS + RADIUS ============ -->
<div class="row">
<div class="label">radius diff</div>
<div class="box" style="border: 4px solid #e74c3c; border-top-left-radius: 16px; border-bottom-right-radius: 16px;">tl+br</div>
<div class="box" style="border: 4px solid #27ae60; border-top-right-radius: 16px; border-bottom-left-radius: 16px;">tr+bl</div>
<div class="box" style="border: 4px solid #2980b9; border-top-left-radius: 4px; border-top-right-radius: 8px; border-bottom-right-radius: 12px; border-bottom-left-radius: 2px;">mixed</div>
<div class="box" style="border: 4px solid #8e44ad; border-top-left-radius: 32px;">tl32</div>
</div>
<!-- ============ PARTIAL BORDERS + RADIUS ============ -->
<div class="row">
<div class="label">part+radius</div>
<div class="box" style="border-top: 4px solid #e74c3c; border-right: 4px solid #27ae60; border-radius: 8px;">t+r r8</div>
<div class="box" style="border-bottom: 4px solid #2980b9; border-left: 4px solid #8e44ad; border-radius: 12px;">b+l r12</div>
<div class="box" style="border-top: 4px solid #e74c3c; border-bottom: 4px solid #2980b9; border-radius: 8px;">t+b r8</div>
<div class="box" style="border: 4px solid #27ae60; border-left: 0px; border-radius: 8px;">noL r8</div>
</div>
<div class="row">
<div class="label">part+radius2</div>
<div class="box" style="border: 4px solid #e74c3c; border-bottom: 0px; border-radius: 8px;">noB r8</div>
<div class="box" style="border: 4px solid #2980b9; border-top: 0px; border-radius: 8px;">noT r8</div>
<div class="box" style="border: 4px solid #8e44ad; border-right: 0px; border-radius: 8px;">noR r8</div>
<div class="box" style="border-top: 2px solid #e74c3c; border-left: 6px solid #8e44ad; border-radius: 6px;">t2+l6</div>
</div>
<!-- ============ THICK BORDERS + RADIUS ============ -->
<div class="row">
<div class="label">thick+radius</div>
<div class="box" style="border: 8px solid #e74c3c; border-radius: 12px;">8px/r12</div>
<div class="box" style="border: 12px solid #27ae60; border-radius: 16px;">12/r16</div>
<div class="box" style="border: 3px solid #2980b9; border-radius: 32px;">3px/r32</div>
<div class="box" style="border-top: 12px solid #e74c3c; border-radius: 8px;">t12</div>
</div>
<!-- ============ DIFFERENT SIZES ============ -->
<div class="row">
<div class="label">large boxes</div>
<div class="box" style="width: 96px; height: 96px; border: 6px solid #e74c3c; border-radius: 16px;">96x96</div>
<div class="box" style="width: 96px; height: 48px; border: 4px solid #27ae60;">96x48</div>
<div class="box" style="width: 48px; height: 96px; border: 4px solid #2980b9; border-radius: 8px;">48x96</div>
<div class="box" style="width: 96px; height: 96px; border: 2px solid #e74c3c; border-top: 10px solid #8e44ad; border-left: 1px solid #2ecc71;">mixed96</div>
</div>
<div class="clearfix"></div>
</body>
</html>

BIN
bin/unit_tests/assets/html/eepp-ui-border-rendering-2.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
bin/unit_tests/assets/html/eepp-ui-border-rendering.webp
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 5.1 KiB

36
src/tests/unit_tests/uihtml_tests.cpp
View File

@@ -805,7 +805,7 @@ UTEST( UILayout, listStyleInheritanceFromUl ) {
UTEST( UIBorder, renderingVariations ) {
auto win = Engine::instance()->createWindow(
WindowSettings( 1200, 900, "Border Rendering Test", WindowStyle::Default,
WindowSettings( 1200, 650, "Border Rendering Test", WindowStyle::Default,
WindowBackend::Default, 32, {}, 1, false, true ),
ContextSettings( false, 0, 0, GLv_default, true, false ) );
FileSystem::changeWorkingDirectory( Sys::getProcessPath() );
@@ -836,3 +836,37 @@ UTEST( UIBorder, renderingVariations ) {
Engine::destroySingleton();
}
UTEST( UIBorder, renderingVariations2 ) {
auto win = Engine::instance()->createWindow(
WindowSettings( 1200, 650, "Border Rendering Test 2", WindowStyle::Default,
WindowBackend::Default, 32, {}, 1, false, true ),
ContextSettings( false, 0, 0, GLv_default, true, false ) );
FileSystem::changeWorkingDirectory( Sys::getProcessPath() );
FontTrueType* font = FontTrueType::New( "NotoSans-Regular" );
font->loadFromFile( "../assets/fonts/NotoSans-Regular.ttf" );
ASSERT_TRUE( font != nullptr && font->loaded() );
FontFamily::loadFromRegular( font );
UI::UISceneNode* sceneNode = UI::UISceneNode::New();
SceneManager::instance()->add( sceneNode );
UI::UIThemeManager* themeManager = sceneNode->getUIThemeManager();
themeManager->setDefaultFont( font );
sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" );
std::string html;
FileSystem::fileGet( "assets/html/border_tests_2.html", html );
sceneNode->loadLayoutFromString( HTMLFormatter::HTMLtoXML( html ) );
win->setClearColor( Color::White );
win->getInput()->update();
SceneManager::instance()->update();
win->clear();
SceneManager::instance()->draw();
win->display();
compareImages( utest_state, utest_result, win, "eepp-ui-border-rendering-2", "html" );
Engine::destroySingleton();
}