refactor(lib): move timeout logic into ElementBoundaryService

Author: gund

projects/ngx-element-boundary/src/lib/cross-boundary-ng-element-strategy.ts

@@ -1,7 +1,7 @@
 import { ComponentRef, Injector } from '@angular/core';
 import { NgElementStrategy, NgElementStrategyFactory } from '@angular/elements';
-import { of, Subject } from 'rxjs';
-import { take, takeUntil, timeoutWith } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import { take, takeUntil } from 'rxjs/operators';
 
 import {
   ElementBoundaryNgElementStrategy,
@@ -96,15 +96,8 @@ export class CrossBoundaryNgElementStrategy implements NgElementStrategy {
     }
 
     this.elementBoundaryService
-      .whenBoundaryExist(element)
-      .pipe(
-        (o$) =>
-          this.options.boundaryTimeoutMs > 0
-            ? o$.pipe(timeoutWith(this.options.boundaryTimeoutMs, of(null)))
-            : o$,
-        take(1),
-        takeUntil(this.disconnect$),
-      )
+      .whenBoundaryExist(element, this.options.boundaryTimeoutMs)
+      .pipe(take(1), takeUntil(this.disconnect$))
       .subscribe((boundary) => {
         if (boundary) {
           this.hookableInjector.hook(boundary.injector);

projects/ngx-element-boundary/src/lib/element-boundary.service.ts

@@ -35,7 +35,10 @@ export class ElementBoundaryService {
   /**
    * Wait until appropriate "element boundary" exists for HTML Element
    */
-  whenBoundaryExist(element: HTMLElement): Observable<ElementBoundary> {
+  whenBoundaryExist(
+    element: HTMLElement,
+    timeoutMs: number,
+  ): Observable<ElementBoundary | null> {
     return this.boundaries$.pipe(
       map((boundaries) =>
         boundaries.find(
@@ -45,6 +48,8 @@ export class ElementBoundaryService {
         ),
       ),
       filter(isDefined),
+      (o$) => (timeoutMs > 0 ? o$.pipe(timeoutWith(timeoutMs, of(null))) : o$),
+      shareReplay({ bufferSize: 1, refCount: false }),
     );
   }