Skip to content

v13.41.0

Choose a tag to compare

View all tags
@tomlyn tomlyn released this 06 Mar 23:59
v13.41.0
cad9538
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

Minor Release v13.41.0

Common Canvas

#2929 Display context menu/toolbar for port with keyboard shortcut

Note: During testing, I discovered that the shortcut Alt/Option + Tab which was used to move focus from a node to one of its "sub-objects" is used in Windows to switch between applications, which seems like a pretty useful shortcut and shouldn't be replicated in Common Canvas, so I chose Shift + Alt/Option + Down Arrow instead.

Once the focus is on a sub-object the user can continue to press that shortcut to cycle through the focusable sub-objects or use Shift + Alt/Option + Up Arrow to cycle backwards through them or press Esc to return focus to the parent object. Pressing Tab or Shift + Tab will also cycle the focus forwards and backwards through the set of sub-objects.

With focus on a focusable port, the user can now open a context menu (or context toolbar) for that port using the standard Command + <comma> shortcut

#2920 Link specific ports via keyboard

The user can now create a port-to-port data link in numerous ways:

  1. Using just the keyboard with shortcuts
    (a) The user moves the focus to a focusable output port on a source node and presses Shift + Command + <L key> and a little arrow appears. The arrow will not appear if the output port is already maxed out in terms of its cardinality.
    (b) The user moves focus to a focusable input port on the target node and presses the same shortcut to complete the link. The link will not be created if there is no output port marked for connection or if the input port is already maxed out in terms of its cardinality.

  2. Using just the keyboard with context menu / context toolbar:
    (a) The user moves the focus to a focusable output port on a source node and presses Command + <comma> and a context menu appears for the port containing a Connect from option. The option is disabled if the output port is already maxed out in terms of its cardinality. After clicking the option a small arrow appears.
    (b) The user moves focus to a focusable input port on the target node and presses Command + <comma> and a context menu appears for the port containing a Connect to option. After clicking the option the link is created. The option will be disabled if there is no output port marked for connection or if the input port is already maxed out in terms of its cardinality.

  3. Using single-clicks with the mouse/trackpad (no dragging needed)
    (a) The user right-clicks on an output port and a context menu appears containing a Connect from option. The option is disabled if the output port is already maxed out in terms of its cardinality. After clicking the option a small arrow appears.
    (b) The user right-clicks an input port and a context menu appears for the port containing a Connect to option. After clicking the option the link is created. The option will be disabled if there is no output port marked for connection or if the input port is already maxed out in terms of its cardinality.

  4. Using drag from output port and drop on input port (previously implemented)

Three new Canvas Controller methods have been added to allow the application manage this if needed:

    setPortConnectFrom(nodeId, portId, pipelineId) 
    getConnectFromInfo(pipelineId) 
    clearConnectFromStatus(pipelineId)

#2947 Allow Elyra Canvas to be wrapped with a <main> element

Changes to the aria roles and landmarks for accessibility in Common Canvas mean that the application should now wrap Common Canvas in a element that is intrinsically a landmark or with a <div> with a landmark role. This avoids errors being detected by the Accessibility Checker. For example:

<main>
    <CommonCanvas ... />
</main>

Here is what Bob created for me to summarize the current roles/landmark situation:

ARIA Landmarks and Roles Analysis - Organized by Component

Test Harness Infrastructure

Notes File Element Role aria-label
Main content area App.js main main (implicit) "Test harness"
Test harness banner App.js div banner "Test harness"
Side panel landmark sidepanel.jsx div region "Right Side Panel"

Common Canvas

Notes File Element Role aria-label
Main canvas application cc-contents.jsx div application "Flow Editor"
Palette navigation region palette-flyout.jsx div region "Flyout Palette"
Palette item button palette-content-list-item.jsx div button -
Palette dialog region palette-dialog-under.jsx div region "Dialog Palette"
Notification panel container notification-panel.jsx div region Notification header + subtitle
Container for notification messages notification-panel.jsx div list -
Individual notification items notification-panel.jsx div listitem -
Close message button notification-panel.jsx div button -
Toolbar container toolbar.jsx div toolbar Title passed in from wrapper object
Context menu container common-context-menu.jsx div menu -
Individual menu items common-context-menu.jsx div menuitem -
Disabled menu items common-context-menu.jsx div menuitem -
Tooltip trigger (when showToolTipOnClick=true) tooltip.jsx div button -
Tooltip content container tooltip.jsx div tooltip -

Common Properties

Notes File Element Role aria-label
Properties wrapper (right flyout) common-properties.jsx aside complementary (implicit) "{label} Properties"
Properties wrapper (custom container) common-properties.jsx aside complementary (implicit) "{label} Properties"
Main properties container properties-main.jsx aside complementary (implicit) "{label} Properties"
Properties wrapper (right flyout) with region common-properties.jsx aside region "{label} Properties"
Properties wrapper (custom container) with region common-properties.jsx aside region "{label} Properties"
Main properties container with region properties-main.jsx aside region "{label} Properties"
Container for notification messages notification-panel.jsx div list -
Individual notification items notification-panel.jsx div listitem -
Batch summary (aria-roledescription="text") table-toolbar.jsx div button -
properties-header-row (data attribute) virtualized-grid.jsx tr (data-role) -
properties-data-row (data attribute) virtualized-grid.jsx tr (data-role) -
Column resize handle virtualized-grid.jsx div button "Resize column"
Header checkbox for selection virtualized-grid.jsx div checkbox -
Table row virtualized-table.jsx div row -
Loading row virtualized-table.jsx div row -
Data row virtualized-table.jsx div row -
Table cell virtualized-table.jsx div gridcell -
Column resize handle virtualized-table.jsx div button "Resize column"
Fixes a11y violation (no headers) structureeditor.jsx table presentation -
Fixes a11y violation (no headers) summary.jsx table presentation -

#2963 Canvas Controller should accept instance ID as a parameter of the constructor instead of being specified via setInstanceId()

The canvas controller’s constructor now takes an optional instanceId parameter. This can be used to specify an instance identifier, as a string or number, that is used by Common Canvas to generate unique <div> IDs etc. If the parameter is not provided Canvas Controller generates its own unique ID.

The setInstanceId() method of the Canvas Controller, which is unsafe to use unless it is called immediately after the canvas controller is created, is now deprecated and will be removed in a future major release.

#2959 For context toolbar, display tooltips for icons when using keyboard operation

Tooltips are now automatically displayed when the user moves focus with the keyboard on these different toolbars:

  • The main flow editor toolbar
  • Context toolbars (displayed over nodes, comments, ports, links and on the flow editor background)
  • Text toolbars that are opened whenever markdown or WYSIWYG comments are edited.
  • The test harness main toolbar.

Common Properties

#2939 Support JSX from paramDefs in TwistyPanel

A new callback called panelTitleHandler() has been added to allow applications to customize the title display of panels. This callback is currently only called when rendering a twisty panel and allows you to replace the default panel title with custom content. The callback should return a string, object, or null to use the default label defined in the parameter definition.

Issues Resolved

Full Changelog: v13.40.1...v13.41.0

Contributors

caritaou, samueldmeyer, and 4 other contributors
Assets 2
Loading