Bug 1980892 - [devtools] Remove use of InspectorUtils.isCustomElementName on WalkerSearch#_searchSelectors. a=RyanVM.

We used to check if the passed query looked like a tag name so we could
bail out early, as we'd get those results from _searchIndex.
But InspectorUtils.isCustomElementName does match some legitimate
selectors, like div.a-b.
Let's remove the check on custom element and trigger the search in such case.

Original Revision: https://phabricator.services.mozilla.com/D259783

Differential Revision: https://phabricator.services.mozilla.com/D260238
This commit is contained in:
Nicolas Chevobbe
2025-08-07 15:18:10 +00:00
committed by rvandermeulen@mozilla.com
parent 1f0cb9a0b9
commit 8a33ca95a6
3 changed files with 26 additions and 6 deletions

View File

@@ -271,12 +271,7 @@ class WalkerSearch {
// will lead the same results since it has access to tagnames anyway // will lead the same results since it has access to tagnames anyway
if ( if (
// regular tagname // regular tagname
query.match(/^[a-z]+$/i) || query.match(/^[a-z]+$/i)
// custom element names
InspectorUtils.isCustomElementName(
query,
this.walker.targetActor.window.document.documentElement.namespaceURI
)
) { ) {
return; return;
} }

View File

@@ -193,6 +193,10 @@ add_task(async function () {
{ node: inspectee.getElementById("pseudo"), type: "attributeName" }, { node: inspectee.getElementById("pseudo"), type: "attributeName" },
{ node: inspectee.getElementById("arrows"), type: "attributeName" }, { node: inspectee.getElementById("arrows"), type: "attributeName" },
{ node: inspectee.getElementById("💩"), type: "attributeName" }, { node: inspectee.getElementById("💩"), type: "attributeName" },
{
node: inspectee.getElementById("with-hyphen"),
type: "attributeName",
},
], ],
}, },
{ {
@@ -295,6 +299,26 @@ add_task(async function () {
{ node: inspectee.querySelector("#arrows"), type: "xpath" }, { node: inspectee.querySelector("#arrows"), type: "xpath" },
], ],
}, },
{
desc: "Search using div + id with hyphen",
search: "div#with-hyphen",
expected: [
{
node: inspectee.querySelector("div#with-hyphen"),
type: "selector",
},
],
},
{
desc: "Search using div + class with hyphen",
search: "div.with-hyphen",
expected: [
{
node: inspectee.querySelector("div.with-hyphen"),
type: "selector",
},
],
},
]; ];
const assertSearchResults = (searchResults, expectedResults, msg) => { const assertSearchResults = (searchResults, expectedResults, msg) => {

View File

@@ -50,6 +50,7 @@
<h4>Heading 4</h4> <h4>Heading 4</h4>
<div class="💩" id="💩" 💩="💩"></div> <div class="💩" id="💩" 💩="💩"></div>
<div id="with-hyphen" class="with-hyphen">hyphen</div>
<aside> <aside>
<article><p></p></article> <article><p></p></article>