src/app/devtools/devtools.component.ts - 1.x/develop - 3axapp/ext-js-3-devtools

src/app/devtools/devtools.component.ts
69 строк2 KB
Zakharov A.
- исправлен ошибки eslint
19 авг 2025, 21:27
19 авг 2025, 21:2787c0110
import {Component, inject, OnDestroy, OnInit, signal} from '@angular/core';
import {DevtoolsTabsComponent} from './devtools-tabs/devtools-tabs.component';
import {interval} from 'rxjs';
import {Events} from '../protocols/messages';
import {PortBus} from '../protocols/port-bus';

enum ExtJSStatuses {
  /**
   * This page may have Angular but we don't know yet. We're still trying to detect it.
   */
  UNKNOWN,

  /**
   * We've given up on trying to detect Angular. We tried ${DETECT_ANGULAR_ATTEMPTS} times and
   * failed.
   */
  DOES_NOT_EXIST,

  /**
   * Angular was detected somewhere on the page.
   */
  EXISTS,
}

const DETECT_ATTEMPTS = 5;

@Component({
  selector: 'app-devtools',
  imports: [DevtoolsTabsComponent],
  templateUrl: './devtools.component.html',
  standalone: true,
  styleUrl: './devtools.component.scss',
})
export class DevtoolsComponent implements OnInit, OnDestroy {
  protected readonly ExtJSStatuses = ExtJSStatuses;
  protected readonly extJSStatus = signal(ExtJSStatuses.UNKNOWN);

  private readonly _messageBus = inject<PortBus<Events>>(PortBus);

  private _detectorInterval$ = interval(500).subscribe(attempt => {
    if (attempt === DETECT_ATTEMPTS) {
      this.extJSStatus.set(ExtJSStatuses.DOES_NOT_EXIST);
    }
    this._messageBus.emit('queryExtJSAvailability');
  });

  public ngOnInit(): void {
    this._messageBus.on('contentScriptConnected', (frameId: number) => {
      this.extJSStatus.set(ExtJSStatuses.UNKNOWN);
      this._messageBus.emit('enableFrameConnection', frameId, chrome.devtools.inspectedWindow.tabId);

      this._detectorInterval$.unsubscribe();
      this._detectorInterval$ = interval(500).subscribe(attempt => {
        if (attempt === DETECT_ATTEMPTS) {
          this.extJSStatus.set(ExtJSStatuses.DOES_NOT_EXIST);
        }
        this._messageBus.emit('queryExtJSAvailability');
      });
    });
    this._messageBus.on('extJSAvailability', ({exists}) => {
      this.extJSStatus.set(exists ? ExtJSStatuses.EXISTS : ExtJSStatuses.DOES_NOT_EXIST);
      this._detectorInterval$.unsubscribe();
    });
  }

  public ngOnDestroy(): void {
    this._detectorInterval$.unsubscribe();
  }
}