The two examples above have identical markup, with one exception: the first example has "align-items:stretch" (the initial value) on the outermost flex container, whereas the second example has "align-items:flex-end".
In Chrome and Opera (Presto), this difference causes the testcases to have different heights (main sizes) on the outermost flex container (black dotted border) and its sole flex item (orange dashed border). In contrast, Firefox (version 27 and below) gives the two examples identical (tall) heights.
I think the Firefox (27 and below) behavior is correct per the current spec, since the spec's algorithm establishes the item's and container's main-sizes before "stretch" is applied. So the main-size should be the same, regardless of whether we're stretching. But perhaps the spec should be changed?
(NOTE: The Firefox behavior changed in version 28 to match Chrome and Opera, though the spec still has an issue open on this.)