Remove unnecessary div wrapper from some grid ::first-letter/::first-line WPTs, to avoid tripping over an unrelated-to-grid Firefox bug.
These tests are trying to validate that the first-line and first-letter pseudos
match properly when specified on a grid item, but these tests were testing this
slightly awkwardly by checking whether these pseudos can change the color of
text that happens to live *in a descendant* of that grid item.
That descendant-targeting doesn't work in Firefox right now, due to a
longstanding bug with these pseudos[1]. That bug has nothing to do with grid
or grid items, however.
There's no reason that these tests need to be targeting a descendant to
validate that these pseudos match. We can just adjust the test to remove the
unnecessary extra wrapper, which then lets us validate more directly that they
do in fact properly change the color of the first letter or first line directly
in that grid item.
(Note that we do have other WPT coverage[2][3] for the known Firefox
pseudo-matching-text-in-descendants bug, as well.)
[1] https://bugzilla.mozilla.org/show_bug.cgi?id=317081
[2] https://wpt.fyi/results/css/css-pseudo/first-line-on-ancestor-block.html
[3] https://wpt.fyi/results/css/css-pseudo/first-line-change-inline-color.html
Differential Revision: https://phabricator.services.mozilla.com/D186870
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1841318
gecko-commit: 7df10ffc03578567afa80bb6a9c92328fee87e56
gecko-reviewers: emilio
diff --git a/css/css-grid/grid-model/grid-first-letter-003.html b/css/css-grid/grid-model/grid-first-letter-003.html
index 9d9a0c7..12b88c3 100644
--- a/css/css-grid/grid-model/grid-first-letter-003.html
+++ b/css/css-grid/grid-model/grid-first-letter-003.html
@@ -16,10 +16,8 @@
}
</style>
<div class="grid">
- <div class="item">
- <p>
- The <strong>first letter</strong> of this paragraph, and only that one, should be <strong>green</strong>.
- In addition, body and paragraph margins should <strong>not collapse</strong>.
- </p>
- </div>
+ <p class="item">
+ The <strong>first letter</strong> of this paragraph, and only that one, should be <strong>green</strong>.
+ In addition, body and paragraph margins should <strong>not collapse</strong>.
+ </p>
</div>
diff --git a/css/css-grid/grid-model/grid-first-line-003.html b/css/css-grid/grid-model/grid-first-line-003.html
index ede9901..47f727d 100644
--- a/css/css-grid/grid-model/grid-first-line-003.html
+++ b/css/css-grid/grid-model/grid-first-line-003.html
@@ -17,7 +17,7 @@
}
</style>
<div class="grid">
- <div class="item">
- <p>This text should be <strong>green</strong> and body and paragraph margins should <strong>not collapse</strong>.</p>
- </div>
+ <p class="item">
+ This text should be <strong>green</strong> and body and paragraph margins should <strong>not collapse</strong>.
+ </p>
</div>
diff --git a/css/css-grid/grid-model/grid-inline-first-letter-003.html b/css/css-grid/grid-model/grid-inline-first-letter-003.html
index e3efd51..eea15ab 100644
--- a/css/css-grid/grid-model/grid-inline-first-letter-003.html
+++ b/css/css-grid/grid-model/grid-inline-first-letter-003.html
@@ -16,10 +16,8 @@
}
</style>
<div class="inline-grid">
- <div class="item">
- <p>
- The <strong>first letter</strong> of this paragraph, and only that one, should be <strong>green</strong>.
- In addition, body and paragraph margins should <strong>not collapse</strong>.
- </p>
- </div>
+ <p class="item">
+ The <strong>first letter</strong> of this paragraph, and only that one, should be <strong>green</strong>.
+ In addition, body and paragraph margins should <strong>not collapse</strong>.
+ </p>
</div>
diff --git a/css/css-grid/grid-model/grid-inline-first-line-003.html b/css/css-grid/grid-model/grid-inline-first-line-003.html
index 2b9c3ca..c76a7f4 100644
--- a/css/css-grid/grid-model/grid-inline-first-line-003.html
+++ b/css/css-grid/grid-model/grid-inline-first-line-003.html
@@ -17,7 +17,7 @@
}
</style>
<div class="inline-grid">
- <div class="item">
- <p>This text should be <strong>green</strong> and body and paragraph margins should <strong>not collapse</strong>.</p>
- </div>
+ <p class="item">
+ This text should be <strong>green</strong> and body and paragraph margins should <strong>not collapse</strong>.
+ </p>
</div>
