fix(module:modal): remove dark backdrop when nzMask is false (#8798)

Author: withOutUndo

components/modal/modal.service.ts

@@ -134,13 +134,11 @@ export class NzModalService implements OnDestroy {
     const overlayConfig = new OverlayConfig({
       hasBackdrop: true,
       scrollStrategy: this.overlay.scrollStrategies.block(),
+      backdropClass: getValueWithConfig(config.nzMask, globalConfig.nzMask, true) ? MODAL_MASK_CLASS_NAME : '',
       positionStrategy: this.overlay.position().global(),
       disposeOnNavigation: getValueWithConfig(config.nzCloseOnNavigation, globalConfig.nzCloseOnNavigation, true),
       direction: getValueWithConfig(config.nzDirection, globalConfig.nzDirection, this.directionality.value)
     });
-    if (getValueWithConfig(config.nzMask, globalConfig.nzMask, true)) {
-      overlayConfig.backdropClass = MODAL_MASK_CLASS_NAME;
-    }
 
     return this.overlay.create(overlayConfig);
   }

components/modal/modal.spec.ts

@@ -504,6 +504,32 @@ describe('NzModal', () => {
     flush();
   }));
 
+  it('nzMask work', fakeAsync(() => {
+    configService.set('modal', { nzMask: false });
+
+    const modalRef = modalService.create({
+      nzContent: TestWithModalContentComponent
+    });
+
+    fixture.detectChanges();
+
+    expect(modalRef.getBackdropElement()?.classList)
+      .not.withContext('not has default cdk dark backdrop')
+      .toContain('cdk-overlay-dark-backdrop');
+
+    configService.set('modal', { nzMask: true });
+    fixture.detectChanges();
+
+    expect(modalRef.getBackdropElement()?.classList).toContain(
+      'ant-modal-mask',
+      'should add class when global config changed'
+    );
+
+    modalRef.close();
+    fixture.detectChanges();
+    flush();
+  }));
+
   it(
     'should not close when clicking on the modal wrap and ' + 'nzMaskClosable or nzMask is false',
     fakeAsync(() => {