Bug 1901037 - [devtools] Add test for ::details-content pseudo element in Rules view. r=devtools-reviewers,bomsy.

Depends on D241100.

Differential Revision: https://phabricator.services.mozilla.com/D241397
This commit is contained in:
Nicolas Chevobbe
2025-03-18 06:18:22 +00:00
parent f259acf13b
commit c64b6eb629
2 changed files with 24 additions and 0 deletions

View File

@@ -13,6 +13,7 @@ add_task(async function () {
await pushPref("dom.customHighlightAPI.enabled", true);
await pushPref("dom.text_fragments.enabled", true);
await pushPref("layout.css.modern-range-pseudos.enabled", true);
await pushPref("layout.css.details-content.enabled", true);
await pushPref("full-screen-api.transition-duration.enter", "0 0");
await pushPref("full-screen-api.transition-duration.leave", "0 0");
@@ -29,6 +30,7 @@ add_task(async function () {
await testCustomHighlight(inspector, view);
await testSlider(inspector, view);
await testUrlFragmentTextDirective(inspector, view);
await testDetailsContent(inspector, view);
// keep this one last as it makes the browser go fullscreen and seem to impact other tests
await testBackdrop(inspector, view);
});
@@ -461,6 +463,15 @@ async function testUrlFragmentTextDirective(inspector, view) {
assertGutters(view);
}
async function testDetailsContent(inspector, view) {
await assertPseudoElementRulesNumbers("details", inspector, view, {
// `element`, `*`, and inherited `body`
elementRules: 3,
detailsContentRules: 1,
});
assertGutters(view);
}
function convertTextPropsToString(textProps) {
return textProps
.map(
@@ -491,6 +502,7 @@ const PSEUDO_DICT = {
sliderThumbRules: "::slider-thumb",
sliderTrackRules: "::slider-track",
targetTextRules: "::target-text",
detailsContentRules: "::details-content",
};
async function assertPseudoElementRulesNumbers(

View File

@@ -150,6 +150,12 @@ input::slider-track {
.url-fragment-text-directives::target-text {
background-color: salmon;
}
details[open]::details-content {
color: hotpink;
border: 4px solid darkmagenta;
}
</style>
</head>
<body>
@@ -192,6 +198,12 @@ input::slider-track {
<canvas></canvas>
<details open>
<summary>Summary</summary>
<h2>::details-content</h2>
<p>In details</p>
</details>
<script>
"use strict";
// This is the only way to have the ::backdrop style to be applied