Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(item-sliding): buttons are not interactive on close #27829

Merged
merged 1 commit into from
Jul 20, 2023
Merged

Conversation

liamdebeasi
Copy link
Contributor

Issue number: resolves #22722


What is the current behavior?

Item Sliding Options are not disabled until after a 600ms timeout. This timeout exists to allow the close transition to complete. Without the timeout, the item sliding options disappear without a transition. I explored waiting for the transitionend event instead of the setTimeout, but the bug persisted.

What is the new behavior?

  • If an item sliding is closing then we add a class to the host. This class disables pointer events on all ion-item-options children so the buttons cannot be accidentally tapped while closing. This class is then removed after the 600ms timeout.

Does this introduce a breaking change?

  • Yes
  • No

Other information

@stackblitz
Copy link

stackblitz bot commented Jul 19, 2023

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions github-actions bot added the package: core @ionic/core package label Jul 19, 2023
@liamdebeasi liamdebeasi requested review from a team and brandyscarney and removed request for a team July 19, 2023 21:25
@liamdebeasi liamdebeasi marked this pull request as ready for review July 19, 2023 21:25
Copy link
Member

@brandyscarney brandyscarney left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested this out by slowing the animation to 10% so I could click the item options and it seems to work great!

@liamdebeasi liamdebeasi added this pull request to the merge queue Jul 20, 2023
Merged via the queue into main with commit 6e4919c Jul 20, 2023
45 checks passed
@liamdebeasi liamdebeasi deleted the FW-4128 branch July 20, 2023 18:43
brandyscarney pushed a commit that referenced this pull request Jul 26, 2023
Issue number: resolves #22722

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

Item Sliding Options are not disabled until after a 600ms timeout. This
timeout exists to allow the close transition to complete. Without the
timeout, the item sliding options disappear without a transition. I
explored waiting for the `transitionend` event instead of the
`setTimeout`, but the bug persisted.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- If an item sliding is closing then we add a class to the host. This
class disables pointer events on all `ion-item-options` children so the
buttons cannot be accidentally tapped while closing. This class is then
removed after the 600ms timeout.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug: Ion-item-sliding option can be clicked for a moment after item is closed
2 participants