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: [M3-8052] - Toasts are not consistently dismissible with the 'X' button #11073

Conversation

pmakode-akamai
Copy link
Contributor

@pmakode-akamai pmakode-akamai commented Oct 9, 2024

Description 📝

The close ('X') button on toast notifications is not dismissing the toast in some cases. While most toasts dismiss after 5 seconds so this is not very noticeable, it could pose a problem for any toasts that we do persist (e.g. error toasts) because the toast will be stuck on the page (until refresh).

Changes 🔄

  • Removed notistackRef and invoking closeSnackbar method directly within the action prop.

Target release date 🗓️

N/A

How to test 🧪

Reproduction steps

  • Volume creation and the 'Volume scheduled for creation' toast is one example:
    • Go to Volumes Create page (https://cloud.linode.com/volumes/create)
    • Submit the form.
    • Observe the 'Volume scheduled for creation' toast and quickly attempt to dismiss the toast by clicking the 'X'.
    • Observe that nothing happens. (Note that the toast does disappear after 5 seconds because it is not persistent.)

Verification steps

  • Verify all types of Toasts:
    • Regardless of whether a toast is persistent or not, it should be immediately dismissible via the close button.

As an Author I have considered 🤔

Check all that apply

  • 👀 Doing a self review
  • ❔ Our contribution guidelines
  • 🤏 Splitting feature into small PRs
  • ➕ Adding a changeset
  • 🧪 Providing/Improving test coverage
  • 🔐 Removing all sensitive information from the code and PR description
  • 🚩 Using a feature flag to protect the release
  • 👣 Providing comprehensive reproduction steps
  • 📑 Providing or updating our documentation
  • 🕛 Scheduling a pair reviewing session
  • 📱 Providing mobile support
  • ♿ Providing accessibility support

@pmakode-akamai pmakode-akamai added the Bug Fixes for regressions or bugs label Oct 9, 2024
@pmakode-akamai pmakode-akamai requested a review from mjac0bs October 9, 2024 11:17
@pmakode-akamai pmakode-akamai self-assigned this Oct 9, 2024
@pmakode-akamai pmakode-akamai requested a review from a team as a code owner October 9, 2024 11:17
@pmakode-akamai pmakode-akamai requested review from hana-akamai and cpathipa and removed request for a team October 9, 2024 11:17
@pmakode-akamai pmakode-akamai changed the title fix: [M3-8052] - Fix Toasts are not consistently dismissible with the 'X' button fix: [M3-8052] - Toasts are not consistently dismissible with the 'X' button Oct 9, 2024
Copy link

github-actions bot commented Oct 9, 2024

Coverage Report:
Base Coverage: 86.96%
Current Coverage: 86.98%

Copy link
Contributor

@mjac0bs mjac0bs left a comment

Choose a reason for hiding this comment

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

Thanks @pmakode-akamai, this does seem to fix the issue based on what I tested, though past places we encountered this issue weren't always reproducible for me.

The repro steps in the PR description were still reproducible, though, and I verified the volume scheduled for creation issue has been fixed.

prod this branch
bug-volumes.mov
bugfix-volumes.mov

A persistent toast is also dismissible, but I wasn't seeing any issue in prod with dismissing after a failed Image Creation (disk_imagize) event following the repro steps here. That was odd because it was the most recent bug report of this issue affecting someone last Friday. It is also working as expected on this branch.

persistent-toast-can-be-dismissed.mov

@mjac0bs mjac0bs added the Add'tl Approval Needed Waiting on another approval! label Oct 9, 2024
@bnussman-akamai bnussman-akamai added Approved Multiple approvals and ready to merge! and removed Add'tl Approval Needed Waiting on another approval! labels Oct 9, 2024
@pmakode-akamai pmakode-akamai merged commit 9dfa675 into linode:develop Oct 10, 2024
20 checks passed
Copy link

cypress bot commented Oct 10, 2024

Cloud Manager E2E    Run #6654

Run Properties:  status check failed Failed #6654  •  git commit 9dfa675e84: fix: [M3-8052] - Toasts are not consistently dismissible with the 'X' button (#1...
Project Cloud Manager E2E
Run status status check failed Failed #6654
Run duration 28m 20s
Commit git commit 9dfa675e84: fix: [M3-8052] - Toasts are not consistently dismissible with the 'X' button (#1...
Committer Purvesh Makode
View all properties for this run ↗︎

Test results
Tests that failed  Failures 2
Tests that were flaky  Flaky 1
Tests that did not run due to a developer annotating a test with .skip  Pending 2
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 428

Tests for review

Failed  linodes/rebuild-linode.spec.ts • 1 failed test

View Output Video

Test Artifacts
rebuild linode > cannot rebuild a provisioning linode Screenshots Video
Failed  placementGroups/delete-placement-groups.spec.ts • 1 failed test

View Output Video

Test Artifacts
Placement Group deletion > can delete with Linodes assigned when unexpected error show up and retry Screenshots Video
Flakiness  cypress/e2e/core/linodes/linode-config.spec.ts • 1 flaky test

View Output Video

Test Artifacts
Linode Config management > End-to-End > Clones a config Screenshots Video

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Approved Multiple approvals and ready to merge! Bug Fixes for regressions or bugs
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants