diff --git a/conformance-search/src/pages/CoveragePage.tsx b/conformance-search/src/pages/CoveragePage.tsx index bb28f48..897eb29 100644 --- a/conformance-search/src/pages/CoveragePage.tsx +++ b/conformance-search/src/pages/CoveragePage.tsx @@ -13,19 +13,24 @@ function HighlightBox({ children }: { children: string }) { const path = children.split(".").slice(0, -1).join("."); const last = children.split(".").slice(-1)[0]; return ( -
- - {path.includes("*") ? ( - <> - {path.split("*")[0]} - - {path.split("*")[1]} - - ) : ( - path - )} +
+ + + {path.includes("*") ? ( + <> + {path.split("*")[0]} + + {path.split("*")[1]} + + ) : ( + path + )} + . + + + {last} + - .{last}
); } @@ -96,7 +101,8 @@ function CoverageTables({ {( (processedCoverageStats.lists.boxes.covered.length / - processedCoverageStats.lists.boxes.not_covered.length) * + (processedCoverageStats.lists.boxes.not_covered.length + + processedCoverageStats.lists.boxes.covered.length)) * 100 ).toFixed(2)} % @@ -382,6 +388,24 @@ export default function CoveragePage() { return { boxes, features }; }, [fuses, processedCoverageStats, throttledSearch]); + const maxDepth = useMemo(() => { + let max = 0; + if (!coverageStats) return max; + coverageStats.lists.boxes.covered.forEach((path) => { + const split = path.split("."); + if (split.length > max) max = split.length; + }); + coverageStats.lists.boxes.not_covered.forEach((path) => { + const split = path.split("."); + if (split.length > max) max = split.length; + }); + coverageStats.lists.boxes.under_consideration.forEach((path) => { + const split = path.split("."); + if (split.length > max) max = split.length; + }); + return max; + }, [coverageStats]); + // If screen is smaller than 1000px, then #root should have height: auto useEffect(() => { if (mobile) document.getElementById("root")?.style.setProperty("height", "auto"); @@ -425,10 +449,10 @@ export default function CoveragePage() {
Depth Setting setDepth(value as number)} step={1}