search

adobe / aem-core-wcm-components

Standardized components to build websites with AEM.
https://docs.adobe.com/content/help/en/experience-manager-core-components/using/introduction.html
Apache License 2.0
744 stars 750 forks source link

Allowed Components don't show up in UI for Container when responsivegrid is set #1310

Open knennigtri opened 3 years ago

knennigtri commented 3 years ago

Might be related to #1151

Bug Report

Current Behavior

  1. Install AEM 6.5.7 with WKND 0.0.6 or the core component example library.
  2. Install core cmps 2.13
  3. Go into the template console > Create new template
  4. Drag and drop the core container component
  5. Set layout=responsivegrid through the dialog image
  6. Unlock the Container component
  7. Add a policy with a few allowed components and click the done checkmark CANNOT_see_components The container component shows up blank.
  8. Relock the container component, go into the dialog and set it back to default (or simple) image
  9. Unlock the container again and observe the components now show: CAN_see_components

Note: this exact same issue can be achieved by using the policy as well:

  1. Add a container component and unlock it
  2. Go into the policy and add allowed components and under the container settings select Responsive Grid container_ResponsiveGrid
  3. Allow components don't show when layout=responsivegrid in the policy CANNOT_see_components

Expected behavior/code

  1. Same Steps as 1-6 above and the expected result should be: CAN_see_components

Whether layout=simple, layout=respinsivegrid, or layout is not set, it should always show the list of allowed components of the Container component

Environment

Possible Solution I've tested with AEM 6.5.4, 6.5.7, latest CS build, wknd 0.0.6, core cmps 2.12.2, and core cmps 2.13. The only time this issue comes up is on AEM 6.5.x, the site and core component version doesn't seem to matter.

Additional context / Screenshots layout property applied via a dialog in the Template Editor image layout property applied via a policy in the Template Editor image

mrozati commented 3 years ago

The issue is caused in container.html#L17 where the property layout is literally compared to the constant name RESPONSIVE_GRID instead of constant value responsiveGrid

So, a quick solution is changing it as follows

${container.layout == 'responsiveGrid'}

or to fix the constant reference

vladbailescu commented 3 years ago

The compare is done correctly (see https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#1142-comparison-operators, specifically Java Enum comparison). The issue you see is actually related to the container adding a wrapper element on top of the responsive grid, which causes the editor to not pick up placeholders for allowed components. There's a fix in the product for this (internal references CQ-4305421, CQ-4305870) which would need to be added to the 6.5 service pack.

vladbailescu commented 3 years ago

We'll track the backport for the fix under NPR-35565.

vladbailescu commented 3 years ago

@knennigtri , when trying to validate the aforementioned backport we saw we cannot reproduce the issue with AEM 6.5.7.0 and Core Components 2.13+. The screenshots show a different (older) version of the core components (at least the library). Could you check and confirm the steps?

dhardtke commented 3 years ago

We have the same issue using the latest Core Components (2.14.0). This happens regardless of the setting layoutMode (i.e., the behavior is the same for "SIMPLE" and "RESPONSIVE").

vladbailescu commented 3 years ago

@dhardtke , what version of AEM are you on? Is it working with different version of Core Components and failing with 2.14.0?

dhardtke commented 3 years ago

@vladbailescu I can reproduce it using AEM 6.5.7.0 and https://github.com/adobe/aem-guides-wknd/releases/tag/aem-guides-wknd-0.2.0 with the latest Core Components (2.15.0):

  1. Install aem-guides-wknd-0.2.0
  2. Open http://localhost:4502/editor.html/conf/wknd/settings/wcm/templates/content-page-template/structure.html
  3. Open the Design Dialog / Policy of the Container (the Policy's title is "WKND Content")
  4. Switch the layout under "Responsive Settings" from "(Default)" to e.g. "Responsive Grid"

image

Sravan246 commented 3 years ago

@vladbailescu Is this issue fixed in the latest core components version? If not, can we expect this issue to be fixed in any of the upcoming core components releases which works with AEM 6.5.x also?

dhardtke commented 3 years ago

For us the issue is fixed after installing AEM 6.5 SP 8 (per Release Notes, see https://experienceleague.adobe.com/docs/experience-manager-65/release-notes/service-pack/previous-hotfixes-featurepacks.html?lang=en):

An unlocked responsive container does not display allowed components (NPR-35565).