FormData is updated too late for md-checkbox

[fetishcoder]

What is affected?

Component

Description

When I do:
The example in material-web/docs/intro.md
And I add a oninput or onchange event on the forms like so:

<form oninput="console.log(...new FormData(event.target.form))">
  <md-outlined-text-field label="Email" type="email"
      name="email" required></md-outlined-text-field>
  <label>
    Subscribe
    <md-checkbox name="subscribe"></md-checkbox>
  </label>

  <md-text-button type="reset">Reset</md-text-button>
  <md-outlined-button>Submit</md-outlined-button>
</form>

I would expect
When I click the checkbox, the console should display:
(2) ['email', ''] (2) ['subscribe', 'on']

However
It displays
(2) ['email', '']
When I click the checkbox again (turning it off...) the console will now display
(2) ['email', ''] (2) ['subscribe', 'on']

ps.
When I put the same event listener on the form with the html checkbox, I see the expected logs.
Also, the md-radio seemed to work as expected.

Reproduction

code included

Workaround

I have not found a workaround

Is this a regression?

No or unsure. This never worked, or I haven't tried before.

Affected versions

latest

Browser/OS/Node environment

chrome

[asyncLiz]

blargh, probably because it's updated asynchronously.

As a workaround, you should be able to await the element's updateComplete

async function handleChange(event) {
  await event.target.updateComplete;
  console.log(...new FormData(event.target.form))
}

[fetishcoder]

Yes, I am looking at the code a bit and see that in the
md-checkbox this.internals.setFormValue is called in protected override update(changed: PropertyValues<Checkbox>)
where in the
md-radio this.internals.setFormValue is called in set checked (the setter of checked)

[maicol07]

@asyncLiz it seems the fix didn't fix the formdata value when the checkbox is checked which returns 'false'. It should instead return 'on'

[asyncLiz]

@asyncLiz it seems the fix didn't fix the formdata value when the checkbox is checked which returns 'false'. It should instead return 'on'

Are you using @material/web@nightly? The next release with this fix hasn't been published.

[maicol07]

@asyncLiz it seems the fix didn't fix the formdata value when the checkbox is checked which returns 'false'. It should instead return 'on'

Are you using @material/web@nightly? The next release with this fix hasn't been published.

Nevermind, it was my fault with custom code. Works in latest nightly, by the way.