Figure out how to make jQuery UI Tabs play nice wiht the D7 Ajax framework

The 3.x branch of Quicktabs for D7 is as yet still very experimental but one of the main things it tries to do is leverage existing code instead of rolling its own implementation of the tabs pattern: jQuery UI is in core and comes with a very nice tabs component.

Quicktabs has long provided an ajax option, whereby the content corresponding to each tab doesn't all get loaded on page load, rather it gets loaded when needed, i.e. when the user clicks on the relevant tab. Leveraging the new ajax framework would allow us to make use of the mechanism that changes how content gets delivered from a menu callback depending on whether js is enabled or not.

The problem is that jQuery UI Tabs has built-in ajax support, and disabling it is not that straight-forward. It's not simply an option that you pass in when adding the plugin to your markup; the plugin decides whether or not to use ajax based on the href of the tab link - if it's simply a fragment like #tab-1 it treats it as preloaded (provide the content is indeed already loaded into the corresponding div, but if the href is e.g. mypath/stuff, it will fire off an ajax request to retrieve the content at that url when the tab is clicked.

jQuery UI Tabs' Ajax mode is primitive and not what we want. It's therefore necessary to prevent this behavior and allow the Ajax framework to take care of that side of things, leaving Tabs to focus on what it's good at: tabs.

I've been somewhat successful in preventing the tabs ajax behavior, but I'm not all the way there yet. Each tab link is being built as a renderable array of #type link. If the ajax option has been chosen for the particular Quicktabs instance, the #ajax property is added to the render array and the href of the link is set to the path of a menu callback that will deliver an ajax command response if the user has js enabled, otherwise it returns a normal page of content. The quicktabs javascript is a jQuery plugin that's just a wrapper around the tabs plugin:

$.fn.quicktabs = function(options) {
    options = $.extend(
      // Default options
      {
        qtWrapper: 'quicktabs'
      },

      // Option overrides, passed to the plugin
      options || {}
    );

    return this.each(function () {
      var tab_options = {
        idPrefix: "qt-" + options.qtWrapper + "-ui-tabs",
        cache: true,
        // We need to prevent the jQuery UI Tabs ajax behavior because it
        // basically steps on the toes of the Ajax Framework. By setting the
        // "load.tabs" property here to an empty string, we ensure that it won't
        // attempt to fetch the content at the URL of the href of our tab links.
        select: function(event, ui) {
          $.data(ui.tab, "load.tabs", "");
        }
      }
      $(this).tabs(tab_options);
    });
  }

See the comment in the code above about preventing the jQuery UI Tabs ajax behavior.

Now to sum up the problematic behavior. It's a little tricky as I'm witnessing different behavior between firefox and chrome but basically:
1. I don't know how to set the href of a link to be just a fragment when setting it as a property of a renderable array (this is needed for the non-ajax, preloaded tabs).
2. Whether in ajax mode or not, as soon as the page loads, an ajax request gets fired off to the path of the first tab, resulting in a 404 page.
3. When I attempt to use the "cookie persistence" option in UI Tabs to get "remember last clicked tab" functionality the whole thing basically explodes: the page loads for a second and then everything goes blank.
4. I'm also trying to figure out a way to have a direct link to a particular tab being open, something that was very straight-forward using query parameters in my original "home-made" version of Quicktabs, but craziness ensues when I try it with UI Tabs.
5. Lastly, we really need #769258: AJAX behaviors cannot be bound once on links in core before the solution can be complete.

In general, I'm just finding that UI Tabs is doing too much messing around with hrefs and things for me to be able to get full control of how things work. I will keep playing around with it to see if I can get beyond my current impasse, but it would be great if others could try out this branch of Quicktabs and see if they have any insights into how to make it bend to our will.