corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

12
devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js
View File

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

12
devtools/client/inspector/rules/test/doc_pseudoelement.html
View File

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