Question

我正在尝试使用Weinre来调试AngularJS应用程序，但样式检查不起作用。我可以使用Weinre在页面上选择元素，但它从不显示来自CSS选择器的相关样式信息。我已经将它缩小到仅仅包括AngularJS（我使用的是版本1.2.5）在页面中断Weinre样式检查。我在网上发现了一些Weinre没有使用AngularJS（https://issues.apache.org/jira/browse/CB-2651）的参考文献，但是JIRA说它已经解决了。有什么想法吗？

Answer 1

包含以下功能，并在您的页面上尽早运行：

function whackWebkitMatchesSelector() {
    var oldMatches = Element.prototype.webkitMatchesSelector

    function newMatches(selector) {
        try {
            return oldMatches.call(this, selector)
        }
        catch (err) {
            return false
        }
    }

    Element.prototype.webkitMatchesSelector = newMatches
}

whackWebkitMatchesSelector()

正如https://issues.apache.org/jira/browse/CB-6161中所述我现在可以检查大多数（可能不是全部）样式。

Answer 2

他们通过捕获异常并继续“修复”它。显然这个问题是由（webkit认为的）无效的CSS选择器引起的。

Answer 3

我知道这个问题已经过时但我在Internet Explorer 11下进行调试时遇到了同样的问题。我已经更新了之前的 whackWebkitMatchesSelector 以包含IE案例：< / p>

function whackWebkitMatchesSelector() {
  var oldMatches;

  if (Element.prototype.msMatchesSelector) {
    oldMatches = Element.prototype.msMatchesSelector;
    Element.prototype.msMatchesSelector = function(selector) {
      try { return oldMatches.call(this, selector); }
      catch (err) { return false; }
    };
  } else if (Element.prototype.webkitMatchesSelector) {
    oldMatches = Element.prototype.webkitMatchesSelector;
    Element.prototype.webkitMatchesSelector = function(selector) {
      try { return oldMatches.call(this, selector); }
      catch (err) { return false; }
    };
  }
}

whackWebkitMatchesSelector();

Weinre样式检查不适用于AngularJS

3 个答案: