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: [M3-8722] - Improve weblish retry behavior #11067

Merged
merged 14 commits into from
Oct 23, 2024

Conversation

plisiecki1
Copy link
Contributor

Description 📝

  • automatically reconnect weblish sessions that have disconnected
  • … unless it fails rapidly (more than 3 times in a 1 minute window)
  • … in which case show an error screen with as much information as we can provide
  • … where the error screen includes a button to try again.
  • focus the terminal element when starting (which is generally helpful but also prevents losing focus after a reconnect)

Previously, a failure would often just result in a spinning circle forever.

Changes 🔄

List any change relevant to the reviewer.

  • added option “action button” feature to ErrorState
  • added some helpers to Lish.tsx which may also be useful for similar enhancements to graphical lish (glish) in the future.
  • changed socket to be mutable and nullable so it can be updated when reconnecting. origSocket local variable is used to ensure that “stale” events are properly ignored.
  • moved error parsing/handling to the close handler, which also eliminates the potential for console output that too closely matches an "expired" error being interpreted as an error and breaking the session immediately.

Target release date 🗓️

TBD.

Preview 📷

Before After
M3-8722-before M3-8722-error

How to test 🧪

Prerequisites

Running linode(s).

Reproduction steps

Launch a lish session for a machine, type ^a d kill <enter>. The session will exit and show a spinning circle.

Verification steps

  • Launch a lish session for a machine, type ^a d kill <enter>. The session will reconnect.
  • Repeat, it should reconnect again.
  • Repeat, it should reconnect again.
  • Repeat, it should show an error message (if all three attempts are withing 60s).
  • Click the "Retry Connection" button. It should reconnect.
  • Ensure that the reconnected session actually works, i.e., that interaction with the terminal is successful.

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

* automatically reconnect weblish sessions that have disconnected
* … unless it fails rapidly (more than 3 times in a 1 minute window)
* … in which case show an error screen with as much information as we can provide
* … where the error screen includes a button to try again.
* focus the terminal element when starting (which is generally helpful but also prevents _losing_ focus after a reconnect)

Previously, a failure would often just result in a spinning circle forever.
@plisiecki1 plisiecki1 requested a review from a team as a code owner October 8, 2024 17:33
@plisiecki1 plisiecki1 requested review from hana-akamai and cpathipa and removed request for a team October 8, 2024 17:33
Copy link

github-actions bot commented Oct 8, 2024

Coverage Report:
Base Coverage: 87.01%
Current Coverage: 86.99%

packages/manager/src/components/ErrorState/ErrorState.tsx Outdated Show resolved Hide resolved
packages/manager/src/features/Lish/Lish.tsx Outdated Show resolved Hide resolved
packages/manager/src/features/Lish/Weblish.tsx Outdated Show resolved Hide resolved
packages/manager/src/features/Lish/Weblish.tsx Outdated Show resolved Hide resolved
…Error`.

Break the `formatError` logic into two separate function that compute the two parts of the output, and then the main function just appends them. Adopt the preferred `const x = () =>` syntax in lieu of `function x()` syntax.
* Remove comments for obvious fields
* `actionButton` => `actionButtonProps`
* Combine `try` cases when parsing errors
@plisiecki1 plisiecki1 requested a review from hana-akamai October 9, 2024 23:06
* Add spaces around `=>` types.
* Remove unnecessary `Optional Action Button` comment.
* Refactor error handling using new `ParsePotentialLishErrorString` and `LishErrorInterface`. This centralizes all of the code to check structure and type of errors in one place. This may also prove using for future improvements to graphical lish.
* Flatten websocket `close` handler logic from if-if-else-else structure to if-return-if-return-return.
plisiecki1 and others added 3 commits October 17, 2024 19:11
* Remove second error format: It turns out that it will not be too difficult to make all of the errors follow the same basic format, so we don't need two separate parsers. Yay!
@hana-akamai hana-akamai added the Add'tl Approval Needed Waiting on another approval! label Oct 22, 2024
Copy link
Contributor

@cpathipa cpathipa left a comment

Choose a reason for hiding this comment

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

Confirming on the verification steps, was able to see error message after couple attempts of ^a+d and able to reconnect by clicking "Retry Connection" button.
image

@cpathipa cpathipa added Approved Multiple approvals and ready to merge! and removed Add'tl Approval Needed Waiting on another approval! labels Oct 23, 2024
Copy link
Contributor

@coliu-akamai coliu-akamai left a comment

Choose a reason for hiding this comment

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

✅ confirmed reconnection x3
✅ confirmed error message after with Retry button

  • repeated this a bunch of times and confirmed it was consistent 🎉

We'll also want to include a changeset for this


let parsed = null;
try {
parsed = JSON.parse(s);
Copy link
Contributor

Choose a reason for hiding this comment

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

any chance we know what the type/shape of parsed is, instead of using any?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Until we do the checks following the quoted code, we don't know whether the incoming string actually conforms to the expected shape yet. The whole purpose of this function is to check the shape, and then if it is indeed in the expected shape, return the information that is useful to the code handling retries and errors. If we added an explicit type, it would just be used to cast away the "any" type once the shape is confirmed, then the code would immediately extract a few fields, and then discard that type. I don't think the additional overhead would add to the clarity or safety of the code.

@hana-akamai hana-akamai merged commit 941f30f into linode:develop Oct 23, 2024
23 checks passed
Copy link

cypress bot commented Oct 23, 2024

Cloud Manager E2E    Run #6723

Run Properties:  status check passed Passed #6723  •  git commit 941f30fe85: feat: [M3-8722] - Improve weblish retry behavior (#11067)
Project Cloud Manager E2E
Branch Review develop
Run status status check passed Passed #6723
Run duration 25m 04s
Commit git commit 941f30fe85: feat: [M3-8722] - Improve weblish retry behavior (#11067)
Committer plisiecki1
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
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 438
View all changes introduced in this branch ↗︎

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!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants