Skip to content

[web-console] Improve empty-state and Enter submit for tags#6621

Merged
Karakatiza666 merged 2 commits into
feldera:mainfrom
mrswastik-robot:web-console-enter-creates-tag
Jul 13, 2026
Merged

[web-console] Improve empty-state and Enter submit for tags#6621
Karakatiza666 merged 2 commits into
feldera:mainfrom
mrswastik-robot:web-console-enter-creates-tag

Conversation

@mrswastik-robot

Copy link
Copy Markdown
Contributor

Submit the create tag form on Enter, skip the empty search list when no tags exist, and open create directly in that case.

Fixes #6595
Fixes #6596

Describe Manual Test Plan

  1. Ran web-console on :5173 against pipeline-manager with --dev-mode on :8080.
  2. Create tag: open Tags → Create → type a name → press Enter → tag is created/assigned.
  3. Empty pool: with no known tags, click + Tag → create form opens; search is not shown.
  4. After at least one tag exists, picker shows search again.

Checklist

  • Unit tests added/updated
  • Integration tests added/updated
  • Documentation updated
  • Changelog updated

Breaking Changes?

None.

Describe Incompatible Changes

None.

Submit the create tag form on Enter, skip the empty search list
when no tags exist, and open create directly in that case.

Fixes feldera#6596
Fixes feldera#6595

Signed-off-by: mrswastik-robot <swastikpatel29@gmail.com>

@mythical-fred mythical-fred left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Nice tight fix for both bugs — the <form onsubmit> pattern is the right way to handle Enter, and opening create directly when knownTags.size === 0 is exactly the UX the issue asked for.

Blocker: missing tests.

This changes behavior in two user-visible ways and web-console has a hard rule (from Gerd) that behavioral changes need tests. Concrete suggestions using Vitest + @testing-library/svelte:

  1. Enter submits the create form — render the create panel, type a tag name, userEvent.keyboard('{Enter}'), assert onSubmit was called (or the tag appears in the mock store).
  2. Enter is a no-op when submitDisabled is true — same setup with the button in its disabled state (e.g. empty/duplicate name), assert onSubmit was not called.
  3. Empty pool skips the search list and opens create directly — render Tags with knownTags = new Set(), click the trigger, assert the create form is visible and the search <input type="search"> is not in the document.
  4. Non-empty pool still shows search — render with a couple of tags, click trigger, assert the search input is present.

The reviewer bandwidth is not the issue here — it's that the web-console has zero test coverage and every PR that changes behavior without adding tests locks that in. Please add a Vitest spec next to Tags.svelte.

Minor nit (non-blocking): in the open closure, when knownTags.size === 0 you call openCreate('') and then toggle(). That's fine as long as openCreate doesn't itself toggle — worth a quick check that opening the popup once (not twice) is what happens.

@mihaibudiu
mihaibudiu requested a review from Karakatiza666 July 12, 2026 18:56
@mrswastik-robot

Copy link
Copy Markdown
Contributor Author

hey @Karakatiza666, should I include tests too?

@Karakatiza666

Copy link
Copy Markdown
Contributor

Yes, please. Add unit test (see *.svelte.spec.ts) to check that submitting through Ener works, selecting a color through Tab + Spacebar works (it does now), and that when clicking on "+ tag" when no tags exist yet the "Create tag" form pops up right away

@Karakatiza666 Karakatiza666 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

The fix for both issues is minimal, idiomatic, and works as expected. Thank you for the contribution!

Add tests as I mentioned above and you can merge.

@mihaibudiu

Copy link
Copy Markdown
Contributor

Well, we can merge

@mrswastik-robot

Copy link
Copy Markdown
Contributor Author

Well, we can merge

should I go for the tests? or is it alright?

@mihaibudiu

Copy link
Copy Markdown
Contributor

He said he would like tests.
I said you cannot merge, we need to do it.

@mrswastik-robot

Copy link
Copy Markdown
Contributor Author

He said he would like tests. I said you cannot merge, we need to do it.

ahh! ok got it 😂, my bad! (should have put an asterisk there btw 🤐)

@mrswastik-robot

mrswastik-robot commented Jul 13, 2026

Copy link
Copy Markdown
Contributor Author

hey @mihaibudiu and @Karakatiza666. While writing the Tab + Space test, I found that when we select the tag color, either through the mouse click or Tab + Space, and then pressing Enter doesn't create the tag, we have to manually click the Create button. Reason being, when focus is on a color circle, that control is a normal button (type="button"). It does not submit the form. So is it already the expected behaviour?

@Karakatiza666

Karakatiza666 commented Jul 13, 2026

Copy link
Copy Markdown
Contributor

Right. Yes, I'd consider that expected behavior. So in the test, after selecting the color, press Shift + Tab the same amount of times to navigate the focus back to the input field

Signed-off-by: mrswastik-robot <swastikpatel29@gmail.com>
@mrswastik-robot

Copy link
Copy Markdown
Contributor Author

Right. Yes, I'd consider that expected behavior. So in the test, after selecting the color, press Shift + Tab the same amount of times to navigate the focus back to the input field

Added the test, lmk if any change is required :)

@Karakatiza666
Karakatiza666 enabled auto-merge July 13, 2026 17:59
@Karakatiza666

Copy link
Copy Markdown
Contributor

Looking good!

@Karakatiza666
Karakatiza666 added this pull request to the merge queue Jul 13, 2026
Merged via the queue into feldera:main with commit 81b844d Jul 13, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

tags enter doesnt create new tag no tag -> don't show search bar

4 participants