Chrome 瀏覽器在 2023 年 5 月 30 日左右推出 v114 版本後，其中正式啟用 html 標準裡的 popover API ，也就是能在 html 標籤裡使用 popover 功能的相關屬性，呈現原生的 popover 效果。然而，前端 UI 套件和框架早已提供相同功能，但可能當時設計不佳，導致在 Chrome v114 後會無法呈現套件的 popover UI 元件，例如 ionic/react, ngx-bootstrap, auro-popover, ionic/vue, ionic/angular , …..等等。 其他相關套件清單能夠在社群 HTML 標準討論串 on github 討論串 #9042 找到。
Chrome 在 6 月 1 日已經有人開 CR-bug ，反映 version 114 有這樣的問題，在 6 月 7 日得到肯定的回覆。
在 ionic v5+ 系列，可以用以下 workaround 方式暫時解決:
請在產品的全域範圍樣式檔案，例如: src/global.scss 檔案 (以 ionic framework 基礎開發)，或是 src/App.scss (以 create-react-app)，添加以下內容:
ion-popover [popover]:not(:popover-open):not(dialog[open]) {
display: contents;
}
Notice: 單用上述也能一起解決 Android Chrome 上的顯示問題。解決方法來自 stackoverflow 討論串
[popover].popover-viewport {
display: initial;
position: initial;
margin: initial;
border: initial;
background: initial;
padding: initial;
width: initial;
height: initial;
overflow: initial;
inset: initial;
color: initial;
}
Notice: 單用上述不能一起解決 IonSelect 在 Android Chrome 上呈現的 popover 問題。 解決方法來自 ionic GitHub 討論串 #27599 workaround
ionic v6 系列，已在 2023 年 2 月推出的 v6.5.2 解決這問題，點此觀看 stackoverflow , 點此觀看 github 。
反映過程是在 ionic GitHub issue 討論串 #26643，解決是問題在 ionic GitHub issue 討論串 #26672。
ionic/angular v7 系列，有網友在 6 月 7 日於 ionic GitHub 討論串 #27599 for ionic/angular v7.0.10 反映在 v7.0.10 已解決，ionic/angular v7系列只要升級套件版本就好。
ngx-bootstrap 套件的討論串，請到ngx-bootstrap issue 討論串 #6544Ref. link: