fix(wizard): dynamic initialization with prevented navigation (#1473)

## PR Checklist

Please check if your PR fulfills the following requirements:

- [x] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [x] Bugfix
- [ ] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

Throws error if pages empty and navigation prevented.

Issue Number: CDE-2156

## What is the new behavior?

No error is thrown

## Does this PR introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

projects/angular/src/wizard/test-components/dynamic-empty-wizard.mock.ts

@@ -0,0 +1,35 @@
+/*
+ * Copyright (c) 2016-2024 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+
+import { Component, ViewChild } from '@angular/core';
+
+import { ClrWizard } from '../wizard';
+
+@Component({
+  template: `
+    <clr-wizard #wizard [(clrWizardOpen)]="open" [clrWizardPreventNavigation]="preventNavigation">
+      <clr-wizard-title>My Wizard Title</clr-wizard-title>
+      <clr-wizard-button [type]="'cancel'">Cancel</clr-wizard-button>
+      <clr-wizard-button [type]="'previous'">Back</clr-wizard-button>
+      <clr-wizard-button [type]="'next'">Next</clr-wizard-button>
+      <clr-wizard-button [type]="'finish'">Fait Accompli</clr-wizard-button>
+
+      <ng-container *ngFor="let page of pages">
+        <clr-wizard-page [id]="page">
+          <ng-template clrPageTitle>Page {{ page }}</ng-template>
+          <p>Content for page {{ page }}</p>
+        </clr-wizard-page>
+      </ng-container>
+    </clr-wizard>
+  `,
+})
+export class DynamicEmptyWizardTestComponent {
+  @ViewChild('wizard', { static: true }) wizard: ClrWizard;
+  open = true;
+  pages = [];
+  preventNavigation = true;
+}

projects/angular/src/wizard/wizard.html

@@ -23,7 +23,7 @@
     <clr-wizard-stepnav></clr-wizard-stepnav>
   </div>
 
-  <div class="modal-title" role="heading" [attr.aria-level]="navService.currentPage.pageTitle.headingLevel || 2">
+  <div class="modal-title" role="heading" [attr.aria-level]="navService.currentPage?.pageTitle.headingLevel || 2">
     <span tabindex="-1" #pageTitle class="modal-title-text">
       <ng-template [ngTemplateOutlet]="navService.currentPageTitle"></ng-template>
     </span>

projects/angular/src/wizard/wizard.spec.ts

@@ -12,6 +12,7 @@ import { PageCollectionService } from './providers/page-collection.service';
 import { WizardNavigationService } from './providers/wizard-navigation.service';
 import { TemplateApiWizardTestComponent } from './test-components/api-wizard.mock';
 import { BasicWizardTestComponent } from './test-components/basic-wizard.mock';
+import { DynamicEmptyWizardTestComponent } from './test-components/dynamic-empty-wizard.mock';
 import { DynamicWizardTestComponent } from './test-components/dynamic-wizard.mock';
 import { UnopenedWizardTestComponent } from './test-components/unopened-wizard.mock';
 import { ClrWizard } from './wizard';
@@ -659,6 +660,15 @@ export default function (): void {
       });
     });
 
+    // CDE-2156
+    describe('Initialization', () => {
+      it('should be initilized empty and with navigation prevented.', function () {
+        expect(() => {
+          this.create(ClrWizard, DynamicEmptyWizardTestComponent);
+        }).not.toThrow();
+      });
+    });
+
     describe('Dynamic Content', () => {
       let context: TestContext<ClrWizard, DynamicWizardTestComponent>;
       let wizard: ClrWizard;