1 files changed, 39 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-grid/alignment/self-baseline/grid-self-baseline-008.html b/testing/web-platform/tests/css/css-grid/alignment/self-baseline/grid-self-baseline-008.html
new file mode 100644
index 0000000000..5398b7e9c1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-grid/alignment/self-baseline/grid-self-baseline-008.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: baseline context and self alignment</title>
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com" />
+<link rel="help" href="https://drafts.csswg.org/css-grid/#alignment">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#baseline-align-self">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#align-by-baseline">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#align-items-property">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#align-self-property">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1121761">
+<link rel="match" href="grid-self-baseline-008-ref.html">
+<link rel="stylesheet" href="/css/support/alignment.css">
+<meta name="assert" content="Test baseline alignment with percentage track sizing functions and grid items being or containing replaced elements with aspect ratio and percentage sizes." />
+<style>
+.grid {
+  display: grid;
+  width: 400px;
+  grid-template-columns: 25% 25% 25% 25%;
+  line-height: 0;
+}
+.percent {
+  width: 100%;
+}
+canvas {
+  background: green;
+}
+</style>
+<div class="grid alignItemsBaseline">
+  <canvas width="100" height="200"></canvas>
+  <canvas width="200" height="400" class="percent"></canvas>
+  <div>
+    <canvas width="100" height="100" class="percent"></canvas>
+    <canvas width="100" height="100" class="percent"></canvas>
+  </div>
+  <div class="percent">
+    <canvas width="100" height="100" class="percent"></canvas>
+    <canvas width="100" height="100" class="percent"></canvas>
+  </div>
+</div>