Quando há apenas uma linha de "itens flexíveis", o Chrome e o Firefox mostram resultados diferentes. Quando há mais de uma linha (quebra automática), o Chrome e o Firefox mostram o mesmo resultado!

Então, por que isso está acontecendo? Isso é um bug ou existe algum "valor padrão" ou diferença que estou perdendo?

body{
    background-color: teal;
}

.flexContainer{
    background-color: blue;
    border: 1px solid black;
    height: 300px;
}
.flexItem{
    background-color: red;
    border: 1px solid black;
}

.flexContainer{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: stretch;
    align-content: flex-start;
}

.flexItem{ 
    flex: 0 1 0; 
}

<div class="flexContainer">
    <div class="flexItem">1111111111111111111</div>
    <div class="flexItem">2222<br/>2222</div>
    <div class="flexItem">3333<br/>3333<br/>3333</div>
    <div class="flexItem">4444444444444444444</div>
</div>