Woocommerce 2 Variable Product Dropdown List, force first one to always show all options

Please check below code. Hope this would help you.

jQuery(document).ready(function($){    if (jQuery('form.variations_form').length) {        let $form              = jQuery('form.variations_form');        let $first_attr_select = $form.find( '.variations select' ).eq(0);        let first_attr_val     = $first_attr_select.val() || '';        $first_attr_select.on('change', function(e){            if (!e.isTrigger) {                // store the real value only                first_attr_val = this.value;            }        });        $form.on('woocommerce_update_variation_values', function(){            let first_attr_name       = $first_attr_select.data( 'attribute_name' ) || $first_attr_select.attr( 'name' ),                show_option_none        = $first_attr_select.data( 'show_option_none' ),                option_gt_filter        = ':gt(0)',                attached_options_count  = 0,                new_attr_select         = $( '<select/>' ),                first_attr_val_valid = true;            let variations          = $form.data('product_variations');            new_attr_select.html( $first_attr_select.data( 'attribute_html' ) );            // Loop through variations.            for ( let variation of variations ) {                if ( typeof( variation ) !== 'undefined' && first_attr_name in variation.attributes ) {                    let attr_val         = variation.attributes[ first_attr_name ],                        variation_active = variation.variation_is_active ? 'enabled' : '';                    if ( attr_val ) {                        // Decode entities.                        attr_val = $( '<div/>' ).html( attr_val ).text();                        // Attach to matching options by value. This is done to compare                        // TEXT values rather than any HTML entities.                        var $option_elements = new_attr_select.find( 'option' );                        for (var i = 0, len = $option_elements.length; i < len; i++) {                            var $option_element = $( $option_elements[i] ),                                option_value = $option_element.val();                            if ( attr_val === option_value ) {                                $option_element.addClass( 'attached ' + variation_active );                                break;                            }                        }                    } else {                        // Attach all apart from placeholder.                        new_attr_select.find( 'option:gt(0)' ).addClass( 'attached ' + variation_active );                    }                }            }            // Count available options.            attached_options_count = new_attr_select.find( 'option.attached' ).length;            // Check if current selection is in attached options.            if ( first_attr_val ) {                first_attr_val_valid = false;                if ( 0 !== attached_options_count ) {                    new_attr_select.find( 'option.attached.enabled' ).each( function() {                        var option_value = $( this ).val();                        if ( first_attr_val === option_value ) {                            first_attr_val_valid = true;                            return false; // break.                        }                    });                }            }            // Detach the placeholder if:            // - Valid options exist.            // - The current selection is non-empty.            // - The current selection is valid.            // - Placeholders are not set to be permanently visible.            if ( attached_options_count > 0 && first_attr_val && first_attr_val_valid && ( 'no' === show_option_none ) ) {                new_attr_select.find( 'option:first' ).remove();                option_gt_filter = '';            }            // Detach unattached.            new_attr_select.find( 'option' + option_gt_filter + ':not(.attached)' ).remove();            // Finally, copy to DOM and set value.            $first_attr_select.html( new_attr_select.html() );            $first_attr_select.find( 'option' + option_gt_filter + ':not(.enabled)' ).prop( 'disabled', true );            // Choose selected value.            if ( first_attr_val ) {                // If the previously selected value is no longer available, fall back to the placeholder (it's going to be there).                if ( first_attr_val_valid ) {                    $first_attr_select.val( first_attr_val );                } else {                    $first_attr_select.val( '' ).change();                }            } else {                $first_attr_select.val( '' ); // No change event to prevent infinite loop.            }        });    }});