UI extraction functions have nondeterministic ordering

[ickshonpe]

Bevy version

0.11

What you did

use bevy::prelude::*;

fn main() {
    App::new()
    .add_plugins(DefaultPlugins)
    .add_systems(Startup, setup)
    .run()
}

fn setup(
    mut commands: Commands,
    asset_server: Res<AssetServer>,
    mut texture_atlases: ResMut<Assets<TextureAtlas>>,
) {
    commands.spawn(Camera2dBundle::default());
    let image = asset_server.load("numbered_grid_texture_atlas.png");
    let texture_atlas = TextureAtlas::from_grid(image.clone(), 16. * Vec2::ONE, 4, 4, None, None);
    let texture_atlas_handle = texture_atlases.add(texture_atlas);
    commands.spawn(NodeBundle {
        style: Style {
            padding: UiRect::all(Val::Px(10.)),
            column_gap: Val::Px(10.),
            ..Default::default()
        },
        ..Default::default()
    }).with_children(|commands| {
        commands.spawn((NodeBundle {
            style: Style {
                width: Val::Px(400.),
                height: Val::Px(400.),
                border: UiRect::all(Val::Px(10.)),
                ..Default::default()
            },
            border_color: BorderColor(Color::RED),
            background_color: Color::WHITE.into(),
            ..Default::default()
        },
            texture_atlas_handle.clone(),
            UiTextureAtlasImage { index: 1, ..Default::default() },
        ));    
        commands.spawn((NodeBundle {
            style: Style {
                width: Val::Px(400.),
                height: Val::Px(400.),
                border: UiRect::all(Val::Px(10.)),
                ..Default::default()
            },
            border_color: BorderColor(Color::RED),
            background_color: Color::WHITE.with_a(0.5).into(),
            ..Default::default()
        },
            texture_atlas_handle,
            UiTextureAtlasImage { index: 1, ..Default::default() },
        ));    
    });
}

What went wrong

Run the example once, borders drawn before texture atlas image nodes:

Run it again, borders drawn after:

In bevy_ui::render::build_ui_render:

        .add_systems(
            ExtractSchedule,
            (
                extract_default_ui_camera_view::<Camera2d>,
                extract_default_ui_camera_view::<Camera3d>,
                extract_uinodes.in_set(RenderUiSystem::ExtractNode),
                extract_atlas_uinodes.after(RenderUiSystem::ExtractNode),
                extract_uinode_borders.after(RenderUiSystem::ExtractNode),
                #[cfg(feature = "bevy_text")]
                extract_text_uinodes.after(RenderUiSystem::ExtractNode),
            ),
        )

extract_uinode_borders and extract_text_uinodes both need to run after extract_atlas_uinodes.

Additional details

The order for extract_text_uinodes and extract_uinode_borders doesn't matter because the borders query has a Without<ContentSize> filter which means that text nodes can't have borders. It wasn't clear how borders for intrinsically sized nodes should be implemented, so the filter was added to sidestep the issue. But extract_atlas_uinodes was added after the borders PR and this issue with the system ordering was missed.