Is there a way to know how inline css property value was set using developer tools?

Question

i'm having a bad time with a javascript-based layout, so I was wondering if there's a way, using Chrome Dev Tools, to know, for example, which line of JS set my element's width. Is chrome capable of detecting that?

Answer 1

Since an inline CSS property change actually modifies your element's "style" attribute, you can as well break on the element's attribute modifications (in the Elements panel, right-click an element and choose Break on... -> Attribute Modifications).

Answer 2

Under the Sources tab of the Chrome developer tools you can set the execution to pause on DOM mutation. Here is the link to the relevant section of the documentation