The highlight color selection in the annotation tool does not reset as expected when reopening a PDF

[stephanrauh]

Discussed in https://github.com/stephanrauh/ngx-extended-pdf-viewer/discussions/2897

^{Originally posted by jobouillon May 15, 2025} Hi, i’m encountering an issue where the highlight color selection in the annotation tool does not reset as expected when reopening a PDF. Maybe i need to reset the viewer in some way.

Expected Behavior When reopening the viewer, the highlight tool should match the selected color shown in the toolbar, or it should reset to the actual default (e.g., yellow) with both UI and tool behavior aligned.

Steps to Reproduce Open a PDF in a modal using .

Select a custom highlight color (e.g., Sky Blue) and apply it.

Close the modal.

Reopen the same (or another) PDF.

The UI shows “Yellow” as the selected color, but the annotation tool still uses the previously selected color (e.g., Sky Blue).

This happens consistently in both Chrome and Edge.

Versions ngx-extended-pdf-viewer: 23.2.0 Angular: 19.2.1

<ng-template #customModalPdfViewer let-modal>
  <div class="modal-content h-100 border-0 rounded-0">
    <div class="modal-header border-0">
      <button type="button" class="btn-close" aria-label="Close" (click)="closeModal(modal)"></button>
    </div>
    <div class="modal-body p-0 h-100 overflow-hidden">
      <div *ngIf="selectedPdfUrl">
        <ngx-extended-pdf-viewer 
          [src]="selectedPdfUrl"
          height="calc(100vh - 56px)"
          [textLayer]="true"
          [showSidebarButton]="true"
          [showDownloadButton]="true"
          [language]="language"
        ></ngx-extended-pdf-viewer>
      </div>
    </div>
  </div>
</ng-template>

public selectedPdfUrl: string | null = null;

public openModal(url: string): void {
  const modalRef = this.modalService.open(this.customModalPdfViewer, {
    fullscreen: true,
    backdrop: 'static',
    keyboard: true,
  });

  setTimeout(() => {
    this.selectedPdfUrl = url;
  }, 1000);

  modalRef.closed.subscribe(() => this.resetViewer());
  modalRef.dismissed.subscribe(() => this.resetViewer());
}

public closeModal(modalRef: NgbModalRef): void {
  modalRef.dismiss();
}

private resetViewer(): void {
  this.selectedPdfUrl = null;
}

Notes I tried clearing selectedPdfUrl to fully destroy the viewer, but the internal color state still persists.

I could not find any pdfjs.annotationEditorParams in localStorage, but I see pdfjs.history under sessionStorage.

Is there a way to fully reset especially the highlight color when reopening the viewer?

Screenshot The UI shows Yellow, but Blue is actually used: