jQuery-UI integration with RichFaces 4

I'm trying to add jQuery-UI functionnalities to an existing JSF2 + RichFaces 4 project. So far, I am not able to get it working.

Here is the xhtml code used :

<h:outputStylesheet name="jquery.ui/css/jquery-ui-1.10.3.custom.min.css" />
<h:outputScript name="jquery.ui/js/jquery-ui-1.10.3.custom.js" target="head" />

<script>
    jQuery(document).ready(
        function()
        {
            alert('test1');
            jQuery("#potatoe").resizable();
            alert('test2');
        }
    );
</script>

<div id="potatoe" style="width: 150px;height: 150px;"></div>

In the console (Firefox) I get the error obj is undefined from the jQuery-UI JS file and there is no test2 alert. The line number wont be useful, but here is the code of the defective line :

},each:function(obj,callback,args){var name,i=0,length=obj.length,isObj=length===undefined||jQuery.isFunction(obj);

I've verified, the jQuery and jQuery-UI scripts are loaded properly in the browser. I've also tested this small code using the exact same files :

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
        <script src="jquery.js"></script>
        <script src="jquery-ui-1.10.3.custom.min.js"></script>
    </head>
    <body>
        <script>
            jQuery(document).ready(
                function()
                {
                    alert('test1');
                    jQuery("#test").draggable(
                        {
                            grid: [50, 50]
                        }
                    );
                    jQuery("#test").resizable(
                        {
                            grid: 50
                        }
                    );
                    alert('test2');
                }
            );
        </script>
        <div id="test" style="width: 150px;height: 150px;background-color: red;"></div>
    </body>
</html>

And it is working properly. The jquery.js is jQuery 1.8.2, file provided with RichFaces 4 saved from the website. What am I doing wrong?

Solution

There is some conflict between jQuery and JQueryUI. The error occurs when the widget factory tries to register the ui.mouse widget and fails because widget doesn't contain all the variables it supposed to contain (specifically _childConstructor).

You can fix this by upgrading to RF 4.3, it uses jQuery 1.8.3 and it seems to work alright. Or as suggested here by rewriting the jQueryUI.