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

feat(toast): add swipeGesture #28442

Merged
merged 7 commits into from
Nov 13, 2023
Merged

feat(toast): add swipeGesture #28442

merged 7 commits into from
Nov 13, 2023

Conversation

liamdebeasi
Copy link
Contributor

@liamdebeasi liamdebeasi commented Oct 31, 2023

Issue number: resolves #21769


What is the current behavior?

Toast does not support swipe gestures to dismiss.

What is the new behavior?

⚠️ There is a visual glitch on iOS where dragging and having the toast animate back to its opened position causes a flicker. This is an iOS 17 regression and is being tracked in #28467. This bug has been reported to and confirmed by Apple.

Does this introduce a breaking change?

  • Yes
  • No

Other information

⚠️ Give co-author credit to author in #23124

Issue number: N/A

---------

<!-- 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. -->

Toast does not support swipe gestures to dismiss.

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

- Adds a `swipeGesture` property to enable this behavior
- Creates an HTML playground so I can later write E2E tests
- Adds stubbed implementations for creating and destroying the swipe
gesture on prop change, present, and dismiss
- Adds unit tests to verify that the gesture is being created/destroyed
on prop change, present, and dismiss

In
cf7e897
I moved the toast config tests to separate file. For some reason this
was causing issues with my new tests. This might be a Stencil bug given
that I got the following error:

```js
, getValue = (e, t) => getHostRef(e).$instanceValues$.get(t), setValue = (e, t, a, o) => {
                                     ^

TypeError: Cannot read properties of undefined (reading '$instanceValues$')
    at getValue (/Users/liamdebeasi/Ionic/ionic/core/node_modules/@stencil/core/internal/testing/index.js:508:38)
    at Toast.get [as position] (/Users/liamdebeasi/Ionic/ionic/core/node_modules/@stencil/core/internal/testing/index.js:538:13)
    at Toast.dismiss (/Users/liamdebeasi/Ionic/ionic/core/src/components/toast/toast.tsx:208:30)
    at runNextTicks (node:internal/process/task_queues:60:5)
    at listOnTimeout (node:internal/timers:533:9)
    at processTimers (node:internal/timers:507:7)
```

## 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. -->

Note: This PR is missing some build artifacts. I will add those once
#28379 is merged and
synced into this branch.
@github-actions github-actions bot added package: core @ionic/core package package: angular @ionic/angular package package: vue @ionic/vue package labels Oct 31, 2023
@liamdebeasi liamdebeasi changed the title feat(toast): add stubbed swipeGesture (#28380) feat(toast): add swipeGesture (#28380) Nov 7, 2023
@liamdebeasi liamdebeasi changed the title feat(toast): add swipeGesture (#28380) feat(toast): add swipeGesture Nov 7, 2023
@liamdebeasi liamdebeasi marked this pull request as ready for review November 7, 2023 17:06
@thetaPC
Copy link
Contributor

thetaPC commented Nov 8, 2023

Dev build: 7.5.4-dev.11699469920.1af6ea12

Copy link
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

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

LGTM

@liamdebeasi liamdebeasi requested a review from a team November 9, 2023 16:29
Copy link
Contributor

@sean-perkins sean-perkins left a comment

Choose a reason for hiding this comment

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

Looks good! Only 2 super minor JSDOC formatting suggestions.

core/src/components/toast/animations/utils.ts Outdated Show resolved Hide resolved
core/src/components/toast/animations/utils.ts Outdated Show resolved Hide resolved
liamdebeasi and others added 2 commits November 9, 2023 11:42
Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
@liamdebeasi liamdebeasi merged commit 30c21aa into feature-7.6 Nov 13, 2023
43 checks passed
@liamdebeasi liamdebeasi deleted the FW-2004 branch November 13, 2023 17:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: angular @ionic/angular package package: core @ionic/core package package: vue @ionic/vue package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants