How the browser calculate the width of a flex box if text-overflow specified

Question

All:

If I set a flexbox text-overflow: ellipsis; and specify its flex as 1 1 auto; When I shrink that flexbox, how the browser calculate the value of auto?

<style>
    .flexcontainer {
        display:flex;
        flex-flow: row nowrap;
        width:100%;
        height:auto;
    }
    .test {
        flex: 1 1 auto;
        text-overflow:ellipsis;
        overflow:hidden;
        white-space: nowrap;
    }
</style>

<div class="flexcontainer">
    <div class="test">This is a flexbox to thrink</div>
    <div class="test">This is another flexbox to thrink</div>
</div>

Is it still the full length of text without cropped? Like the browser first get the total length of text without cropped in those two .test divs and use width of .flexcontainer minus that total to get shrink width?

Another question related to this is:

[1] How the browser decides if the flexbox is thrinking or growing?

[2] If I give a very very large number to flex-basis like flex: 1 1 10000000px, how the browser calculate the thrink?

Thanks

Answer 1

Flex-basis Reference

A flex-basis value set to auto sizes the element according to its size property (which can itself be the keyword auto, which sizes the element based on its contents).

So by above definition, the text-overflow: ellipsis is used by the browser when the container width is lesser than the content width.