Doesn't update after parent display changes

[wnewbery]

I found if used as a child element within an (emulated using display: none) <details> that it is never detected that the grid is displayed, seemingly because such attribute changes are not being observed.

From what I can tell this is because it inserted id's and CSS rules forcing a size of zero already, and so when displayed its still zero and no update :(

One possibility I found is to also check for offsetParent. In simple cases it will be null if not displayed, but its also null if the element itself is positioned: fixed at which point I am not sure.

css-grid/polyfill.js#L95

// TODO: watch resize events for relayout?
var lastWidth = element.offsetWidth;
var lastHeight = element.offsetHeight;
var lastParent = element.offsetParent; // Added
var updateOnResize = function() {
  if(!element.gridLayout) { return; }
  if(lastWidth != element.offsetWidth || lastHeight != element.offsetHeight || 
      lastParent !== element.offsetParent) {
    // update last known size
    lastWidth = element.offsetWidth;
    lastHeight = element.offsetHeight;
    lastParent = element.offsetParent;
    // relayout (and prevent double-dispatch)
    element.gridLayout.scheduleRelayout();
  }
  requestAnimationFrame(updateOnResize);
}

[FremyCompany]

Interesting approach.