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.

Sign up for GitHub

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

Jump to bottom

fix: ensure the extension loads even if extensions.js is loaded after the component is mounted #20559

Merged
merged 1 commit into from
Oct 30, 2024
Merged

fix: ensure the extension loads even if extensions.js is loaded after the component is mounted #20559

merged 1 commit into from
Oct 30, 2024

Conversation

imwithye
Copy link
Contributor

@imwithye imwithye commented Oct 28, 2024 •
edited
Loading

In this PR, we address a minor issue with the extension, which also relates to #16842 and #19612. Previously, this issue occurred with system-level extensions, and we have now identified the same problem with resource-level extensions.

The Issue

ArgoCD loads extensions when mounting components, but if extensions.js is loaded after the component has already mounted, the extension fails to appear. The short video provided demonstrates this issue. Only by manually triggering a component re-render does the extension become visible again.

before.mp4

We use the console to simulate a slow load of extensions.js. Since the webpage is fully rendered, executing code in the console does not update the UI. As a result, the resource extension and status panel extension only appear after we manually trigger a component re-render.

Fix

We added an event listener to the application details component. Whenever a new extension is added, it triggers a re-render of the component, ensuring the extension appears as expected. Most importantly, the extension’s URL works correctly, regardless of whether extensions.js loads before or after the UI code.

after.mp4

Checklist:

  • [b] Either (a) I've created an enhancement proposal and discussed it with the community, (b) this is a bug fix, or (c) this does not need to be in the release notes.
  • The title of the PR states what changed and the related issues number (used for the release note).
  • The title of the PR conforms to the Toolchain Guide
  • I've included "Closes [ISSUE #]" or "Fixes [ISSUE #]" in the description to automatically close the associated issue.
  • I've updated both the CLI and UI to expose my feature, or I plan to submit a second PR with them.
  • Does this PR require documentation updates?
  • I've updated documentation as required by this PR.
  • I have signed off all my commits as required by DCO
  • I have written unit and/or e2e tests for my change. PRs without these are unlikely to be merged.
  • My build is green (troubleshooting builds).
  • My new feature complies with the feature status guidelines.
  • I have added a brief description of why this PR is necessary and/or what this PR solves.
  • Optional. My organization is added to USERS.md.
  • Optional. For bug fixes, I've indicated what older releases this fix should be cherry-picked into (this may or may not happen depending on risk/complexity).

@imwithye
rerender when extensions update
1e933e6 
Signed-off-by: Yiwei Gong <imwithye@gmail.com>
@imwithye imwithye requested a review from a team as a code owner October 28, 2024 06:54
@bunnyshell Bunnyshell
Copy link

bunnyshell bot commented Oct 28, 2024 •
edited
Loading

❌ Preview Environment deleted from Bunnyshell

Available commands (reply to this comment):

  • 🚀 /bns:deploy to deploy the environment

nitishfy
nitishfy approved these changes Oct 28, 2024
View reviewed changes
Copy link
Member

@nitishfy nitishfy left a comment

Choose a reason for hiding this comment

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

LGTM, thanks!

alexmt
alexmt approved these changes Oct 30, 2024
View reviewed changes
Copy link
Collaborator

@alexmt alexmt left a comment

Choose a reason for hiding this comment

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

Awesome! Thanks for detailed description and recording.

@alexmt alexmt merged commit 83eb0b1 into argoproj:master Oct 30, 2024
25 checks passed
@alexmt
Copy link
Collaborator

alexmt commented Oct 30, 2024

/cherry-pick release-2.12

@gcp-cherry-pick-bot GCP Cherry-Pick Bot
Copy link

Cherry-pick failed with Merge error 83eb0b18712de4ab214c1382ced8dec419fa6eb3 into temp-cherry-pick-547de0-release-2.12

@alexmt
Copy link
Collaborator

alexmt commented Oct 30, 2024

/cherry-pick release-2.13

gcp-cherry-pick-bot bot pushed a commit that referenced this pull request Oct 30, 2024
@imwithye
rerender when extensions update (#20559)
3169cdd 
Signed-off-by: Yiwei Gong <imwithye@gmail.com>
@gcp-cherry-pick-bot gcp-cherry-pick-bot bot mentioned this pull request Oct 30, 2024
Merged
alexmt pushed a commit that referenced this pull request Oct 30, 2024
@gcp-cherry-pick-bot @imwithye
rerender when extensions update (#20559) (#20601)
3f708b8 
Signed-off-by: Yiwei Gong <imwithye@gmail.com>
Co-authored-by: Yiwei Gong <imwithye@gmail.com>
@imwithye imwithye deleted the event-rerender-notify branch November 11, 2024 05:57
adriananeci pushed a commit to adriananeci/argo-cd that referenced this pull request Dec 4, 2024
@imwithye @adriananeci
rerender when extensions update (argoproj#20559)
fb28700 
Signed-off-by: Yiwei Gong <imwithye@gmail.com>
Signed-off-by: Adrian Aneci <aneci@adobe.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@alexmt alexmt alexmt approved these changes

@wanghong230 wanghong230 wanghong230 approved these changes

@nitishfy nitishfy nitishfy approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@imwithye @alexmt @wanghong230 @nitishfy