Skip to content

feat: add test connection button to ui#51055

Merged
bbovenzi merged 13 commits intoapache:mainfrom
kevinhongzl:add-test-connection-button
May 30, 2025
Merged

feat: add test connection button to ui#51055
bbovenzi merged 13 commits intoapache:mainfrom
kevinhongzl:add-test-connection-button

Conversation

@kevinhongzl
Copy link
Contributor

@kevinhongzl kevinhongzl commented May 25, 2025

closes: #50607

Why

The "test connection" fuctionality is currently missing in Airflow 3 UI.

What

Add a "Test Connection" button to each connection entry.

test-connection-button.mp4

^ Add meaningful description above
Read the Pull Request Guidelines for more information.
In case of fundamental code changes, an Airflow Improvement Proposal (AIP) is needed.
In case of a new dependency, check compliance with the ASF 3rd Party License Policy.
In case of backwards incompatible changes please leave a note in a newsfragment file, named {pr_number}.significant.rst or {issue_number}.significant.rst, in airflow-core/newsfragments.

@boring-cyborg boring-cyborg bot added the area:UI Related to UI/UX. For Frontend Developers. label May 25, 2025
@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch from cbd480b to b806bc1 Compare May 25, 2025 16:40
pierrejeambrun
pierrejeambrun reviewed May 26, 2025
View reviewed changes
Copy link
Member

@pierrejeambrun pierrejeambrun left a comment

Choose a reason for hiding this comment

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

Nice, thanks for the pull request.

There is a configuration option core.test_connection to enable or not this feature. We should read that config and display or not the buttons depending on the value.

To retrieve this value in the front-end, you'll most probably need to add the value to the ui/config.py get_configs endpoint. This endpoint is called at the initialization of the web application and you can access the value through the useConfig hook.

@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch from 855293f to 1266a90 Compare May 27, 2025 02:10
@kevinhongzl
Copy link
Contributor Author

kevinhongzl commented May 27, 2025

@pierrejeambrun Thanks for the review! I've just updated this PR. We can now control the state of the button via airflow.cfg.

@pierrejeambrun pierrejeambrun added this to the Airflow 3.1.0 milestone May 27, 2025
pierrejeambrun
pierrejeambrun reviewed May 27, 2025
View reviewed changes
Copy link
Member

@pierrejeambrun pierrejeambrun left a comment

Choose a reason for hiding this comment

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

Nice, a few suggestiosn / nit.

Looking good overall.

@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch 2 times, most recently from b9ca4fd to ed3555b Compare May 28, 2025 05:13
@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch from ed3555b to 1b2fb19 Compare May 28, 2025 08:34
pierrejeambrun
pierrejeambrun previously approved these changes May 28, 2025
View reviewed changes
Copy link
Member

@pierrejeambrun pierrejeambrun left a comment •
edited
Loading

Choose a reason for hiding this comment

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

Thanks, we can improve in follow up PRs if needed. (The toast message on success, not sure we need to display the msg there)

pierrejeambrun
pierrejeambrun reviewed May 28, 2025
View reviewed changes
Copy link
Member

@pierrejeambrun pierrejeambrun left a comment •
edited
Loading

Choose a reason for hiding this comment

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

Actually I think something is wrong with the toaster, see bellow, connection failed, but we show 200, that's confusing.

Screenshot 2025-05-28 at 15 44 11

@pierrejeambrun pierrejeambrun dismissed their stale review May 28, 2025 13:44

Toaster need fixing.

@pierrejeambrun
Copy link
Member

pierrejeambrun commented May 28, 2025

Also, even on success that true false message doesn't bring much information.

Screenshot 2025-05-28 at 15 45 27

@kevinhongzl
Copy link
Contributor Author

kevinhongzl commented May 28, 2025 •
edited
Loading

Actually I think something is wrong with the toaster, see bellow, connection failed, but we show 200, that's confusing.
Also, even on success that true false message doesn't bring much information.

Yeah. It confused me as well, but that's how our api currently works.

The test connection API returns 200 with a boolean status, true for successfully creating a connection and false for connection error. However, there are also 401, 403, and 422 responses.... I can't figure out how this was designed from the docs, so I simply present information retrieved from the api with toasters.

https://airflow.apache.org/docs/apache-airflow/stable/stable-rest-api-ref.html#operation/test_connection

I need some hints or suggestions on how to deal with this.

@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch from eb53842 to eb707fb Compare May 29, 2025 14:45
@kevinhongzl
Copy link
Contributor Author

kevinhongzl commented May 29, 2025

Yeah. It confused me as well, but that's how our api currently works.

The test connection API returns 200 with a boolean status, true for successfully creating a connection and false for connection error. However, there are also 401, 403, and 422 responses.... I can't figure out how this was designed from the docs, so I simply present information retrieved from the api with toasters.

https://airflow.apache.org/docs/apache-airflow/stable/stable-rest-api-ref.html#operation/test_connection

I need some hints or suggestions on how to deal with this.

@pierrejeambrun Eventually I removed the toasts which can be misleading for now. I'd like to help if we have further discussions and follow-up issues!

@kevinhongzl kevinhongzl force-pushed the add-test-connection-button branch from eb707fb to 6604800 Compare May 29, 2025 15:06
@kevinhongzl kevinhongzl reopened this May 29, 2025
bbovenzi
bbovenzi requested changes May 29, 2025
View reviewed changes
Copy link
Contributor

@bbovenzi bbovenzi left a comment

Choose a reason for hiding this comment

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

One last thing. Let's not add any new plaintext. Instead, add each one to the i18n/en/ directory at least.

@kevinhongzl kevinhongzl requested a review from bbovenzi May 29, 2025 20:56
@bbovenzi bbovenzi merged commit 23a9a99 into apache:main May 30, 2025
43 checks passed
@tirkarthi tirkarthi mentioned this pull request Jun 6, 2025
Closed
15 tasks
sanederchik pushed a commit to sanederchik/airflow that referenced this pull request Jun 7, 2025
@kevinhongzl @sanederchik
feat: add test connection button to ui (apache#51055)
17fa89d 
* feat: add test connection button to ui

* fix: determine test connection access based on configuration settings

* fix: simplify button design

* refactor: small changes on test connection button

* fix: remove toasts

* fix: add loading prop to the button

* feat: support i18n in test connection button
jose-lehmkuhl pushed a commit to jose-lehmkuhl/airflow that referenced this pull request Jul 11, 2025
@kevinhongzl @jose-lehmkuhl
feat: add test connection button to ui (apache#51055)
da669a0 
* feat: add test connection button to ui

* fix: determine test connection access based on configuration settings

* fix: simplify button design

* refactor: small changes on test connection button

* fix: remove toasts

* fix: add loading prop to the button

* feat: support i18n in test connection button
@TJaniF TJaniF mentioned this pull request Sep 15, 2025
Closed
2 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@pierrejeambrun pierrejeambrun pierrejeambrun left review comments

@bbovenzi bbovenzi bbovenzi approved these changes

@ryanahamilton ryanahamilton Awaiting requested review from ryanahamilton ryanahamilton is a code owner

@jscheffl jscheffl Awaiting requested review from jscheffl

@shubhamraj-git shubhamraj-git Awaiting requested review from shubhamraj-git shubhamraj-git is a code owner

Assignees

No one assigned

Labels

area:UI Related to UI/UX. For Frontend Developers.

Projects

None yet

Milestone

Airflow 3.1.0

Development

Successfully merging this pull request may close these issues.

Add Test Connection Button to UI

3 participants

@kevinhongzl @pierrejeambrun @bbovenzi