Whenever a user is selecting a different product attribute I am generating a new photo and setting it for variation. The problem I have is that I do not know how to show a newly generated photo? If I reload the page and select the same attributes I get the needed image, but I want this to happen instantly after the user selects the attributes (and after the photo is generated).
Here are the scarps of the code I am using. Uploading an external link
$upload = wp_upload_bits( basename( $mockImageUrl), null, $response['body'] );
Generating an attachment and returning a new url:
$attachment_id = wp_insert_attachment( $attachment, $upload["file"] );
require_once(ABSPATH . 'wp-admin/includes/image.php');
$attachment_data = wp_generate_attachment_metadata( $attachment_id, $upload["file"]); // we can think about removing this later
wp_update_attachment_metadata( $attachment_id, $attachment_data );
set_post_thumbnail( $variation_id, $attachment_id );
echo json_encode($mockImageUrl);
Now new photo for variation is set, but the user still sees an old photo until refresh.
You can update the current DOM without refreshing the page. you will have to upload image by using wordpress ajax. see below link. WordPress image upload Using ajax?