Setting flex box percent to zero behaves differently than in CSS

[Marci599]

• I have searched existing issues and confirmed this is not a duplicate

Issues and steps to reproduce

So i have a flex box in both Android Studio and in CSS. My flex direction is row, flex warp is set to wrap and i have a few children with the width set to wrap content, flex basis percent is 0 and flex grow is 1
If i remove flex basis percent, the flex wrap works, but with flex basis percent set to 0, the parent no longer wraps it's children if needed, they just simply shrink forever.

Expected behavior

With CSS the above setup will result the children to have the exact same size when they have enough space, but when there is no longer enough space for all of them to have the exact same size, the widest ones will shrink until they can't shrink anymore, and that's when the parent wraps them.

Version of the flexbox library

3.0.0

Link to code

Android:

<com.google.android.flexbox.FlexboxLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:flexDirection="row"
    app:flexWrap="wrap">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_flexBasisPercent="0"
        app:layout_flexGrow="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_flexBasisPercent="0"
        app:layout_flexGrow="1" />
</com.google.android.flexbox.FlexboxLayout>

HTML:

<div class="cards">
 <div>
     <img src="mail.svg" alt="Email">
     <p>example@gmail.com</p>
 </div>
 <div>
     <img src="discord-icon-svgrepo-com.svg" alt="Discord">
     <p>example</p>
 </div>
 <div>
     <img src="fiverr_logo.png" alt="Fiverr">
     <p>@example</p>
 </div>
</div>

CSS for HTML:

.cards{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.cards > div{
    display: flex;
    background-color:  black;
    flex-grow: 1;
    flex-basis: 0;
}

Android
https://github.com/google/flexbox-layout/assets/40640441/b40b153c-b7c4-4b44-bed5-41e0ee328194

HTML, CSS
https://github.com/google/flexbox-layout/assets/40640441/74079d21-9e67-403d-a1bb-271559268b16