dify - ✅(Solved) Fix Tracing provider config form closes when clicking inside the form [1 pull requests, 1 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
langgenius/dify#35548Fetched 2026-04-24 10:43:31
View on GitHub
Comments
1
Participants
2
Timeline
5
Reactions
1
Timeline (top)
cross-referenced ×2closed ×1commented ×1labeled ×1

Fix Action

Fixed

PR fix notes

PR #35550: feat: refactor modals to use Dialog component and add tests for ApiKeyModal and ProviderConfigModal

Description (problem / solution / changelog)

[!IMPORTANT]

  1. Make sure you have read our contribution guidelines
  2. Ensure there is an associated issue and you have been assigned to it
  3. Use the correct syntax to link this PR: Fixes #<issue number>.

Summary

  • Replaced Modal with Dialog in ApiKeyModal and ProviderConfigModal for improved UI consistency.
  • Updated handling of modal open/close states.
  • Added comprehensive tests for ProviderConfigModal, covering various tracing provider configurations.
  • Enhanced ApiKeyModal tests to validate form schema handling and submission logic.

Checklist

  • This change requires a documentation update, included: Dify Document
  • I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
  • I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
  • I've updated the documentation accordingly.
  • I ran make lint && make type-check (backend) and cd web && pnpm exec vp staged (frontend) to appease the lint gods

Fixes #35456 Fixes #35548

Changed files

  • eslint-suppressions.json (modified, +0/-13)
  • web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/__tests__/provider-config-modal.spec.tsx (added, +346/-0)
  • web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/provider-config-modal.tsx (modified, +28/-13)
  • web/app/components/plugins/plugin-auth/authorize/__tests__/add-api-key-button.spec.tsx (modified, +21/-3)
  • web/app/components/plugins/plugin-auth/authorize/__tests__/api-key-modal.spec.tsx (modified, +252/-31)
  • web/app/components/plugins/plugin-auth/authorize/add-api-key-button.tsx (modified, +8/-2)
  • web/app/components/plugins/plugin-auth/authorize/api-key-modal.tsx (modified, +94/-40)
  • web/app/components/plugins/plugin-auth/authorized/index.tsx (modified, +20/-17)
RAW_BUFFERClick to expand / collapse

Self Checks

  • I have read the Contributing Guide and Language Policy.
  • This is only for bug report, if you would like to ask a question, please head to Discussions.
  • I have searched for existing issues search for existing issues, including closed ones.
  • I confirm that I am using English to submit this report, otherwise it will be closed.
  • 【中文用户 & Non English User】请使用英语提交,否则会被关闭 :)
  • Please do not modify this template :) and fill in all the required fields.

Dify version

1.13.3, local source build at commit b96f8345c5

Cloud or Self Hosted

Self Hosted (Source)

Steps to reproduce

  1. Start Dify from source and open the console in a browser.
  2. Open a Workflow or Chatflow app.
  3. Go to the app overview/monitoring page where the tracing configuration entry is available.
  4. Open the Tracing panel.
  5. Click Config for a tracing provider, for example Phoenix.
  6. In the provider config form, click any input field or any area inside the form.

https://github.com/user-attachments/assets/8570c149-699b-4970-91d5-f25fda309354

✔️ Expected Behavior

The provider config form should stay open when the user clicks inside it, and input fields should receive focus so the tracing provider can be configured.

❌ Actual Behavior

The provider config form closes immediately when clicking inside the form. This makes it impossible to fill in the tracing provider configuration from the UI.

extent analysis

TL;DR

The issue can be resolved by investigating and fixing the JavaScript event handling code that controls the tracing provider config form's behavior, specifically the click event inside the form.

Guidance

  • Review the JavaScript code that handles the click event inside the tracing provider config form to ensure it does not inadvertently close the form.
  • Verify that the form's focus behavior is correctly implemented to allow input fields to receive focus when clicked.
  • Check the CSS styles applied to the form and its elements to ensure they do not interfere with the form's behavior.
  • Inspect the browser's console for any error messages that may indicate the root cause of the issue.

Example

No code snippet can be provided without access to the specific JavaScript code handling the form's behavior.

Notes

The issue seems to be related to the JavaScript event handling code, but without access to the code, it's difficult to provide a more specific solution.

Recommendation

Apply a workaround by modifying the JavaScript event handling code to prevent the form from closing when clicked inside, until a permanent fix can be implemented.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING