Bug 1820784 - [devtools] Fix highlight matches for regex search results r=nchevobbe,devtools-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D171977
This commit is contained in:
Hubert Boma Manilla 2023-03-13 15:36:44 +00:00
parent 0dab8c2f81
commit 07bace34f0
4 changed files with 40 additions and 8 deletions

View File

@ -548,7 +548,8 @@ function getMatches(query, text, modifiers) {
matchedLocations.push({
line: i,
ch: singleMatch.index
ch: singleMatch.index,
match: singleMatch[0]
}); // When the match is an empty string the regexQuery.lastIndex will not
// change resulting in an infinite loop so we need to check for this and
// increment it manually in that case. See issue #7023
@ -757,7 +758,8 @@ function findSourceMatches(sourceId, content, queryText, modifiers) {
const lines = text.split("\n");
return (0, _getMatches.default)(queryText, text, modifiers).map(({
line,
ch
ch,
match
}) => {
const {
value,
@ -768,7 +770,7 @@ function findSourceMatches(sourceId, content, queryText, modifiers) {
line: line + 1,
column: ch,
matchIndex,
match: queryText,
match,
value
};
});
@ -777,7 +779,8 @@ function findSourceMatches(sourceId, content, queryText, modifiers) {
const startRegex = /([ !@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?])/g; // Similarly, find
const endRegex = new RegExp(["([ !@#$%^&*()_+-=[]{};':\"\\|,.<>/?])", '[^ !@#$%^&*()_+-=[]{};\':"\\|,.<>/?]*$"/'].join(""));
const endRegex = new RegExp(["([ !@#$%^&*()_+-=[]{};':\"\\|,.<>/?])", '[^ !@#$%^&*()_+-=[]{};\':"\\|,.<>/?]*$"/'].join("")); // For texts over 100 characterss this truncates the text (for display)
// around the context of the matched text.
function truncateLine(text, column) {
if (text.length < 100) {

View File

@ -23,7 +23,11 @@ export default function getMatches(query, text, modifiers) {
throw new Error("no singleMatch");
}
matchedLocations.push({ line: i, ch: singleMatch.index });
matchedLocations.push({
line: i,
ch: singleMatch.index,
match: singleMatch[0],
});
// When the match is an empty string the regexQuery.lastIndex will not
// change resulting in an infinite loop so we need to check for this and

View File

@ -14,14 +14,14 @@ export function findSourceMatches(sourceId, content, queryText, modifiers) {
const text = content.value;
const lines = text.split("\n");
return getMatches(queryText, text, modifiers).map(({ line, ch }) => {
return getMatches(queryText, text, modifiers).map(({ line, ch, match }) => {
const { value, matchIndex } = truncateLine(lines[line], ch);
return {
sourceId,
line: line + 1,
column: ch,
matchIndex,
match: queryText,
match,
value,
};
});
@ -36,7 +36,8 @@ const endRegex = new RegExp(
'[^ !@#$%^&*()_+-=[]{};\':"\\|,.<>/?]*$"/',
].join("")
);
// For texts over 100 characters this truncates the text (for display)
// around the context of the matched text.
function truncateLine(text, column) {
if (text.length < 100) {
return {

View File

@ -69,6 +69,30 @@ add_task(async function testSimpleProjectSearch() {
);
});
add_task(async function testMatchesForRegexSearches() {
const dbg = await initDebugger("doc-react.html", "App.js");
await openProjectSearch(dbg);
type(dbg, "import .* from 'react'");
await clickElement(dbg, "projectSearchModifiersRegexMatch");
await waitForSearchResults(dbg, 2);
const queryMatch = findAllElements(dbg, "fileMatch")[1].querySelector(
".query-match"
);
is(
queryMatch.innerText,
"import React, { Component } from 'react'",
"The highlighted text matches the search term"
);
// Turn off the regex modifier so does not break tests below
await clickElement(dbg, "projectSearchModifiersRegexMatch");
await closeProjectSearch(dbg);
});
// Test expanding search results to reveal the search matches.
add_task(async function testExpandSearchResultsToShowMatches() {
const dbg = await initDebugger("doc-react.html", "App.js");