Add commandfor & command attributes to HTMLButtonElement #9841

keithamus · 2023-10-08T23:00:35Z

This adds the commandfor & command attributes and a "command" event using the CommandEvent interface.

Button activation checks if the button has a "commandfor" target and if so performs invoker command behaviour depending on command and the target element.

Some related (eventual) follow up issues around this feature:

Investigate making the invalid state of <button type> _not_ submit #10462; Investigate making the invalid state of <button type> not submit
Lift restriction on buttons with implicit type=submit and command/commandfor being no-op #10832; Lift restriction on buttons with implicit type=submit and command/commandfor being no-op
At least two implementers are interested (and none opposed):
- Mozilla Supportive & prototyping
- Webkit
- Chromium supportive; actively prototyping.
Tests are written and can be reviewed and commented upon at:
- Mark invokers tests as non-tentative web-platform-tests/wpt#42664 (PR to make the tests non-tentative)
Implementation bugs are filed:
- Chromium Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1490919
- Chromium Patch: https://chromium-review.googlesource.com/c/chromium/src/+/4926471
- Gecko Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1856430
- Gecko Patch: https://phabricator.services.mozilla.com/D190449
- WebKit Bug: https://bugs.webkit.org/show_bug.cgi?id=262840
- Webkit Patch: Add invoketarget & invokeaction attributes WebKit/WebKit#18794
MDN issue is filed: Add documentation for the "command" and "commandfor" attributes, and "command" event. mdn/content#30829
The top of this comment includes a clear commit message to use.
a11y & i18n are considered and relevant PRs are created: Add command & commandfor attribute related mappings w3c/aria#2354

(See WHATWG Working Mode: Changes for more details.)

/dom.html ( diff )
/form-elements.html ( diff )
/index.html ( diff )
/indices.html ( diff )
/interaction.html ( diff )
/interactive-elements.html ( diff )
/webappapis.html ( diff )

scottaohara · 2023-10-18T16:54:02Z

I realize this is also in the steps for getting the popover target element, but in both cases I'm wondering why its specified to return null if the node is in the disable state?

Doing so, at least with <button popovertarget=foo disabled> testing in chrome, results in that element not exposing whether the popover is in the expanded or collapsed state - as I'm assuming due to

"If node is disabled, then return null."

that state gets removed. That's unexpected, to have that state removed based on whether the button is disabled or not. And for invokertarget - if it is really is going to do more than just show/hide content - there are a lot of other states that should still be exposed, regarless of if the element is in the disabled state or not.

edit: I can file a bug for disabled / popovertarget if necessary - i just wanted to get insight on this first, before I went and made that issue. cc @mfreed7

See related spec PR whatwg/html#9841

lukewarlow · 2023-11-04T13:36:02Z

Fwiw HTML requires a positive standards position or for chrome LGTMs on an intent to ship to be considered supportive.

Saying that Mozilla have marked their position as positive so that's 1 implementor interested.

I do wonder how this requirement works for a feature such as this which will require multiple PRs to add to the spec?

domenic · 2023-11-05T00:52:12Z

a feature such as this which will require multiple PRs to add to the spec?

I'm confused why this feature is being done as multiple PRs; it makes review a good deal harder.

keithamus · 2023-11-05T01:03:00Z

If it makes it easier to review I’m happy to put more into one PR. I figured it would be worthwhile splitting it into the core vs each elements behaviour as I imagine there will be more to discuss with each elements behaviour.

domenic · 2023-11-05T01:04:05Z

Well, it'd make it easier for me, but I haven't signed up to review yet, so no need to make any changes until we get some more opinions :)

Edited to add: the reason it makes it more difficult is that I don't think we want to accept the feature piecemeal.

lukewarlow · 2023-12-01T21:07:17Z

As per openui/open-ui#900 (comment) this'll need updating to only fire the event when the action is custom (has a hypen) or is recognised and valid (correct action name on correct element).

TLDR is that this will allow us to add default actions in future without conflicting with user land code.

