Inline call of jQuery tabs doesn't work

Question

Here's my problem. I have a tabs block which load perfectly when I put this script in phtml

require([
            'jquery',
            'jquery/ui'
        ],
        function($) {
            $("footer").tabs();
        }
    );

But if I use $("footer").tabs(); in browser console, tabs are not working. Every other components of jQuery ui works fine except this one.

Did I miss something ?

Answer 1

I think I figure it out.

I think there's a conflict with Magento tabs widget, and tabs doesn't load.

Instead I use

require([
            'jquery',
            'jquery/ui'
        ],
        function($) {
            $.ui.tabs({}, "footer");
        }
    );

And it's now working fine.

Thx for our replies

Answer 2

Magento 2 uses require js to load the dependencies before hand when you use following syntax;

require([
            'jquery',
            'jquery/ui'
        ],
        function($) {
            $("footer").tabs();
        }
    );

i.e jquery,then jquery/ui and then your script.

But when you use $("footer").tabs(); the dependencies are not really monitered or loaded by anyone so it may or may not work depending it has loaded or not.