Update clay:management-toolbar to Clay 3

• Type: Epic
• Status: Closed
• Priority: Critical
• Resolution: Completed
• Affects Version/s: None
• Fix Version/s: None
• Component/s: Tag Libraries > Clay Taglibs
• Labels:
  • 7.4-ce-ga1
  • fc_20_12
  • fi-s-dxp
  • team_fi_epic_category_frontend_components
• Epic/Theme:
  • FI_Platform_Evolution

Currently, the clay:management-toolbar depends on the legacy soy version of ManagementToolbar.

The goal of this epic is to remove the Soy dependency from clay:management-toolbar and rewrite the tag as a combination of Java+React

Acceptance Criteria:

• A new ManagementToolbarTag.java class that doesn't depend on Soy replaces the old one
  • Uses Java to render minimal markup server-side
  • Uses the React component if necessary to render client-side
• The legacy ManagementToolbarTag.java class is deprecated
• All usages of clay:management-toolbar keep working as expected
• The API of clay:management-toolbar follows other migrated tags

Considerations
Based on a quick initial analysis, we currently have 199 usages of this tag in 79 different modules. Most instances receive a displayContext object with the toolbar configuration.

To simplify the epic, we propose the following action:

• Create a temporary clay:management-toolbar-v2
• Move all usages from clay:management-toolbar to clay:management-toolbar-v2
• Create the new clay:management-toolbar
• Start migrating one module at a time until the confidence level is high enough to do a mass replacement

Test Information section 

Test Scenarios:

Requirement	Test Case	Covered by frontend/backend unit test? (Yes/No)	Test Priority (business impact)
LPS-112468	Given liferay-clay.tld When search for <name>management-toolbar</name> Then the following <tag-class> does not contain a "soy" string in the path	no	4-major
LPS-112468	Given a terminal at portal root When run `find . | grep /soy/ManagementToolbarTag.java` Then no lines are returned	no	5-critical
LPS-112468	Given a terminal at portal root When grep -r "clay:management-toolbar-v2" Then no lines are returned	no	3-medium

  

Exploratory testing to consider:

Requirement	Test Scenarios	Test Priority (business impact)	Covered by frontend/backend Unit Test?	Chrome Pass/Fail	Edge Pass/Fail	Firefox Pass/Fail	Safari mobile Pass/Fail
LPS-112468	Given: Web Content admin page (Control Panel > Content > Web Content) When: Use keyboard only Then: Able to access all interactible elements on the toolbar	3 - medium	no		n/a	n/a	n/a
LPS-112468	Given: Web Content admin page (Control Panel > Content > Web Content) When: using a screenreader Then: identifies all aspects of actions of the management toolbar	2 - low	no		n/a	n/a	n/a
LPS-112468	Given: Web Content admin page (Control Panel > Content > Web Content) When: Use AXE chrome extension Then: No issues related to WCAG AA and A related to management toolbar	2 - low	no		n/a	n/a	n/a
LPS-121853	Exploratory test a sample portlet with management toolbar v3 tag. Validate that the toolbar doesn't flicker 2 seconds after page has loaded	3 - medium	no
LPS-112468	Exploratory test management toolbar features in web content for Control Panel level testing and component team usage (5 mins)	3 - medium	no
LPS-112468	Exploratory test sample portlet with management toolbar v3 and research about performance metrics.	3 - medium	no		n/a	n/a	n/a

 
What QA will not test:

• Analysis for unit and integration test needs
• Ensure that soy is completely removed from management-toolbar