Get/Set wp.customize.previewer.previewUrl

Question

I am trying to get/set the current previewURL within the Customizer.

I enqueue the script with the customize_controls_print_styles action:

function my_custom_script() {
    wp_enqueue_script( 'my-custom-script', plugin_dir_url( __FILE__ ) . '/js/my-custom-script.js' );
}
add_action('customize_controls_print_styles', 'my_custom_script');

In the script I try to set the previewURL and refresh the previewer when the user clicks on a specific customizer section

jQuery(window).load(function(){

    jQuery('#accordion-panel-my-custom-section').click(function(event) {
        // Hard coded URL for testing purposes
        wp.customize.previewer.previewUrl('http://example.com/test/');
        wp.customize.previewer.refresh();
    });

});

But it is not working. It only refreshs the previewer, but without changing the previewURL.

If I don't bind the function to a click event it works without problems:

jQuery(window).load(function(){

    // Hard coded URL for testing purposes
    wp.customize.previewer.previewUrl('http://example.com/test/');
    wp.customize.previewer.refresh();

});

What am I doing wrong?

Answer 1

You want the sub-method wp.customize.previewer.previewUrl.set( url );