kraken
kraken copied to clipboard
flex-shrink 计算未考虑 flex container 的 max-width/max-height
重现代码 | Code example:
xit("size 002", async () => {
let flexbox_7;
flexbox_7 = createElement(
"div",
{
class: "flexbox column horizontal",
"data-expected-height": "33",
style: {
display: "flex",
"-webkit-flex-direction": "column",
"flex-direction": "column",
"background-color": "#aaa",
position: "relative",
width: "400px",
"box-sizing": "border-box",
"min-height": "5px",
"max-height": "30px",
"padding-top": "1px",
"padding-bottom": "2px",
},
},
[
createElement(
"div",
{
"data-expected-height": "15",
"data-offset-y": "1",
style: {
width: "100%",
"background-color": "blue",
"box-sizing": "border-box",
"min-height": "0",
flex: "0 1 auto",
},
},
[
createElement("div", {
style: {
width: "100%",
"box-sizing": "border-box",
height: "20px",
},
}),
]
),
createElement(
"div",
{
"data-expected-height": "15",
"data-offset-y": "16",
style: {
width: "100%",
"background-color": "green",
"box-sizing": "border-box",
"min-height": "0",
flex: "0 1 auto",
},
},
[
createElement("div", {
style: {
width: "100%",
"box-sizing": "border-box",
height: "20px",
},
}),
]
),
]
);
BODY.appendChild(flexbox_7);
await snapshot();
});
预期结果 | Expected results:
实际结果 | Actual results: