Chrome 115升级后Angular12应用Popper.js弹窗错位问题

我们的Angular 12应用在Chrome版本从114升级至115后，多处页面的弹窗出现错位问题。该应用采用Popper.js与ngx-popper库实现弹窗功能，核心弹窗配置代码如下：

<div #internal="popper" [popper]="content" [popperTrigger]="'none'" [popperPlacement]="placement"
  [popperHideOnClickOutside]="popperHideOnClickOutside" [popperPositionFixed]="true" [popperTarget]="target"
  [popperHideOnScroll]="popperHideOnScroll" [popperModifiers]="{preventOverflow: {boundariesElement: 'viewport'}, computeStyle: {enabled: true, fn: update.bind(this) }, flip: { enabled: allowFlip, behavior: ['left', 'bottom', 'top',
 'right'], boundariesElement: 'viewport' } }" [popperAppendTo]="appendTo" (popperOnShown)="onShown($event)"
  (popperOnHidden)="onHide($event)" (hideOnClickOutside)="onClickOutside($event)">

  <popper-content #content class="casa-popover" [class.casa-popover-append-to]="appendTo"
    [class.ml20-when-x-placement-right]="worksAsRibbonInPatientCaseSelector">
    <ng-content select=".header" #header></ng-content>
    <ng-scrollbar [trackX]="false" [trackY]="true" [disabled]="true">
      <ng-content select="[body]"></ng-content>
    </ng-scrollbar>
    <ng-content select=".footer"></ng-content>
  </popper-content>

</div>

值得注意的是，在update方法中添加调试断点时，可获取正确坐标，弹窗也能正常显示。

不同浏览器版本弹窗显示效果 #

• Chrome v115（错位）
  
• Edge v115（错位）
  
• Chrome v114（正常）
  

内容的提问来源于stack exchange，提问作者Akshay