Implicit form submission should work when the submit button is not nested in the form, but is associated

[skvale]

Current behavior

When there is a submit button outside of the form, but associated to the form by the form attribute

someInput.type('{enter}')

does not submit the form

I'm assuming this is because Cypress is searching for the buttons with

form.find('input, button')

Instead of searching for every submit button/input and testing if it's nested or associated by the form attribute

My submit button is not a child of the form, but it looks like

<form id="my-form-id" onSubmit={function(e) { console.log('submitted'); e.preventDefault() }}>
  <input type="text" />
</form>
<button form="my-form-id" type="submit">Save</button>

Desired behavior

Cypress should implicitly submit the form on enter in a text field

Test code to reproduce

<form 
  id="my-form-id" 
  onSubmit={function(e) { console.log('submitted'); e.preventDefault() }}>
    <input type="text" />
</form>

<button 
  form="my-form-id" 
  type="submit">
    Save
</button>

Cypress Version

9.5.3

Other

No response

[cypress-bot]

The code for this is done in cypress-io/cypress#21279, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 9.6.1.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v9.6.1, please open a new issue.