Improve capabilities and styling of config forms list item action buttons.

Review Request #11036 — Created May 22, 2020 and submitted


Action definitions now support a couple additional settings:

  • ariaLabel can be can be provided to set a better label used for
    screen readers.
  • url can be set to use an <a href="..."> instead of a <button>.

Action button callbacks can also now return a Promise. This will cause
the button's contents to be replaced with a spinner and the button to be
disabled until the promise is resolved, making it clear when an action
is occurring and avoiding issues with the action being triggered
multiple times.

ListItem models also now have a convenient setActions() method for
setting new actions on the model and triggering the appropriate signal
to re-render the actions list.

To support the new capabilities, particularly the link buttons, the
styling had to be tweaked to increase rule specificity. This is because
for link actions, we set a btn class, and this is overridden in other
stylesheets in a way that caused our settings to be lost. The new rules
ensure we have higher specificity in any common case.

Tested our config forms usage with the new settings and saw that they
were all rendering correctly.

Tested the new Promise support, verifying the spinner replaced the
contents at the start of the operation and restored the contents at
the end.

Improve capabilities and styling of config forms list item action buttons.
Loading file attachments...

Description From Last Updated

Col: 35 Missing semicolon.

Checks run (1 failed, 1 succeeded)
flake8 passed.
JSHint failed.


  1. Ship It!
Review request changed

Status: Closed (submitted)

Change Summary:

Pushed to release-2.0.x (dfc82f9)