ionic-team / ionic-team/ionic-framework

bug: refresher gesture always takes priority over menu gesture

未关闭
#27,266 3 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
package: core type: bug
主要语言
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/.github/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

v6.x

### Current Behavior

Angular, when an ion-refresher is placed onto a page, the ionic sidemenu (splitpane/menu/router) will not react to dragging from the left in the Chrome emulator. I don't know if it does this on a device or not.

### Expected Behavior

The side-menu would continue working with an ion-refresher on the page.

### Steps to Reproduce

1. Create a new sidemenu project using the Ionic/Angular.
2. Add ion-refresher to folder.page.html.
3. Run the project with ionic serve.
4. Change to Mobile Emulation in the browser.
5. Attempt to drag from the left, to slide the menu out.
6. If that just worked, refresh, it doesn't work most of the time.
7. Try dragging at the top of the window, in the header instead of the content, and it works every time.
8. Try pulling to refresh, during the refresh, the menu works normally until the refresh window collapses.
9. After testing, remove the ion-refresher and it works every time.

Below is my refresher code:
```


handleRefresh(ev : any) {
};

```

When the refresh window is active, the sidemenu work again for a second, but as soon the refresh content collapses, it no longer works again.
The sidemenu still works if try to drag on the heading of the page (ion-header) instead of the content.
While testing with a new project, I found that sometimes it does work, then refresh and it no longer works.
I've tried adding padding, margins, and additional div's.

### Code Reproduction URL

https://github.com/dchase-sir/slidertest.git

### Ionic Info

Ionic:

Ionic CLI : 6.16.3 (C:\Users\jhsdjh\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : not installed
@angular-devkit/build-angular : 15.2.6
System:

NodeJS : v14.20.1 (C:\Program Files\nodejs\node.exe)
npm : 6.14.17
OS : Windows 10

### Additional Information

If I take the ion-refresher off the page it works every time. Every once in a while I'm tricked into thinking I figured it out, when it works ONCE then I refresh the browser and never again. I can still trigger the menu using an icon in the header, so I know the sidemenu still works, I think something is just blocking the target when the two are used together.

贡献指南

打开贡献指南

调研方向

Start with the linked reproduction project and reproduce the conflict in Chrome Mobile Emulation using ion-refresher and the sidemenu. Trace the gesture handling for the refresher and menu to determine why the refresher takes priority, then verify that left-edge menu dragging continues to work while the refresher is present and after the page is refreshed.

由索引模型根据 Issue 内容生成。

评估

技术栈
angular, typescript
领域
frontend, mobile
Issue 类型
缺陷
难度
4/5
预计耗时
3-5 天
活跃度
停滞
描述清晰度
基本清楚
新手友好度
35/100

把新 issue 发到你的邮箱

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