fix: respect both checkProperties and arrayName options (#182)

.github/workflows/until-destroy.yml

@@ -13,41 +13,45 @@ jobs:
       fail-fast: true
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - uses: actions/cache@v1
-        id: yarn-cache
+        id: pnpm-cache
         with:
           path: |
-            node_modules
+            ~/.pnpm-store
             ~/.cache
-          key: ${{ runner.os }}-yarn-${{ hashFiles('./yarn.lock') }}
-          restore-keys: ${{ runner.os }}-yarn
+          key: ${{ runner.os }}-pnpm-${{ hashFiles('./pnpm-lock.yaml') }}
+          restore-keys: ${{ runner.os }}-pnpm
 
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14.15
+          node-version: '15'
+
+      - uses: pnpm/action-setup@v2.2.1
+        with:
+          version: 5.17.3
 
       - name: Install dependencies
-        if: steps.yarn-cache.outputs.cache-hit != 'true'
+        if: steps.pnpm-cache.outputs.cache-hit != 'true'
         env:
           HUSKY_SKIP_INSTALL: 'true'
-        run: yarn --pure-lockfile --non-interactive --no-progress
+        run: pnpm install --frozen-lockfile
 
       - name: Run ESLint
-        run: yarn lint
+        run: pnpm lint
 
       - name: Run unit tests
-        run: yarn test
+        run: pnpm test
 
       - name: Run integration tests
-        run: yarn test:integration
+        run: pnpm test:integration
 
       - name: Build library
-        run: yarn build
+        run: pnpm build
 
       - name: Build integration app in production mode
-        run: yarn build:integration
+        run: pnpm build:integration
 
       - name: Run Cypress tests
-        run: yarn test:e2e:integration
+        run: pnpm test:e2e:integration

.nvmrc

@@ -0,0 +1 @@
+node

CONTRIBUTING.md

@@ -7,37 +7,37 @@
 Start by installing all dependencies:
 
 ```bash
-npm ci
+pnpm install --frozen-lockfile
 ```
 
 Run the tests:
 
 ```bash
-npm test
+pnpm test
 ```
 
 Run the tests in watch mode:
 
 ```bash
-npm run test:watch
+pnpm test:watch
 ```
 
 Run the playground app:
 
 ```bash
-npm run serve:integration
+pnpm serve:integration
 ```
 
 Run the playground integration tests:
 
 ```bash
-npm run test:integration
+pnpm test:integration
 ```
 
 ## Building
 
 ```bash
-npm run build
+pnpm build
 ```
 
 ## <a name="rules"></a> Coding Rules

apps/integration/src/app/array-of-subscriptions/document-click/document-click.component.ts

@@ -1,12 +1,15 @@
 import { ChangeDetectionStrategy, Component, Host } from '@angular/core';
 import { UntilDestroy } from '@ngneat/until-destroy';
-import { BehaviorSubject, fromEvent, Subscription } from 'rxjs';
-import { pluck, finalize } from 'rxjs/operators';
+import { BehaviorSubject, combineLatest, fromEvent, Subject, Subscription } from 'rxjs';
+import { pluck, finalize, take } from 'rxjs/operators';
 
 import { LoggerFactory } from '../../logger/logger.factory';
 import { ArrayOfSubscriptionsComponent } from '../array-of-subscriptions.component';
 
-@UntilDestroy({ arrayName: 'subscriptions' })
+@UntilDestroy({
+  checkProperties: true,
+  arrayName: 'subscriptions',
+})
 @Component({
   selector: 'app-document-click',
   templateUrl: './document-click.component.html',
@@ -15,26 +18,52 @@ import { ArrayOfSubscriptionsComponent } from '../array-of-subscriptions.compone
 export class DocumentClickComponent {
   clientX$ = new BehaviorSubject<number>(0);
 
+  subscription: Subscription;
   subscriptions: Subscription[] = [];
 
+  private standaloneSubjectHasBeenUnsubsibed$ = new Subject<true>();
+  private subjectWithinArrayHasBeneUnsubscribed$ = new Subject<true>();
+
   constructor(loggerFactory: LoggerFactory, @Host() host: ArrayOfSubscriptionsComponent) {
     host.documentClickUnsubscribed$.next(false);
 
-    const logger = loggerFactory.createLogger('DocumentClickComponent', '#b100aa');
+    const logger = loggerFactory.createLogger('DocumentClickComponent', '#ed33b9');
+
+    this.subscription = fromEvent<MouseEvent>(document, 'click')
+      .pipe(
+        pluck('clientX'),
+        finalize(() => {
+          logger.log('standalone fromEvent has been unsubscribed');
+          this.standaloneSubjectHasBeenUnsubsibed$.next(true);
+        })
+      )
+      .subscribe(clientX => {
+        logger.log(`You've clicked on the document and clientX is ${clientX}`);
+        this.clientX$.next(clientX);
+      });
 
     this.subscriptions.push(
       fromEvent<MouseEvent>(document, 'click')
         .pipe(
           pluck('clientX'),
           finalize(() => {
-            logger.log('fromEvent has been unsubscribed');
-            host.documentClickUnsubscribed$.next(true);
+            logger.log('fromEvent within array has been unsubscribed');
+            this.subjectWithinArrayHasBeneUnsubscribed$.next(true);
           })
         )
         .subscribe(clientX => {
           logger.log(`You've clicked on the document and clientX is ${clientX}`);
           this.clientX$.next(clientX);
         })
     );
+
+    combineLatest([
+      this.standaloneSubjectHasBeenUnsubsibed$,
+      this.subjectWithinArrayHasBeneUnsubscribed$,
+    ])
+      .pipe(take(1))
+      .subscribe(() => {
+        host.documentClickUnsubscribed$.next(true);
+      });
   }
 }

libs/until-destroy/src/lib/until-destroy.ts

@@ -19,7 +19,7 @@ function unsubscribe(property: unknown): void {
   }
 }
 
-function unsubscribeIfPropertyIsArrayLike(property: any[]): void {
+function unsubscribeIfPropertyIsArrayLike(property: unknown[]): void {
   Array.isArray(property) && property.forEach(unsubscribe);
 }
 
@@ -37,7 +37,7 @@ function decorateNgOnDestroy(
 
     // Check if subscriptions are pushed to some array
     if (options.arrayName) {
-      return unsubscribeIfPropertyIsArrayLike(this[options.arrayName]);
+      unsubscribeIfPropertyIsArrayLike(this[options.arrayName]);
     }
 
     // Loop through the properties and find subscriptions

package.json

@@ -5,7 +5,7 @@
   "license": "MIT",
   "private": true,
   "scripts": {
-    "postinstall": "ngcc && node ./decorate-angular-cli.js && husky install",
+    "postinstall": "node ./decorate-angular-cli.js && husky install",
     "contributors:add": "all-contributors add",
     "contributors:generate": "all-contributors init",
     "release": "cd libs/until-destroy && standard-version --infile ../../CHANGELOG.md --skip.bump --skip.commit --skip.tag",
@@ -34,22 +34,22 @@
     "Angular unsubscribe"
   ],
   "devDependencies": {
-    "@angular-devkit/build-angular": "13.0.3",
-    "@angular-eslint/builder": "12.1.0",
-    "@angular-eslint/eslint-plugin": "12.6.1",
-    "@angular-eslint/eslint-plugin-template": "12.6.1",
-    "@angular-eslint/schematics": "12.1.0",
-    "@angular-eslint/template-parser": "12.6.1",
-    "@angular/cli": "13.0.3",
-    "@angular/common": "13.0.2",
-    "@angular/compiler": "13.0.2",
-    "@angular/compiler-cli": "13.0.2",
-    "@angular/core": "13.0.2",
-    "@angular/platform-browser": "13.0.2",
-    "@angular/platform-browser-dynamic": "13.0.2",
-    "@angular/router": "13.0.2",
-    "@commitlint/cli": "^13.0.0",
-    "@commitlint/config-conventional": "^13.0.0",
+    "@angular-devkit/build-angular": "13.3.0",
+    "@angular-eslint/builder": "13.1.0",
+    "@angular-eslint/eslint-plugin": "13.1.0",
+    "@angular-eslint/eslint-plugin-template": "13.1.0",
+    "@angular-eslint/schematics": "13.1.0",
+    "@angular-eslint/template-parser": "13.1.0",
+    "@angular/cli": "13.3.0",
+    "@angular/common": "13.3.0",
+    "@angular/compiler": "13.3.0",
+    "@angular/compiler-cli": "13.3.0",
+    "@angular/core": "13.3.0",
+    "@angular/platform-browser": "13.3.0",
+    "@angular/platform-browser-dynamic": "13.3.0",
+    "@angular/router": "13.3.0",
+    "@commitlint/cli": "16.2.1",
+    "@commitlint/config-conventional": "16.2.1",
     "@nrwl/angular": "13.2.1",
     "@nrwl/cli": "13.2.1",
     "@nrwl/cypress": "13.2.1",
@@ -59,36 +59,36 @@
     "@nrwl/tao": "13.2.1",
     "@nrwl/workspace": "13.2.1",
     "@types/jest": "27.0.2",
-    "@types/node": "^15.12.1",
+    "@types/node": "15.12.1",
     "@typescript-eslint/eslint-plugin": "4.31.2",
     "@typescript-eslint/parser": "4.31.2",
     "all-contributors-cli": "^6.8.1",
-    "cpx": "^1.5.0",
+    "cpx": "1.5.0",
     "cypress": "8.7.0",
     "eslint": "^7.26.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-ban": "^1.5.2",
     "eslint-plugin-cypress": "^2.11.3",
     "glob": "^7.1.6",
-    "husky": "^6.0.0",
+    "husky": "7.0.4",
     "jest": "27.2.3",
     "jest-preset-angular": "11.0.0",
     "lint-staged": "^11.0.0",
     "minimist": "^1.2.5",
-    "ng-packagr": "13.0.6",
+    "ng-packagr": "13.3.0",
     "postcss": "^8.3.9",
     "postcss-import": "^14.0.2",
     "postcss-preset-env": "^6.7.0",
     "postcss-url": "^10.1.1",
-    "prettier": "^2.3.1",
-    "rxjs": "^7.3.0",
+    "prettier": "2.6.0",
+    "rxjs": "7.5.5",
     "serve": "^12.0.0",
     "standard-version": "^9.0.0",
     "start-server-and-test": "^1.12.0",
     "ts-jest": "27.0.5",
     "ts-morph": "^7.1.2",
     "tslib": "^2.0.0",
-    "typescript": "4.4.4",
+    "typescript": "4.6.2",
     "zone.js": "0.11.4"
   },
   "lint-staged": {