mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-04-22 12:35:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Inspector: Keep property filter across tabs

Browse source 
Remember the query, so that if you're filtering for "color" on the
computed style tab, and switch to the resolved style tab, it's filtered
for "color" too.

This means we also can save looking up the filter text when a new node
is inspected.
This commit is contained in:
Sam Atkins 2025-02-13 16:33:25 +00:00 • committed by Jelle Raaijmakers
parent 4c024e41cb
commit 7be78ec044
Notes: github-actions[bot] 2025-02-17 11:56:33 +00:00
1 changed files with 12 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
Base/res/ladybird/inspector.js
View file

@ -62,6 +62,14 @@ const selectTab = (tabButton, tabID, selectedTab, selectedTabButton) => {
tab.style.display = "block";
tabButton.classList.add("active");
// Apply any filtering if we have it
let filterInput = tab.querySelector(".property-filter");
let propertyTable = tab.querySelector(".property-table");
if (filterInput && propertyTable) {
filterInput.value = inspector.propertyFilterText || "";
filterInput.dispatchEvent(new InputEvent("input"));
}
return tab;
};
@ -361,12 +369,12 @@ const setupPropertyFilter = inputId => {
const filterInput = document.getElementById(`${inputId}-filter`);
filterInput.addEventListener("input", event => {
const searchText = event.target.value.toLowerCase();
inspector.propertyFilterText = event.target.value.toLowerCase();
const tbody = document.getElementById(`${inputId}-table`);
const rows = tbody.getElementsByTagName("tr");
for (let row of rows) {
applyPropertyFilter(row, searchText);
applyPropertyFilter(row, inspector.propertyFilterText);
}
});
};
@ -377,8 +385,6 @@ inspector.createPropertyTables = (computedStyle, resolvedStyle, customProperties
let newTable = document.createElement("tbody");
newTable.setAttribute("id", tableID);
let searchText = oldTable.parentNode.parentNode.querySelector(".property-filter").value;
Object.keys(properties)
.sort((a, b) => {
let baseResult = a.localeCompare(b);
@ -403,8 +409,8 @@ inspector.createPropertyTables = (computedStyle, resolvedStyle, customProperties
let valueColumn = row.insertCell();
valueColumn.innerText = properties[name];
if (searchText) {
applyPropertyFilter(row, searchText);
if (inspector.propertyFilterText) {
applyPropertyFilter(row, inspector.propertyFilterText);
}
});