Ensure visibility of invalid fields (JS)

Updating the patch of #74 to use the new once library (see change record → ), so that patch is compatible with D10.
Also fixed two 2 deprecation warnings.

This issue appears to be trying to solve the same as this issue https://www.drupal.org/project/field_group/issues/2969051 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info .. I don't think we need two issues open trying to solve the same thing, unless i've missed some difference?

This patch from https://www.drupal.org/project/field_group/issues/2969051#comment-15022271 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info in that issue appears to solve the issue as far as I can see from my testing with 9.5.x.

We were previously using patch 60 from this issue on a project which at some point in the last year and a half seemed to stop working in all circumstances. Patch 99 (from comment #100) in the other issue (2969501) is working nicely though.

Patch #85 works for me for fields that are in both inside and outside tabs. But the patches on 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info don't work for fields inside tabs.

Note that issue #2894351 also try to fix this bug. Patch 26 works pretty well with Seven/Claro/Gin admin theme

source: https://www.drupal.org/project/field_group/issues/2894351#comment-14394498 🐛 Tabs with invalid input are not focused RTBC

Adding related issues mentioned on #86 and #88. Please test the patch on #85.

Can confirm that patch on #85 works for me on Drupal 10.1.8 and unpublished_node_permissions 1.4.0

Patch #85 works fine for us. Moving to RTBC.

I have added a required field in tab , but if tab is close than the validation is not working for the required field and getting error in console. i have applied this patch #85 , and this working fine for me. +RTBC

The MR is empty, could someone please create a working MR from the RTBC'd patch?

We have the full HTML required field & I am not able to set the focus. I have tried the latest patch #85 also.

We are using the D10 version.

Please provide some insights.

@Anybody Done, patch #85 already uploaded to module issue fork, also updated latest code from 8.x-3.x. So now MR is updated.

@rcodina thank you! Sadly tests are failing currently.

The tests seem to be fixed in 📌 Automated Drupal 11 compatibility fixes for field_group - Fixed PHPUnit on GitlabCI RTBC , in particular with the changes in file contrib/field_group_migrate/tests/src/Functional/MigrateUiFieldGroupTest.php, see:
https://git.drupalcode.org/project/field_group/-/merge_requests/49/diffs...
maybe, @Anybody, it might be worth taking a closer look at this other MR first (MR!49) so phpunit tests could get fixed and run for other tickets.

I would recommend getting the ESLint job fixed first in 📌 GitlabCI: Fix ESLINT validation errors Fixed (MR!54), before getting this MR approved:
it seems it would introduce quite a few linting errors, mostly in the JS files.

Otherwise, @rcodina, you could try cherry-picking a commit from another MR, I've used to pass the tests, see :
https://git.drupalcode.org/project/field_group/-/merge_requests/47/diffs...
Or simply download the file locally and try running the phpunit tests, then commit the file and re-run the tests.

Hope that helps moving the ticket forward.
Thanks in advance for your feedback!

nils.destoop → made their first commit to this issue’s fork.

#85 does not apply to latest dev
dev-3.x a33215b

D.10.2.7 php 8.3

patch for issue #2969051 works

This is the patch → to the latest 8.x-3.6 stable version

@Anybody All tests and checks of the MR are green except the following one which reproduces in 4 files of the module. This 4 files haven't been modified by current MR:

Class Drupal\field_group\Element\HtmlElement extends deprecated class  
         Drupal\Core\Render\Element\RenderElement:                              
         in drupal:10.3.0 and is removed from drupal:12.0.0. Use                
           \Drupal\Core\Render\Element\RenderElementBase instead.    

So, given this is not related to current issue and that core requirements of Field Group should be changed, I think this should be addressed in a new issue.

It does apply to fieldgroup 3.6.0

Please ensure that this won't conflict with 🐛 HTML5 validation is preventing form submit and not fully accessible Needs work

Tests look good, I think we're almost close to the finish line here?

@rcodina said in #87:

Patch #85 works for me for fields that are in both inside and outside tabs. But the patches on #2969051: HTML5 Validation Prevents Submission in Tabs don't work for fields inside tabs.

Both this issue and 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info , seem to fix a very similar issue (if not the same).

The fixes here seem to be more sophisticated, though. I'd say, we merge the MR opened here (once tested) and see if anything is left to do in
🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info .

@Anybody, I think you meant to not conflict with 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info instead of 🐛 HTML5 validation is preventing form submit and not fully accessible Needs work ?

Right!

Works like a charm, great work everyone! 🤩

I was working on re-rolling #2969051 but saw the latest comment on that ticket and came to see if this fix resolves my problem.

I have three tabs all with required fields. The first tab is the default shown tab so no issue there. When I try to submit with the 2nd tab fields not completed I am correctly brought to the tab and field. However, if I fill that in and submit again, I am not pushed to the 3rd tab and instead see the server side validation.

Here is the video of this interaction, https://www.drupal.org/files/issues/2024-09-09/field_group_3_tabs.mov →

I'll note that this was the exact same behavior I experienced on #2969051.

Thank you, @robpowell!

Could you create a follow-up issue regarding this problem, with the information you provided, targeting 4.x?

Done! https://www.drupal.org/project/field_group/issues/3473361 🐛 Multiple required fields on multiple tabs do no trigger frontend validation Active

@robpowell, thanks!

Automatically closed - issue fixed for 2 weeks with no activity.

Thanks for working on this. Ended up here coming from 🐛 HTML5 Validation Prevents Submission in Tabs Postponed: needs info

I noticed that the MR target changed from 8.x-3.x to 4.x and as result, non of the changes here was committed to 8.x-3.x. Is the plan to only fix this in 4.x? If so, I am a little concerned, as 4.x is only in alpha1 and site policies will probably block them from upgrading to an early alpha, if alpha at all and I guess most field_group installations is on 8.x-3.x branch. Can you elaborate on what the plan is. Sorry if I missed this in any of the comments above.