diff --git a/CHANGELOG.md b/CHANGELOG.md index ac78458a35..813bd3fba0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ Our versioning strategy is as follows: * `[sitecore-jss-nextjs]` `[sitecore-jss]` Resolved an issue with Netlify where URL query parameters were being sorted, causing redirect failures. Added a method to generate all possible permutations of query parameters, ensuring proper matching with URL patterns regardless of their order. ([#1935](https://github.com/Sitecore/jss/pull/1935)) * `[sitecore-jss-angular]` Fix default empty field components to not render the unwanted wrapping tags ([#1937](https://github.com/Sitecore/jss/pull/1937)) ([#1940](https://github.com/Sitecore/jss/pull/1940)) * `[sitecore-jss-angular]` Fix image field style property not rendered properly ([#1944](https://github.com/Sitecore/jss/pull/1944)) +* `[sitecore-jss-angular]` Fix nested dynamic placeholders not being displayed in Pages ([#1947](https://github.com/Sitecore/jss/pull/1947)) * `[sitecore-jss-nextjs]` Resolved an issue with Netlify where URL query parameters were being sorted, causing redirect failures. Added a method to generate all possible permutations of query parameters, ensuring proper matching with URL patterns regardless of their order. ([#1935](https://github.com/Sitecore/jss/pull/1935)) * `[sitecore-jss-nextjs]` Fixed an issue with language-based redirects, ensuring users are correctly redirected to the appropriate language-specific pages rather than defaulting to the primary language. ([#1938](https://github.com/Sitecore/jss/pull/1938)) diff --git a/packages/sitecore-jss-angular/src/components/placeholder.component.spec.ts b/packages/sitecore-jss-angular/src/components/placeholder.component.spec.ts index 21a5fad15c..0314cfc08b 100644 --- a/packages/sitecore-jss-angular/src/components/placeholder.component.spec.ts +++ b/packages/sitecore-jss-angular/src/components/placeholder.component.spec.ts @@ -1269,4 +1269,20 @@ describe('Placeholder Metadata: dynamic placeholder:', () => { expect(cleanedRenderedHTML).toEqual(expectedHTML); }) ); + + it( + 'should retain correct name of dynamic placeholder', + waitForAsync(async () => { + const layoutData = layoutDataForNestedDynamicPlaceholder('container-{*}'); + const component = layoutData.sitecore.route; + const phKey = 'container-2'; + comp.name = phKey; + comp.rendering = (component as unknown) as ComponentRendering; + + fixture.detectChanges(); + await fixture.whenStable(); + const placeholder = de.query(By.css('sc-placeholder')).componentInstance; + expect(Object.keys(placeholder?.rendering?.placeholders || [])).toEqual(['container-{*}']); + }) + ); }); diff --git a/packages/sitecore-jss-angular/src/components/placeholder.component.ts b/packages/sitecore-jss-angular/src/components/placeholder.component.ts index 17e07506a7..5443c733e3 100644 --- a/packages/sitecore-jss-angular/src/components/placeholder.component.ts +++ b/packages/sitecore-jss-angular/src/components/placeholder.component.ts @@ -127,7 +127,6 @@ export class PlaceholderComponent implements OnInit, OnChanges, DoCheck, OnDestr private placeholderData?: (ComponentRendering | HtmlElementRendering)[]; private destroyed = false; private parentStyleAttribute = ''; - private editMode?: EditMode = undefined; private contextSubscription: Subscription; constructor( @@ -145,7 +144,11 @@ export class PlaceholderComponent implements OnInit, OnChanges, DoCheck, OnDestr // eslint-disable-next-line @typescript-eslint/ban-types @Inject(PLATFORM_ID) private platformId: Object, private jssState: JssStateService - ) {} + ) { + this.contextSubscription = this.jssState.state.subscribe(({ sitecore }) => { + this.metadataMode = sitecore?.context.editMode === EditMode.Metadata; + }); + } @Input() set inputs(value: { [key: string]: unknown }) { @@ -170,10 +173,6 @@ export class PlaceholderComponent implements OnInit, OnChanges, DoCheck, OnDestr } } this.placeholderData = this.renderings || this.getPlaceholder() || []; - this.contextSubscription = this.jssState.state.subscribe(({ sitecore }) => { - this.editMode = sitecore?.context.editMode; - this.metadataMode = this.editMode === EditMode.Metadata; - }); } ngOnDestroy() { @@ -267,7 +266,7 @@ export class PlaceholderComponent implements OnInit, OnChanges, DoCheck, OnDestr ? getDynamicPlaceholderPattern(placeholder) : null; if (patternPlaceholder && patternPlaceholder.test(phName)) { - if (this.editMode === EditMode.Metadata) { + if (this.metadataMode) { phName = placeholder; } else { this.rendering.placeholders![phName] = this.rendering.placeholders![placeholder];