validate.js is responsible for validating fields on a form on clicking the submit button but before the form is actually posted.

when a required field is not filled, that field will be focused and 'marked' so the user can correct it.

When you have a form with conditional displaying fields (using showon) and you hide a required field, then validate.js will throw an error and you cannot submit the form.

The invalid form control with name=‘jform[xyz]’ is not focusable.

this is happening because showon.js will set class hidden on the parent wrapper for the required field and validate.js doesn't check the computed CSS style (which is display: none, but the display state of the element itself (which is not set)

The solution here is /cound be (?) to have validate.js do a check like this in line 573 (untested / unconfirmed if this is working):

element.getAttribute('disabled') === 'disabled' || element.closest('[style*="display: none"]') !== null