Weinre Style Inspection funktioniert nicht mit AngularJS

Question

Ich versuche Weinre zu verwenden, um eine AngularJS-Anwendung zu debuggen, aber die Style-Inspektion funktioniert nicht. Ich kann Weinre verwenden, um Elemente auf der Seite auszuwählen, aber es zeigt nie die zugehörigen Stilinformationen, die von CSS-Selektoren stammen. Ich habe es auf AngularJS beschränkt (ich benutze Version 1.2.5) auf der Seite bricht Weinre Stil Inspektion. Ich habe ein paar Referenzen gefunden, dass Weinre nicht mit AngularJS arbeitet (https://issues.apache.org/jira/browse/CB-2651), aber die JIRAs sagen, dass es gelöst ist. Irgendwelche Ideen?

Answer 1

Sie "fixiert" es, indem sie die Ausnahme fangen und weitermachen. Offensichtlich wird das Problem durch (was Webkit denkt) ungültige CSS-Selektoren verursacht.

Answer 2

Fügen Sie die folgende Funktion, und es früh auf Ihrer Seite ausführen:

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() 

Wie in https://issues.apache.org/jira/browse/CB-6161 vorgeschlagen kann ich jetzt die meisten inspizieren (wahrscheinlich nicht alle) Stile.

Answer 3

Ich weiß, diese Frage ist alt, aber ich habe über die gleiche kommen, wenn sie unter den Internet Explorer Debuggen 11. Ich habe aktualisiert die vorherige whackWebkitMatchesSelector den IE Fall enthalten:

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();