ionic-team / ionic-team/ionic-framework

bug: IonPopover renders off screen

未关闭
#30,009 3 条评论 1 个 reaction 已指派 0 人 在 GitHub 查看
triage
主要语言
TypeScript
星标
52.7k
派生
13.3k
平均合并
1 天 15 小时
30 天内合并 PR
51

描述

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

I have an `` within a `/` that opens sometimes in the proper position and sometimes off canvas.

It does not seem related to where the click is from, and I have tried all the combinations of Reference, Side, Alignment and Offset. The only consistent behavior is that in all cases, in alternates between on-screen and off-screen every other open.

On screen:
image

Off screen:
image

This happens on `ionic serve` and iOS/Android builds.

Current code for readability:

image

Current code for SEO:
```




{title}

{meatballsMenu && }




{meatballsMenu &&
meatballsMenu.map((m, i) => (
m.action}>
{m.label}




))}





{children}

```

### Expected Behavior

The `` should open in a consitent location and not be off canvas.

### Steps to Reproduce

1. Use inline Popovers as shown above
2. Make the trigger an icon within a toolbar on the edge of the screen
3. Popover randomly opens in two alternative positions (1 on screen, 1 off screen)

Even if I try all the combinations of Reference, Side, Alignment and Offset - The popover will slightly change position, but will continue to alternate between two positions rather than rendering consistently.

### Code Reproduction URL

http://localhost:8100/

### Ionic Info

Ionic:

Ionic CLI : 7.0.1 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 8.3.3

Capacitor:

Capacitor CLI : 6.1.2
@capacitor/android : 6.1.2
@capacitor/core : 6.1.2
@capacitor/ios : 6.1.2

Utility:

cordova-res : 0.15.4
native-run : 2.0.1

System:

NodeJS : v18.19.0 (/Users/kevin/.nvm/versions/node/v18.19.0/bin/node)
npm : 10.2.3
OS : macOS Unknown

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。