Swiper is not defined Elementor 3.5

Does anyone an idea if this thing will be fixed or what?
It’s from the Elementor 3.4.8 version that this bug persist.
And no one has provided to relase a propely complete guide to fix this.

Thanks.
Nobody anymore reply me back.
Good community support.
After update broken the site and that’s it.
Well done.

Hello Guys. Having the same problem.

@salihkulangara Can you please tell me what am I doing wrong?

Here is the Widget Handler registration code in a js file –

jQuery( window ).on( 'elementor/frontend/init', () => {
    const addHandler = ( $element ) => {
        //here you define your swiperElement, swiperConfig 
        swiperElement = ('.slider-ex.swiper-container');
        swiperConfig = {
                // Optional parameters
                  direction: 'vertical',
                  loop: true,

                  // If we need pagination
                  pagination: {
                    el: '.swiper-pagination',
                  },

                  // Navigation arrows
                  navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                  },
            };
        //then use the code 
        if ( 'undefined' === typeof Swiper ) {
            const asyncSwiper = elementorFrontend.utils.swiper;

            new asyncSwiper(  swiperElement, swiperConfig ).then( ( newSwiperInstance ) => {
                console.log( 'New Swiper instance is ready: ', newSwiperInstance );
                
                reviewSwiper = newSwiperInstance;
            } );
        } else {
          console.log( 'Swiper global variable is ready, create a new instance: ', Swiper );
     
          reviewSwiper = new Swiper( swiperElement, swiperConfig );
        }
    };

   elementorFrontend.hooks.addAction( 'frontend/element_ready/le-lifterlms-course-reviews.default', addHandler );
} );

And in the custom widget PHP file, I am registering the js file like this –

public function get_script_depends() {

	wp_register_script( 'efl-course-review-js', plugins_url( 'assets/js/course-review.js', __FILE__ ) );

	return [
		'swiper',
		'efl-course-review-js',
	];
}

But its not working. Here is the error in console –

frontend.min.js?ver=3.5.3:2 Uncaught TypeError: e.closest is not a function
    at new Swiper (frontend.min.js?ver=3.5.3:2:27209)
    at addHandler (course-review.js?ver=5.8.3:27:13)
    at _runHook (frontend.min.js?ver=3.5.3:2:34095)
    at Object.doAction (frontend.min.js?ver=3.5.3:2:34697)
    at e.exports.runReadyTrigger (frontend.min.js?ver=3.5.3:2:3291)
    at editor.min.js?ver=3.5.3:2:312641
    at load-scripts.php?c=1&load[chunk_0]

I am stuck on this issue for two days now. Can someone help me with this? It’s very clear reading the old replies that the Elementor team is not even trying to help. They are just happy that they can load the swiper file only when necessary. They do not look concerned at all about this issue.

• This reply was modified 2 years, 10 months ago by ZeeTheme.

@zeetheme
Brother, this is not the Swiper Undefined issue, seems Swiper is successfully instantiated, check by changing the below line:

//here you define your swiperElement, swiperConfig 
swiperElement = ('.slider-ex.swiper-container');

By

//here you define your swiperElement, swiperConfig 
swiperElement = $('.slider-ex.swiper-container');

• This reply was modified 2 years, 10 months ago by Salih K.