How Elementor z adapts to edit WooCommerce product pages

utilization Elementor customizable WooCommerce Product Pageand encountered the following challenges:

1. Create a product: The product has been created in WooCommerce.
2. Installation of the "Additional Product Options" plug-in: Added the ability to color swatch and dynamically change the product image based on the selected color.

The following guidance is sought:

1. Convert WooCommerce Product Pages to Editable Elementor PagesThe
2. Ensure that WooCommerce product pages and their additional features remain functional after customization with ElementorThe

How does this logic go?