lukewarlow · 2023-12-01T21:09:24Z

In openui/open-ui#952 (comment) we resolved that "Invokers v1 will be popover and dialog invoking."

This should help keep this initial PR as small as possible while also avoid the issue of reviewing stuff piecemeal.

So #9875 can be merged into this along with dialog related changes.

mfreed7 · 2024-01-17T22:12:20Z

Fwiw HTML requires a positive standards position or for chrome LGTMs on an intent to ship to be considered supportive.

Saying that Mozilla have marked their position as positive so that's 1 implementor interested.

Chromium is explicitly supportive of this proposal, so I believe it has two implementer support (including Mozilla).

Is this PR in a state that it can get a review? I'm happy to do so, if it'd help.

keithamus · 2024-01-17T22:47:01Z

I'd be happy to get reviews, I think this is in a good position for that.

source

mfreed7 · 2024-01-17T23:09:42Z

I'd be happy to get reviews, I think this is in a good position for that.

Done - I added a first set of comments.

keithamus · 2025-02-19T09:07:56Z

@foolip thanks for the new review! All comments addressed.

foolip

Thanks @keithamus, I think we're good to go here. I left two final (really!) suggestions that I hope can be applied without any knock-on effects.

source

keithamus · 2025-02-19T11:36:40Z

@foolip thanks! Addressed both of those comments.

foolip · 2025-02-19T14:55:05Z

Checklist up top looks good, merging this and web-platform-tests/wpt#42664 😄

See related spec PR whatwg/html#9841

Corresponds to part of whatwg/html#9841 and then whatwg/html#11047 Adding `Auto` as a type state feels a little odd, as it's not an actual type allowed in HTML. However, it's the default state when the value is missing or invalid, which works out the same, as long as we never serialize "auto", which we don't.

