0

I am not sure if this is an error but I am getting this in my console. It drives me crazy. I am running a WordPress site. My error is below.

Uncaught TypeError: Cannot read properties of undefined (reading 'clone')
    at e.run (owl.carousel.min.js?ver=1.3.2:1)
    at Object.i [as run] (jquery.min.js:2)
    at e.update (owl.carousel.min.js?ver=1.3.2:1)
    at e.refresh (owl.carousel.min.js?ver=1.3.2:1)
    at e.initialize (owl.carousel.min.js?ver=1.3.2:1)
    at new e (owl.carousel.min.js?ver=1.3.2:1)
    at HTMLDivElement.<anonymous> (owl.carousel.min.js?ver=1.3.2:1)

    at Function.each (jquery.min.js:2)
    at s.fn.init.each (jquery.min.js:2)
    at s.fn.init.a.fn.owlCarousel (owl.carousel.min.js?ver=1.3.2:1)

As a fix, I found that I must config loop: false for the slider that has only one item but I am not sure how I do that in my WordPress site.

This is the code that shows the error in owlCarousel.min.js

a.fn.owlCarousel = function(b) {
    return this.each(function() {
        a(this).data("owlCarousel") || a(this).data("owlCarousel", new e(this,b))
    })
}

This is the place that shows the error when I view the file path it navigates me to here. This is a WordPress website. 

  var W = /^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;
    S.Deferred.exceptionHook = function(e, t) {
        C.console && C.console.warn && e && W.test(e.name) && C.console.warn("jQuery.Deferred exception: " + e.message, e.stack, t)
    }
    ,
    S.readyException = function(e) {
        C.setTimeout(function() {
            throw e
        })
    }
    ;

This says Jquery deferred exception

  • Are you using the `clone` method anywhere? May you share a [mcve] of the issue? – evolutionxbox Dec 02 '21 at 13:26
  • The error is coming from inside the library, which probably means you have misconfigured it somehow, but without seeing the code that causes this error there is no way to know. – DBS Dec 02 '21 at 13:28
  • Hi @DBS thanks for trying to help me. I have updated my question with the code. Could you please give me a hint? –  Dec 02 '21 at 13:38
  • HI @evolutionxbox I've updated my question with the code that I think as points as the error. Could you try to give me a hint? –  Dec 02 '21 at 13:43
  • The code posted doesn't seem to have anything to do with the error? – evolutionxbox Dec 02 '21 at 13:48
  • Where are you making use of "owl-carousel"? There's a good chance that where ever that is initialised is the source of the problem. According to their documentation it should look something like: `$('selector').owlCarousel({ options })` – DBS Dec 02 '21 at 13:58
  • Thanks for the feedback @DBS I updated the question as I understand. Could you please try now. –  Dec 02 '21 at 14:30
  • Thanks so much for the reply @evolutionxbox I updated the code as I understand. Could you please try now? –  Dec 02 '21 at 14:32
  • Sure, the updated code is still from the owl code. Please may you show us your code instead? – evolutionxbox Dec 02 '21 at 14:33
  • Hi @evolutionxbox I really apriciate the effort that you are giving to help me. I updated the question. When I navigated to the path from the console it took me to the jQuery.min.js file and the line number is 1506. –  Dec 03 '21 at 01:59
  • @evolutionxbox Setting the loop option to false fixed the issue. Thanks so much for your commitment –  Dec 03 '21 at 06:32

2 Answers2

2

Try this :

I found that setting the loop option to false resolved it for me.

    jQuery('.owl-carousel2').owlCarousel({
        loop:false,
        margin:10,
        nav:true,
        mouseDrag:false,
        responsive:{
            0:{
                items:1
            },
            600:{
                items:3
            },
            1000:{
                items:3
            }
        }
    })

  });

Reference : Cloned items in owl carousel

Olavo Mello
  • 492
  • 2
  • 8
  • Hello @olavo Mello Thanks so much for your help. I am not an expert in JavaScript how do I make this change on my Wordpress site –  Dec 03 '21 at 03:42
  • 1
    You should find the page where ".owlCarousel" is called ( is instantiated ). In this code you probably will see something like the examples that I sent. Just add or change configs. – Olavo Mello Dec 03 '21 at 03:46
  • @olvo Mello Thanks so much this fixed the error :) –  Dec 03 '21 at 06:31
  • Amazing. Happy to help you. Cheers ! ;) – Olavo Mello Dec 03 '21 at 17:16
0
jQuery(".owl-slider").owlCarousel({
    navigation: !0,
    pagination: !1,
    slideSpeed: 7000,
    autoplay: !0,
    autoplayTimeout: 5000,
    autoplayHoverPause: !1,
    dots: false,
    margin: 10,
    stopOnHover: !1,
    paginationSpeed: 400,
    items: 3,
    loop: true,
    nav: true,
    navText: ["", ""],
    responsive: {
      0: { items: 1, responsiveClass: !0 },
      600: { items: 1 },
      1000: { items: 1 },
      1300: { items: 1 },
    },
  });
  • If you have only one item in your carousel then you should set loop:false, if you have more than one carousel item then you can set loop:true.
Arunprasanth M
  • 29
  • 5