[masonry] Finish Removal of align-tracks and justify-tracks (#42436)

I implemented a first pass last week through WPT to get rid of the low-hanging fruit with tests containing these properties. This patch finishes up the removal of align and justify tracks. The masonry fragmentation tests 03 - 06 seem to be duplicates once you remove the justify-tracks, so I deleted them. The all-prop-revert-layer.html was just a simple deletion of the two properties. The masonry-grid-item-self-baseline-002a/b.html required minor updating to using align/justify-content to conform to the reference implementation.
web-platform-tests · Oct 9, 2023 · 336dd49 · 336dd49
1 parent 468507e
commit 336dd49
Show file tree

Hide file tree

Showing 9 changed files with 23 additions and 602 deletions.
diff --git a/css/css-cascade/all-prop-revert-layer.html b/css/css-cascade/all-prop-revert-layer.html
@@ -11,7 +11,6 @@
   align-content: baseline;
   align-items: baseline;
   align-self: baseline;
-  align-tracks: baseline;
   alignment-baseline: central;
   alt: "a";
   animation-composition: add;
@@ -174,7 +173,6 @@
   justify-content: center;
   justify-items: baseline;
   justify-self: baseline;
-  justify-tracks: center;
   kerning: 123px;
   left: 123px;
   letter-spacing: 123px;

diff --git a/css/css-grid/masonry/tentative/baseline/masonry-grid-item-self-baseline-002a.html b/css/css-grid/masonry/tentative/baseline/masonry-grid-item-self-baseline-002a.html
@@ -23,13 +23,13 @@
   padding-block-start: 1px;
   margin-left: 1px;
   border:1px solid;
-  align-tracks: end;
-  justify-tracks: end;
   masonry-auto-flow: next;
   height: 100px;
   width: 100px;
 }
 .c { grid: repeat(4, auto) / masonry; }
+.ae { align-content: end; }
+.je { justify-content: end; }
 
 span {
   text-decoration: underline lime;
@@ -66,19 +66,19 @@
 </head>
 <body>
 
-<div class="grid"><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span></div>
-<div class="grid"><span class="fb hl pbe">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span></div>
-<div class="grid vll central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid vll central"><span class="fb pbs">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid vlr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae"><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span></div>
+<div class="grid ae"><span class="fb hl pbe">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span><span class="fb hl">F<br><x>x</x></span></div>
+<div class="grid ae vll central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae vll central"><span class="fb pbs">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae vlr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
 
 <br clear="all">
 
-<div class="grid vrr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid vrr central"><span class="fb pbe">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid vrl central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid swl central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
-<div class="grid swr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae vrr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae vrr central"><span class="fb pbe">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae vrl central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae swl central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
+<div class="grid ae swr central"><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span><span class="fb">F<br><x>x</x></span></div>
 
 <br clear="all">
 
@@ -93,13 +93,13 @@
 <div class="grid vrl central"><span class="lb pbe"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span></div>
 <div class="grid swl"><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span></div>
 <div class="grid swr"><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span><span class="lb"><x>x</x><br>L</span></div>
-<div class="grid c central"><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span></div>
-<div class="grid c central"><span class="jfb vll pbe">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span></div>
+<div class="grid je c central"><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span></div>
+<div class="grid je c central"><span class="jfb vll pbe">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span><span class="jfb vll">F<br><x>x</x></span></div>
 
 <br clear="all">
 
-<div class="grid c vll"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
-<div class="grid c vll"><span class="jfb hl pbs">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c vll"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c vll"><span class="jfb hl pbs">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
 
 </body>
 </html>
diff --git a/css/css-grid/masonry/tentative/baseline/masonry-grid-item-self-baseline-002b.html b/css/css-grid/masonry/tentative/baseline/masonry-grid-item-self-baseline-002b.html
@@ -23,13 +23,13 @@
   padding-block-start: 1px;
   margin-left: 1px;
   border:1px solid;
-  align-tracks: end;
-  justify-tracks: end;
   masonry-auto-flow: next;
   height: 100px;
   width: 100px;
 }
 .c { grid: repeat(4, auto) / masonry; }
+.ae { align-content: end; }
+.je { justify-content: end; }
 
 span {
   text-decoration: underline lime;
@@ -67,13 +67,13 @@
 <body>
 
 <!-- TODO: baseline alignment is wrong (bug 1633610)
-<div class="grid c vrr"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
-<div class="grid c vrr"><span class="jfb hl pbe">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
-<div class="grid c swl"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c vrr"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c vrr"><span class="jfb hl pbe">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c swl"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
 -->
-<div class="grid c swr"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
+<div class="grid je c swr"><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span><span class="jfb hl">F<br><x>x</x></span></div>
 
-<div class="grid"><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span></div>
+<div class="grid ae"><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span><span class="lb hl"><x>x</x><br>L</span></div>
 
 <br clear="all">
 

diff --git a/css/css-grid/masonry/tentative/fragmentation/masonry-fragmentation-004-ref.html b/css/css-grid/masonry/tentative/fragmentation/masonry-fragmentation-004-ref.html
diff --git a/css/css-grid/masonry/tentative/fragmentation/masonry-fragmentation-004.html b/css/css-grid/masonry/tentative/fragmentation/masonry-fragmentation-004.html