Solution:
I do not think you can send a single request and recieve multiple responses, as you would if you were streaming the data. See this thread, jQuery read AJAX stream incrementally?.
For your use case, I think it would be better to recieve all of the post information in a single request, as this would avoid information being output to the DOM at different times, which might make it seem a bit clunky.
I would move the wp_send_json_success() function outside the post loop, so you get all the information from the query in a single response.
public function ajax_test() {
$args = [
'post_type' => 'product',
'post_status' => 'publish',
'posts_per_page' => -1,
'order' => 'ASC',
'orderby' => 'ID',
];
$products = new WP_Query($args);
if($products->have_posts()) :
//Variable to store all the results from the query
$response_data = [];
while($products->have_posts()): $products->the_post();
global $post;
$response_data[] = [ $post->ID => true ];
endwhile;
endif;
//Send response back to front end
wp_send_json_reponse($reponse_data);
die();
}
You could change the number of posts that are output by including a the desired number of posts as post data, as seen below;
$.ajax({
cache: false,
timeout: 300000, // 5 hours
url: admin_ajax_url,
type: 'GET',
data: {
action : 'test',
posts_per_page : 3 //Maximum number of posts that can be returned
},
success: function (response) {
console.log(response);
}
});
And then implementing that data in the $args arrays with;
'posts_per_page' => $_POST['posts_per_page'],