Description
There's a bug in our getStackLevel code where we treat a declared z-index: 0
as having a stacking context but not a z-index.
For example, the correct stack order of the following code should be [#parent, #child, body, html]
but instead it comes out to [#parent, body, html, #child]
<div id="parent" style="position: relative: z-index: 0">
<div id="child" style="position: relative; z-index: -1; background: red"></div>
</div>
Instead we need to allow z-index: 0
to be treated as a valid z-index
value and allow the stacking level to equal 0. However doing so creates another problem though as we made the ROOT_LEVEL
z-index equal 0 and then remove root level elements when we encounter a real stack (a positioned stacking context that declares a non-auto z-index).
We'll also need to update our visuallySort
function as it treats the -1 z-index of a child context as being higher in the visual stack than the parent element, when in reality the parent should be on top.