To get only available “In stock” displayed sizes, you need something a little more complicated and different:
add_action( 'woocommerce_after_shop_loop_item_title', 'display_instock_sizes', 5 );
function display_instock_sizes() {
global $product;
if ( $product->is_type('variable') ) {
$taxonomy = 'pa_size'; // The product attribute taxonomy
$sizes_array = []; // Initializing
// Loop through available variation Ids for the variable product
foreach( $product->get_children() as $child_id ) {
$variation = wc_get_product( $child_id ); // Get the WC_Product_Variation object
if( $variation->is_purchasable() && $variation->is_in_stock() ) {
$term_name = $variation->get_attribute( $taxonomy );
$sizes_array[$term_name] = $term_name;
}
}
echo '<span class="attribute-size">' . implode( ', ', $sizes_array ) . '</span>';
}
}
Code goes in functions.php file of the active child theme (or active theme). Tested and works.