RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 00:37:35 +00:00
Code Issues Activity Actions

Tests/LibWeb: Add ref-tests for "overflow: hidden"

Browse source 
Adds ref-tests from pages used in the following PRs:
https://github.com/SerenityOS/serenity/pull/16035
https://github.com/SerenityOS/serenity/pull/17591
This commit is contained in:
Aliaksandr Kalenik 2023-12-21 14:44:42 +01:00 • committed by Andreas Kling
parent 56658b5354
commit 25e9d2ccf0
4 changed files with 140 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

45
Tests/LibWeb/Ref/overflow-hidden-2.html Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="match" href="reference/overflow-hidden-2-ref.html" />
<style>
.box1 {
width: 400px;
height: 400px;
background-color: slateblue;
position: absolute;
overflow: hidden;
}
.translate {
width: 200px;
height: 200px;
background-color: black;
transform: translate(150px, 150px);
}
.box2 {
width: 100px;
height: 100px;
background-color: orangered;
position: absolute;
}
.box3 {
position: relative;
width: 100px;
height: 100px;
background-color: greenyellow;
top: -90px;
left: -120px;
}
</style>
</head>
<body>
<div class="box1">
<div class="translate">
<div class="box2"><div class="box3"></div></div>
</div>
</div>
</body>
</html>

26
Tests/LibWeb/Ref/overflow-hidden.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="match" href="reference/overflow-hidden-ref.html" />
<style>
.outer-box {
width: 300px;
height: 300px;
background-color: darkblue;
overflow: hidden;
}
.inner-box {
width: 600px;
height: 600px;
background-color: orangered;
transform: translate(100px, 100px);
}
</style>
</head>
<body>
<div class="outer-box">
<div><div class="inner-box"></div></div>
</div>
</body>
</html>

43
Tests/LibWeb/Ref/reference/overflow-hidden-2-ref.html Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style>
.box1 {
width: 400px;
height: 400px;
background-color: slateblue;
position: absolute;
}
.translate {
width: 200px;
height: 200px;
background-color: black;
transform: translate(150px, 150px);
}
.box2 {
width: 100px;
height: 100px;
background-color: orangered;
position: absolute;
}
.box3 {
position: relative;
width: 100px;
height: 100px;
background-color: greenyellow;
top: -90px;
left: -120px;
}
</style>
</head>
<body>
<div class="box1">
<div class="translate">
<div class="box2"><div class="box3"></div></div>
</div>
</div>
</body>
</html>

26
Tests/LibWeb/Ref/reference/overflow-hidden-ref.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style>
.outer-box {
width: 300px;
height: 300px;
background-color: darkblue;
overflow: hidden;
position: relative
}
.inner-box {
width: 200px;
height: 200px;
background-color: orangered;
position: absolute;
top: 100px;
left: 100px;
}
</style>
</head>
<body>
<div class="outer-box"><div class="inner-box"></div></div>
</body>
</html>