javascript - 检索覆盖的计算样式链

Question

我想分析页面并检测具有一些覆盖样式的元素。

我想调查的元素集合有限。

我已经开始为每个元素获取 computedStyles，我希望在 Chrome DeveloperTools 中得到类似的输出：

let computedStyles = window.getComputedStyle(document.getElementById("testing-element"));

但是只有一个 CSSStyleDeclaration 实例，它只代表样式的结果集合。

相反，我希望看到类似这样的单一样式（例如字体大小）：

font-size:  24px;
---
24px        .error-page-title         myCustom.css
22px        h1                        common.css
2.42857rem  h1                        master.css
2em         h1                        user agent stylesheet

现在，我将能够确定哪个元素已被其他 css（或直接元素样式属性）覆盖，而不是 master.css 或 common.css。

此类信息在 Chrome 的 DevTools 中可见，但我需要将其自动化以收集一些报告。

或者是否有任何工作工具可以提供此功能？