[ZEPPELIN-6358] Fix notebook UI bugs and add aria attributes and test IDs for selectors #5101

[dididy]

What is this PR for?

This PR fixes several notebook-related UI issues and improves testability and accessibility.

Changes

• Fix an issue where the search menu trigger did not work correctly.
• Prevent folder renaming when the input is empty by disabling the confirm button.
• Add accessibility (ARIA) attributes and test-specific attributes to improve usability and E2E test stability.

What type of PR is it?

Bug Fix
Refactoring

Todos

What is the Jira issue?

ZEPPELIN-6358

How should this be tested?

Screenshots (if appropriate)

Questions:

• Does the license files need to update? No
• Is there breaking changes for older versions? No
• Does this needs documentation? No

[dididy]

I realized the PR description might not be detailed enough for review, so here's a breakdown of each commit

---

e0c6f3f

The "Find in Code" shortcut in a paragraph called searchCode(), but that method only ran the search, it didn't open the dropdown. nz-dropdown with nzTrigger="click" only opens on actual button clicks, so calling it from code did nothing visible. The fix adds [(nzVisible)] two-way binding so openSearchMenu() can set isSearchMenuVisible = true and open the menu programmatically. Renamed the event from searchCode to openSearchMenu to match what it actually does.

The heading role and data-testid additions are for accessibility and E2E test targeting.

---

bd32a53

The Rename button had no disabled state, so users could clear the input and still submit. That sends an empty path to the backend via WebSocket (folderRename), which could create a malformed folder. [disabled]="!newFolderPath || !newFolderPath.trim()" blocks the request at the UI level before it reaches the backend.

---

d89ed34

Three things here:

• Sidebar buttons: TOC, File Tree, and Close are icon-only, so screen readers can't tell what they do. Added aria-label to each.

• Published paragraph structure: The dynamic forms and results were siblings with separate *ngIf="paragraph" checks. When paragraph changes, they get added/removed independently, which can cause a brief inconsistent state (forms visible but results not, or the other way around). Wrapping both in a single <div *ngIf="paragraph"> makes sure they render and unmount together. Also added data-testid for E2E tests.

• Node list folders: Added [attr.data-testid]="'folder-' + node.title" to folder links so E2E tests can find specific folders by name instead of relying on CSS selectors or text matching, which break when the DOM structure changes.

[tbonelee]

@dididy Could you please rebase this?

[tbonelee]

Thanks. I've merged this into master and branch-0.12