UserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36

Steps to reproduce the problem:
1. in Console tab enter: document.body.appendChild(document.createElement("style"));document.styleSheets[document.styleSheets.length-1].insertRule("body{background:red!important}",0)
2. in Elements tab scroll to bottom of HTML
3. Expand the <style></style> tags just before </body> (closing body tag)

What is the expected behavior?
I should see the JS injected style declaration in the JS injected Style node

What went wrong?
You tell me...

Did this work before? N/A 

Chrome version: 54.0.2840.71  Channel: n/a
OS Version: 10.0
Flash Version: Shockwave Flash 23.0 r0

Yes you can see the new rule in the Styles panel if you highlight the element to which it applies, but why doesn't it just work like injecting DOM elements?
Firebug shows dynamically injected styles in its CSS panel...