Console error on attempting to save input format: "An invalid form control with name='editor[settings][plugins][editor_file_file][extensions]' is not focusable."

Problem/Motivation

It is currently not possible to save the input format settings with this plugin added to the toolbar when using the contrib Seven admin theme. The following error shows in the developer console in Chrome:

An invalid form control with name='editor[settings][plugins][editor_file_file][extensions]' is not focusable.
<input data-drupal-selector="edit-editor-settings-plugins-editor-file-file-extensions" aria-describedby="edit-editor-settings-plugins-editor-file-file-extensions--TskKnfXQdEE--description" type="text" id="edit-editor-settings-plugins-editor-file-file-extensions--TskKnfXQdEE" name="editor[settings][plugins][editor_file_file][extensions]" value size="60" maxlength="256" class="form-text required" required="required" aria-required="true" data-drupal-states="{"visible":{":input[data-editor-file-upload=\u0022status\u0022]":{"checked":true}}}" data-once="states">

What's happening is the JS isn't able to focus the tab to show the error. There's a checkbox on that page to enable file uploads and then a field to set the allowed extensions - that field is still required even if the checkbox isn't checked, so it fails with the error above in the console and submitting the page doesn;t seem to do anything (you'd never know why if you didn't think to look in the console).

Steps to reproduce

Drag button to toolbar but change nothing else. Hit save.

Proposed resolution

Either focus the setting tab after adding the button or add some more robust JS validation to surfact it when hitting submit.

Remaining tasks

User interface changes

API changes

Data model changes