mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-08-06 16:19:23 +00:00
Inspector: Keep current property filter when switching selected node
If you have a search filter and then click on a different node, this now applies the filter to the new node's properties, instead of showing all of them.
This commit is contained in:
parent
7ed4557573
commit
a10984ea03
Notes:
github-actions[bot]
2025-02-17 11:56:51 +00:00
Author: https://github.com/AtkinsSJ
Commit: a10984ea03
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/3561
Reviewed-by: https://github.com/gmta ✅
1 changed files with 13 additions and 4 deletions
|
@ -336,6 +336,12 @@ inspector.setStyleSheetSource = (identifier, sourceBase64) => {
|
||||||
styleSheetSource.innerHTML = decodeBase64(sourceBase64);
|
styleSheetSource.innerHTML = decodeBase64(sourceBase64);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const applyPropertyFilter = (row, searchText) => {
|
||||||
|
const nameMatch = row.cells[0].textContent.toLowerCase().includes(searchText);
|
||||||
|
const valueMatch = row.cells[1].textContent.toLowerCase().includes(searchText);
|
||||||
|
row.style.display = nameMatch || valueMatch ? "" : "none";
|
||||||
|
};
|
||||||
|
|
||||||
const setupPropertyFilter = inputId => {
|
const setupPropertyFilter = inputId => {
|
||||||
const filterInput = document.getElementById(`${inputId}-filter`);
|
const filterInput = document.getElementById(`${inputId}-filter`);
|
||||||
|
|
||||||
|
@ -345,10 +351,7 @@ const setupPropertyFilter = inputId => {
|
||||||
const rows = tbody.getElementsByTagName("tr");
|
const rows = tbody.getElementsByTagName("tr");
|
||||||
|
|
||||||
for (let row of rows) {
|
for (let row of rows) {
|
||||||
const nameMatch = row.cells[0].textContent.toLowerCase().includes(searchText);
|
applyPropertyFilter(row, searchText);
|
||||||
const valueMatch = row.cells[1].textContent.toLowerCase().includes(searchText);
|
|
||||||
|
|
||||||
row.style.display = nameMatch || valueMatch ? "" : "none";
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -359,6 +362,8 @@ inspector.createPropertyTables = (computedStyle, resolvedStyle, customProperties
|
||||||
let newTable = document.createElement("tbody");
|
let newTable = document.createElement("tbody");
|
||||||
newTable.setAttribute("id", tableID);
|
newTable.setAttribute("id", tableID);
|
||||||
|
|
||||||
|
let searchText = oldTable.parentNode.parentNode.querySelector(".property-filter").value;
|
||||||
|
|
||||||
Object.keys(properties)
|
Object.keys(properties)
|
||||||
.sort((a, b) => {
|
.sort((a, b) => {
|
||||||
let baseResult = a.localeCompare(b);
|
let baseResult = a.localeCompare(b);
|
||||||
|
@ -382,6 +387,10 @@ inspector.createPropertyTables = (computedStyle, resolvedStyle, customProperties
|
||||||
|
|
||||||
let valueColumn = row.insertCell();
|
let valueColumn = row.insertCell();
|
||||||
valueColumn.innerText = properties[name];
|
valueColumn.innerText = properties[name];
|
||||||
|
|
||||||
|
if (searchText) {
|
||||||
|
applyPropertyFilter(row, searchText);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
oldTable.parentNode.replaceChild(newTable, oldTable);
|
oldTable.parentNode.replaceChild(newTable, oldTable);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue