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

Bug 1967248 - [devtools] Rerender tree nodes when their depth changes. r=devtools-reviewers,bomsy

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D250056
This commit is contained in:
Holger Benl
2025-05-22 13:17:09 +00:00
committed by hbenl@mozilla.com
parent 1c63f5fc96
commit 3ef1d1093c
6 changed files with 91 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
devtools/client/debugger/test/mochitest/browser_dbg-sources-tree.js Normal file
View File

@@ -0,0 +1,59 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
// Tests how directories that contain only one child which is a directory
// are merged with their child in the sources tree and separated again
// when another child is added (Bug 1967248).
"use strict";
add_task(async function () {
const dbg = await initDebugger("doc-nested-sources.html");
await waitForSources(dbg, "deep-nested-source.js");
await selectSource(dbg, "deep-nested-source.js");
checkSourceTree(dbg, [
["Main Thread", 1],
["example.com", 2],
["browser/devtools/client/debugger/test/mochitest/examples", 3],
["nested/deep", 4],
["deep-nested-source.js", 5],
["doc-nested-sources.html", 4],
]);
invokeInTab("loadScript");
await waitForSources(dbg, "nested-source.js");
checkSourceTree(dbg, [
["Main Thread", 1],
["example.com", 2],
["browser/devtools/client/debugger/test/mochitest/examples", 3],
["nested", 4],
["deep", 5],
["deep-nested-source.js", 6],
["nested-source.js", 5],
["doc-nested-sources.html", 4],
]);
});
function checkSourceTree(dbg, expected) {
const treeNodes = getDisplayedSourceTree(dbg);
is(
expected.length,
treeNodes.length,
"The source tree has the expected number of nodes"
);
for (let i = 0; i < expected.length; i++) {
const node = treeNodes[i];
const [label, level] = expected[i];
is(
node.querySelector(".label").textContent,
label,
`The node has the expected label`
);
is(Number(node.ariaLevel), level, `The node has the expected level`);
}
}

2
devtools/client/debugger/test/mochitest/browser_kz.toml
View File

@@ -257,6 +257,8 @@ fail-if = ["a11y_checks"] # Bug 1849028 clicked element may not be focusable and
["browser_dbg-sources-project-search.js"]
["browser_dbg-sources-tree.js"]
["browser_dbg-state-based-panels.js"]
["browser_dbg-step-in-navigate.js"]

21
devtools/client/debugger/test/mochitest/examples/doc-nested-sources.html Normal file
View File

@@ -0,0 +1,21 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Debugger test page</title>
</head>
<body>
<script>
function loadScript() {
const script = document.createElement("script");
script.src = "nested/nested-source.js";
document.body.appendChild(script);
}
</script>
<script src="nested/deep/deep-nested-source.js"></script>
</body>
</html>

3
devtools/client/debugger/test/mochitest/examples/nested/deep/deep-nested-source.js Normal file
View File

@@ -0,0 +1,3 @@
function computeSomethingElse() {
return 2;
}

4
devtools/client/debugger/test/mochitest/shared-head.js
View File

@@ -3070,6 +3070,10 @@ async function waitForSourceTreeThreadsCount(dbg, i) {
});
}
function getDisplayedSourceTree(dbg) {
return [...findAllElements(dbg, "sourceNodes")];
}
function getDisplayedSourceElements(dbg) {
return [...findAllElements(dbg, "sourceTreeFiles")];
}

3
devtools/client/shared/components/Tree.js
View File

@@ -124,7 +124,8 @@ class TreeNode extends Component {
(this.props.shouldItemUpdate &&
this.props.shouldItemUpdate(this.props.item, nextProps.item)) ||
this.props.focused !== nextProps.focused ||
this.props.expanded !== nextProps.expanded
this.props.expanded !== nextProps.expanded ||
this.props.depth !== nextProps.depth
);
}