…testonly Automatic update from web-platform-tests Mark invokers tests as non-tentative (#42664) See related spec PR whatwg/html#9841 -- wpt-commits: e014b2613b2873099d628953eb5ca74ace1bdcf2 wpt-pr: 42664

Intent to ship: https://groups.google.com/a/chromium.org/g/blink-dev/c/ctNbl4gWLuk/m/NXmcIDLlAQAJ. Merged spec PR: whatwg/html#9841. Bug: 40284894 Change-Id: I2c37dd8eb968948de420d673c0a21bcddf2bf75b Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6281568 Reviewed-by: Luke <[email protected]> Reviewed-by: Chris Harrelson <[email protected]> Commit-Queue: Chris Harrelson <[email protected]> Reviewed-by: Mason Freed <[email protected]> Reviewed-by: Vladimir Levin <[email protected]> Cr-Commit-Position: refs/heads/main@{#1425940}

…testonly Automatic update from web-platform-tests Mark invokers tests as non-tentative (#42664) See related spec PR whatwg/html#9841 -- wpt-commits: e014b2613b2873099d628953eb5ca74ace1bdcf2 wpt-pr: 42664 UltraBlame original commit: b45ce137f4196f86aede8cf995cc794cc5d5cb56

Corresponds to part of whatwg/html#9841 and then whatwg/html#11047 Adding `Auto` as a type state feels a little odd, as it's not an actual type allowed in HTML. However, it's the default state when the value is missing or invalid, which works out the same, as long as we never serialize "auto", which we don't.

…testonly Automatic update from web-platform-tests Mark invokers tests as non-tentative (#42664) See related spec PR whatwg/html#9841 -- wpt-commits: e014b2613b2873099d628953eb5ca74ace1bdcf2 wpt-pr: 42664

This will help with whatwg#9841.

…testonly Automatic update from web-platform-tests Mark invokers tests as non-tentative (#42664) See related spec PR whatwg/html#9841 -- wpt-commits: e014b2613b2873099d628953eb5ca74ace1bdcf2 wpt-pr: 42664

#9841 did not do this correctly, likely do it being developed over a long period of time in which this algorithm changed shape.

…tribute, a=testonly Automatic update from web-platform-tests Drop 'auto' keyword from invokeaction attribute The spec proposal has been updated to use missing default of an 'auto' state, with no associated keyword. This patch aligns Chromium and the WPT tests with that change. Proposal PR: whatwg/html#9841 Proposal explainer: https://open-ui.org/components/invokers.explainer/ Bug: 40286318 Change-Id: Ib62d749d8428490630aa9181bc055bc6f102b420 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5347628 Commit-Queue: Luke <[email protected]> Reviewed-by: Joey Arhar <[email protected]> Cr-Commit-Position: refs/heads/main@{#1269645} -- wpt-commits: d4298204f72a23fa916db2d2479bda9771147c17 wpt-pr: 44959

…flect new spec decisions., a=testonly Automatic update from web-platform-tests Rename & refactor invoker commands to reflect new spec decisions. Invoker commands now live solely on HTMLButtonElement, and have been dropped from HTMLInputElement. This was discussed and resolved + minuted in Jul 18 WHATNOT meeting: whatwg/html#10471 (comment)) Words must be separated with dashes. This was discussed and resolved + minuted in Jul 18 WHATNOT meeting: whatwg/html#10471 (comment)) "Custom" commands now require a double dash (`--`) prefix. This was discussed & resolved + minuted in the Jul 25 OpenUI meeting: openui/open-ui#969 (comment) In addition, CommandEvent#invoker is now renamed to CommandEvent#source as discussed and resolved + minuted in Jul 18 WHATNOT meeting: whatwg/html#10471 (comment)) This CL updates the tests & implementation to follow these changes. The changes can also be found in the spec PR which reflects this updated status: whatwg/html#9841 Bug: 40284894 Change-Id: Iefa91a1736867239a21f8717aee1fcaaa54fdfd0 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5839601 Reviewed-by: Mason Freed <[email protected]> Reviewed-by: Luke <[email protected]> Commit-Queue: Keith Cirkel <[email protected]> Cr-Commit-Position: refs/heads/main@{#1367705} -- wpt-commits: 5df7a2c02bb50efa0368910fd49242c08def7a5d wpt-pr: 48581

… values, a=testonly Automatic update from web-platform-tests Reflect command attribute to known-valid values This changes the reflection rules of the command attribute to match the spec - whatwg/html#9841. The command attribute should only reflect known values (or custom ones) and for invalid values it should return the empty string. Bug: 394874179 Change-Id: I76d2139762137027961e385250e0976d9395d778 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6240672 Reviewed-by: Mason Freed <[email protected]> Reviewed-by: Luke <[email protected]> Commit-Queue: Keith Cirkel <[email protected]> Auto-Submit: Keith Cirkel <[email protected]> Cr-Commit-Position: refs/heads/main@{#1418568} -- wpt-commits: 3117023f41189ce423c0a7aa96f58d9baea3abab wpt-pr: 50628

This was referenced Oct 8, 2023

"command" and "commandfor" attributes WebKit/standards-positions#264

Closed

Invokers (command & commandfor) mozilla/standards-positions#902

Closed

keithamus force-pushed the add-invoke branch from c004fd4 to 0c56df8 Compare October 9, 2023 09:31

keithamus changed the title ~~Add invoke~~ Add InvokeElement & InvokeEvent IDLs for Invoke proposal Oct 9, 2023

keithamus changed the title ~~Add InvokeElement & InvokeEvent IDLs for Invoke proposal~~ Add InvokeElement & InvokeEvent IDLs & invocation steps for Invoke proposal Oct 9, 2023

Schweinepriester mentioned this pull request Oct 10, 2023

Add Invoker Commands, command & commandfor (previously: Invokers, invoketarget & invokeaction) Fyrd/caniuse#6856

Open

keithamus force-pushed the add-invoke branch from 0c56df8 to 98adb9f Compare October 10, 2023 22:26

keithamus marked this pull request as ready for review October 10, 2023 22:28

keithamus force-pushed the add-invoke branch 3 times, most recently from 45e4032 to 9579336 Compare October 17, 2023 20:32

This comment was marked as outdated.

Sign in to view

keithamus force-pushed the add-invoke branch 2 times, most recently from 7f0f9ea to 834a8b1 Compare October 18, 2023 21:36

keithamus mentioned this pull request Oct 20, 2023

Mark invokers tests as non-tentative web-platform-tests/wpt#42664

Merged

keithamus added a commit to keithamus/wpt that referenced this pull request Oct 20, 2023

Mark invokers tests as non-tentative

858bcd8

See related spec PR whatwg/html#9841

keithamus force-pushed the add-invoke branch from 834a8b1 to bd64801 Compare November 1, 2023 12:30

keithamus mentioned this pull request Nov 9, 2023

refactor Dialog to use <dialog> internally primer/view_components#2364

Merged

10 tasks

keithamus mentioned this pull request Jan 11, 2024

Refactor Dialog to use <dialog> internally primer/view_components#2496

Merged

10 tasks

mfreed7 reviewed Jan 17, 2024

View reviewed changes

foolip approved these changes Feb 19, 2025

View reviewed changes

source Outdated Show resolved Hide resolved

source Show resolved Hide resolved

keithamus added 2 commits February 19, 2025 11:35

add missing type

baaeaa0

drop extra argument

3d67bb9

foolip merged commit 81fa58f into whatwg:main Feb 19, 2025
2 checks passed

foolip pushed a commit to web-platform-tests/wpt that referenced this pull request Feb 19, 2025

Mark invokers tests as non-tentative (#42664)

e014b26

See related spec PR whatwg/html#9841

zcorpan mentioned this pull request Feb 19, 2025

Button activation behavior can call "show a modal dialog" with not-connected dialog #11043

Closed

mfreed7 mentioned this pull request Feb 21, 2025

The interesttarget attribute w3ctag/design-reviews#1058

Open

1 task

OliverJAsh mentioned this pull request Feb 21, 2025

Feature Request: Top Layer Stack Management #10370

Closed

scottaohara mentioned this pull request Mar 7, 2025

Add command/commandfor attributes w3c/html-aria#545

Open

lozy219 pushed a commit to lozy219/html that referenced this pull request Mar 10, 2025

Editorial: extract "show a modal dialog" algorithm

be8e547

This will help with whatwg#9841.

annevk mentioned this pull request Apr 24, 2025

Set invoker for popover command attributes #11248

Merged

annevk pushed a commit that referenced this pull request May 12, 2025

Invoke show popover algorithm correctly

47f854c

#9841 did not do this correctly, likely do it being developed over a long period of time in which this algorithm changed shape.

Add commandfor & command attributes to HTMLButtonElement #9841

Add commandfor & command attributes to HTMLButtonElement #9841

Uh oh!

Conversation

keithamus commented Oct 8, 2023 • edited by pr-preview bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

scottaohara commented Oct 18, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

This comment was marked as outdated.

lukewarlow commented Nov 4, 2023

Uh oh!

domenic commented Nov 5, 2023

Uh oh!

keithamus commented Nov 5, 2023

Uh oh!

domenic commented Nov 5, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

lukewarlow commented Dec 1, 2023

Uh oh!

lukewarlow commented Dec 1, 2023

Uh oh!

mfreed7 commented Jan 17, 2024

Uh oh!

keithamus commented Jan 17, 2024

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

mfreed7 commented Jan 17, 2024

Uh oh!

keithamus commented Feb 19, 2025

Uh oh!

foolip left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

keithamus commented Feb 19, 2025

Uh oh!

foolip commented Feb 19, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Milestone

Development

Uh oh!

13 participants

keithamus commented Oct 8, 2023 •

edited by pr-preview bot

Loading

scottaohara commented Oct 18, 2023 •

edited

Loading

domenic commented Nov 5, 2023 •

edited

Loading