{
 "ranAt": "2026-11-08T21:09:34.464Z",
 "platform": "Windows_NT 10.0.26200",
 "playwright": "1.56.1",
 "viewport": {
  "width": 1000,
  "height": 800
 },
 "versions": {
  "Chrome": "156.0.8078.80",
  "Firefox": "159.0.1",
  "WebKit": "26.0"
 },
 "oracle": "bug = panel children sit in 2 or more columns and the rightmost child passes the panel's right edge by more than 1px",
 "target": {
  "Chrome": false,
  "Firefox": true,
  "WebKit": true
 },
 "steps": [
  {
   "id": "original",
   "label": "The page as built",
   "status": "kept",
   "elements": 452,
   "cssRules": 274,
   "bytes": 40481,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 746,
     "columns": 4,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    }
   }
  },
  {
   "id": "delete-scripts",
   "label": "Delete the scripts",
   "status": "undone",
   "elements": 451,
   "cssRules": 274,
   "bytes": 40203,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 0,
     "columns": 0,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 0,
     "columns": 0,
     "spill": 0,
     "bug": false
    },
    "WebKit": {
     "found": true,
     "width": 0,
     "columns": 0,
     "spill": 0,
     "bug": false
    }
   }
  },
  {
   "id": "freeze",
   "label": "Save the page as rendered, then delete the scripts",
   "status": "kept",
   "elements": 451,
   "cssRules": 274,
   "bytes": 39735,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 746,
     "columns": 4,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    }
   }
  },
  {
   "id": "sections",
   "label": "Delete top-level sections, one at a time",
   "status": "kept",
   "elements": 122,
   "cssRules": 274,
   "bytes": 18165,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 746,
     "columns": 4,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    }
   },
   "tried": 7,
   "removed": 6
  },
  {
   "id": "unused-css",
   "label": "Delete CSS rules that match nothing on the page",
   "status": "kept",
   "elements": 122,
   "cssRules": 36,
   "bytes": 8122,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 746,
     "columns": 4,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 194,
     "columns": 4,
     "spill": 535,
     "bug": true
    }
   },
   "tried": 1,
   "removed": 238
  },
  {
   "id": "css-rules",
   "label": "Try deleting each remaining CSS rule",
   "status": "kept",
   "elements": 122,
   "cssRules": 5,
   "bytes": 5950,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 437.55,
     "columns": 3,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 157.97,
     "columns": 3,
     "spill": 262.6,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 157.97,
     "columns": 3,
     "spill": 262.58,
     "bug": true
    }
   },
   "tried": 36,
   "removed": 31,
   "needed": [
    "h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote",
    ":root",
    ".menu",
    ".nav__item--shop.is-open .menu",
    ".menu"
   ]
  },
  {
   "id": "elements",
   "label": "Try deleting each remaining element",
   "status": "kept",
   "elements": 34,
   "cssRules": 5,
   "bytes": 2168,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 170.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.22,
     "bug": true
    }
   },
   "tried": 122,
   "removed": 88
  },
  {
   "id": "unwrap",
   "label": "Try replacing each element with its children",
   "status": "kept",
   "elements": 27,
   "cssRules": 5,
   "bytes": 1939,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 170.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.22,
     "bug": true
    }
   },
   "tried": 13,
   "removed": 7
  },
  {
   "id": "whitespace",
   "label": "Delete whitespace between elements",
   "status": "kept",
   "elements": 27,
   "cssRules": 5,
   "bytes": 1620,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 170.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.22,
     "bug": true
    }
   },
   "tried": 1,
   "removed": 1
  },
  {
   "id": "attributes",
   "label": "Try deleting each attribute",
   "status": "kept",
   "elements": 27,
   "cssRules": 5,
   "bytes": 1116,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 170.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.22,
     "bug": true
    }
   },
   "tried": 29,
   "removed": 26
  },
  {
   "id": "media",
   "label": "Try lifting rules out of media queries",
   "status": "kept",
   "elements": 27,
   "cssRules": 5,
   "bytes": 1084,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 170.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 2,
     "spill": 61.22,
     "bug": true
    }
   },
   "tried": 1,
   "removed": 1
  },
  {
   "id": "css-rules-2",
   "label": "Try deleting each CSS rule again",
   "status": "kept",
   "elements": 27,
   "cssRules": 4,
   "bytes": 1015,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 234.02,
     "columns": 3,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 91.8,
     "columns": 3,
     "spill": 125.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 91.8,
     "columns": 3,
     "spill": 125.22,
     "bug": true
    }
   },
   "tried": 5,
   "removed": 1,
   "needed": [
    ":root",
    ".menu",
    ".nav__item--shop.is-open .menu",
    ".menu"
   ]
  },
  {
   "id": "declarations",
   "label": "Try deleting each CSS declaration",
   "status": "kept",
   "elements": 27,
   "cssRules": 4,
   "bytes": 687,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 112.02,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 54.23,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 54.22,
     "bug": true
    }
   },
   "tried": 22,
   "removed": 16,
   "needed": [
    ":root { --menu-rows: 8 }",
    ":root { --row: 3rem }",
    ".menu { flex-flow: column wrap }",
    ".nav__item--shop.is-open .menu { display: flex }",
    ".menu { position: absolute }",
    ".menu { max-height: calc(var(--menu-rows) * var(--row)) }"
   ]
  },
  {
   "id": "elements-2",
   "label": "Try deleting each element again",
   "status": "kept",
   "elements": 15,
   "cssRules": 4,
   "bytes": 572,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 97.8,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 40,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 40,
     "bug": true
    }
   },
   "tried": 27,
   "removed": 12
  },
  {
   "id": "literals",
   "label": "Replace custom properties with their values",
   "status": "kept",
   "elements": 15,
   "cssRules": 3,
   "bytes": 512,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 97.8,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 40,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 57.8,
     "columns": 2,
     "spill": 40,
     "bug": true
    }
   }
  },
  {
   "id": "by-hand",
   "label": "Rewrite by hand with fixed sizes and no text",
   "status": "kept",
   "elements": 3,
   "cssRules": 2,
   "bytes": 342,
   "observed": {
    "Chrome": {
     "found": true,
     "width": 100,
     "columns": 2,
     "spill": 0,
     "bug": false
    },
    "Firefox": {
     "found": true,
     "width": 50,
     "columns": 2,
     "spill": 50,
     "bug": true
    },
    "WebKit": {
     "found": true,
     "width": 50,
     "columns": 2,
     "spill": 50,
     "bug": true
    }
   }
  }
 ],
 "strictAttempts": 264,
 "finalHtml": "<!doctype html>\n<meta charset=\"utf-8\">\n<title>Column-wrap flex container sized as one column</title>\n<style>\n#shop-menu { position: absolute; display: flex; flex-flow: column wrap; max-height: 100px; background: gold; }\n#shop-menu div { width: 50px; height: 60px; background: teal; }\n</style>\n<div id=\"shop-menu\"><div></div><div></div></div>\n",
 "variants": {
  "as reduced": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "no flex-wrap": {
   "Chrome": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   }
  },
  "no max-height": {
   "Chrome": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 1,
    "spill": 0,
    "bug": false
   }
  },
  "no position: absolute": {
   "Chrome": {
    "found": true,
    "width": 984,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 984,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 984,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  },
  "height in place of max-height": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "display: inline-flex, not absolute": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "float: left, not absolute": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "width: max-content": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "width: fit-content": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   },
   "WebKit": {
    "found": true,
    "width": 50,
    "columns": 2,
    "spill": 50,
    "bug": true
   }
  },
  "row wrap instead of column wrap": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  },
  "grid: grid-auto-flow column": {
   "Chrome": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 100,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  },
  "columns: multi-column layout": {
   "Chrome": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  },
  "explicit width: 150px": {
   "Chrome": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 150,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  }
 },
 "loose": {
  "check": "panel width differs between Firefox and Chrome by more than 0.01px",
  "attempts": 191,
  "elements": 4,
  "cssRules": 2,
  "html": "<!doctype html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>Trailhead Supply</title>\n<style>\n.nav__item--shop.is-open .menu { display: flex; }\n.menu { position: absolute; }\n</style>\n\n</head>\n<body>\n<li class=\"nav__item nav__item--shop is-open\"><div class=\"menu\" id=\"shop-menu\"><h4>Sleeping</h4><h4>Kitchen</h4></div></li>\n</body>\n</html>\n",
  "observed": {
   "Chrome": {
    "found": true,
    "width": 112.02,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "Firefox": {
    "found": true,
    "width": 112.03,
    "columns": 2,
    "spill": 0,
    "bug": false
   },
   "WebKit": {
    "found": true,
    "width": 112.02,
    "columns": 2,
    "spill": 0,
    "bug": false
   }
  }
 }
}