[PP-x] Remove jQuery Form dependency from misc/ajax.js

I think we should start from scratch on the JS side, figure out a simpler api (and a much clearer lifecycle especially) for this and provide a compatibility layer that can be used to understand jquery-style ajax calls. It will be an opportunity to clean up the progress thing, the effects. I don't think the php side will need much changes.

The hard part is probably going to be the ajax commands, and jquery form replacement like you said.

There's some nice ideas in https://jakearchibald.com/2021/encoding-data-for-post-requests/#formdata...

This is what jquery-form already uses :) Half of that library is to support file uploads for older browsers through an iframe. Nowadays most of what's in the library is already covered by FormData.

In #3145958: [META] Re-evaluate use of Backbone.js in core, we decided to keep a forked copy of Backbone as an internal dependency for Tour, Toolbar, and Contextual Links at least until such time as those modules can be refactored away from Backbone.

I wonder if we should do the same thing here: make a forked copy of jquery-form for internal use by drupal.ajax, but deprecate/remove it as a public library for contrib's use. Then, we can refactor drupal.ajax during Drupal 10's lifetime rather than having to complete that refactor prior to Drupal 10's beta. Of course, if someone is able to complete that refactor before D10's beta, great! But this would buy us time if we can't get that done in time.

we could deprecate the library and create a new internal one like we did for backbone

#3279190: Mark as many 3rd party JS library as possible as internal

Do we need a new dedicated issue for removing jQuery.form usage from views_ui and views AJAX? That still seems like the next step here afaict.

It wouldn't be a straightforward 1:1 port, but something that might be worth considering is replacing Drupal's whole AJAX system with https://htmx.org/. I think htmx would give us most/all of the features we're used to with Drupal's AJAX, but figuring out the right amount of backwards compatibility wrappers to add would be the tricky part.

++HTMX

JQuery Form does not seem to be maintained anymore, so bumping priority.

I think we probably still need a dedicated issue for getting rid of jquery.form in views_ui/views_ajax per #19.

Re #23, I don't think Views / Views UI actually use jQuery Form directly, they only use it via Drupal.ajax. I think the only reason they declare a dependency on the plugin is because they instantiate Drupal.ajax() objects from JS code rather than always going through PHP's #ajax, so they don't get the dependency brought in automatically.

In other words, to remove it from Views / Views UI, we need to remove it from misc/ajax.js first. Changing this issue's title and summary to focus on that.

I haven't tested this at all, so this might fail hard, but something along these lines is what I recommend.

Seems to have CC failure, could we switch to an MR? Hiding older patches for clarity.

Also seems
$.fieldValue(this.element);
is used from jquery form plugin

Re #20, since converting to HTMX is too large scope for this issue, I opened #3404409: [Plan] Gradually replace Drupal's AJAX system with HTMX as a separate Ideas issue.

This is effectively blocking jQuery 4 now unless we figure out a shim. #3419734: [jQuery 4] jquery-form is unmaintained and not jQuery 4 compatible, fork it into core

Hid one branch, rebased the other one, fixed one js linting issue so that tests will run.

Manually tested.

First I uninstall big_pipe because that depends on the AJAX system and was throwing its own errors, just to reduce variables, we probably need to update some things there though.

Without big_pipe, if I change the allowed values on a field form (i.e. /admin/structure/types/manage/article/fields/node.article.body), I get:

An error occurred while attempting to process /admin/structure/types/manage/article/fields/node.article.body?_wrapper_format=drupal_ajax: Illegal invocation

So that seems like somewhere to start.

This unfortunately does not show up in the javascript test error log, we just get unexpected dialog or similar.

Made a commit which at least gets past the illegal invocation error - needs someone who knows what they're doing to fix it properly.

Next up is $.fieldValue is not a function.

Added the situation with jQuery 4 into the issue summary's top.

I messed up the commit history here when I slightly changed the approach. We now have two branches:

1. https://git.drupalcode.org/project/drupal/-/merge_requests/6530#note_263731 - this is the original approach forking/reimplementing everything we need* from jquery form.

2. https://git.drupalcode.org/project/drupal/-/merge_requests/6486#note_263745 a hybrid approach which leaves the jquery methods in their own fork.

*I think I have discovered the cause of most of the test failures remaining in #1, and it's not good news. The original draft here didn't reimplement the ajaxSubmit function. Because of the way ajax.js checks for this, if it's missing, it just skips it, and then AJAX form submits fail with neither console nor PHP errors.

The ajaxSubmit method is massive, so if we copy that to ajax.js, even if we can refactor it a bit, then what we've really done is forked jquery form again into our code base.

I therefore am thinking, at least to get us onto jQuery 4, we should just fork jQuery form and fix the four jQuery 4 issues in it, which is what #3419734: [jQuery 4] jquery-form is unmaintained and not jQuery 4 compatible, fork it into core does. That absolutely does not preclude continuing here, but we might end up making the decision to jump straight to HTMX too.

The ajaxSubmit method is massive

But with modern browsers we shouldn't need 95% of it. The submitForm() function in #26 conceptually should be a drop-in replacement for ajaxSubmit(). It didn't seem to work and I haven't had time to look into it further yet but my hunch is that we shouldn't need to add all that much more code into it to make it work.

I therefore am thinking, at least to get us onto jQuery 4, we should just fork jQuery form and fix the four jQuery 4 issues in it

Yes, I agree with doing that so as not to block our jQuery 4 upgrade on this issue.

Hiding patches

Per @longwave, #3419734: [jQuery 4] jquery-form is unmaintained and not jQuery 4 compatible, fork it into core has removed this from the critical path, so downgrading to major.

Yeah this is no longer strictly necessary for 11.0.0 as per #43 we can ideally refactor it away given there is apparently a lot of cruft that supports old browsers nowadays.

@longwave, @catch and I discussed the priority of this issue a bit, and while it's not in the critical path for D11, it could be considered critical to complete for D12, and this and other open issues should be reparented to the D12 meta when we file it shortly.

I think we should strongly consider doing #3404409: [Plan] Gradually replace Drupal's AJAX system with HTMX instead of this issue. It's clear from both this issue and #3419734: [jQuery 4] jquery-form is unmaintained and not jQuery 4 compatible, fork it into core that core's JavaScript AJAX API is unmaintained (people do occasionally work on the PHP end of things). So replacing it with a small, well maintained library could simplify things.

Postponing this until there's a decision on that issue.

Is there anything to do here now that HTMX is in core?

I don't think it's worth actively working on this, we should do #3404409: [Plan] Gradually replace Drupal's AJAX system with HTMX instead so we can remove the AJAX JavaScript entirely. However we're quite far from actually being able to remove this, so postponed seems like the right status tbh. We could also mark it outdated if we want it out of the queue.