Fixes #35369: keep include-column & metrics dropdowns outside the scroll wrapper

[detail-app]

Detail bug report: View on Detail

Describe your changes:

Fixes #35369

I worked on the table profiler Settings drawer (ProfilerSettingsModal) because the include-column Select and per-column metrics TreeSelect popups were being clipped to a 160px-tall nested scroll box whenever the user had 2+ include-column rows, making the dropdown options unreachable without scrolling inside that tiny box.

Type of change:

• Bug fix

High-level design:

N/A — small change.

Tests:

Use cases covered

• With 2+ include-column rows, opening the include-column Select shows all column options — not clipped to the 160px include-column box.
• With 2+ include-column rows, opening the metrics TreeSelect shows all metrics under "All" — not clipped.
• Both popups stay inside the SlideoutMenu dialog (react-aria focus/accessibility boundary preserved — no regression to the document.body portal the original commit deliberately removed).
• The 5 other antd dropdowns in the modal (profile-sample, exclude-column, interval-type, column-name, interval-unit) are unchanged.

Unit tests

• I added unit tests for the new/changed logic.
• Files added/updated: openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.test.tsx
• Added 3 tests under ProfilerSettingsModal include-column dropdown popup container asserting DOM ancestry of the open popups (the proxy for visual clipping, since jsdom does no layout): the two row-picker popups must mount inside the dialog but outside [data-testid="include-column-container"]; a control test confirms the non-row profile-sample Select still mounts inside the dialog. All 22 tests in the file pass (19 pre-existing + 3 new — no regression).
• A data-testid="include-column-metrics" was added to the metrics TreeSelect to make it reachable in tests (the include-column Select already had one).

Backend integration tests

• Not applicable (no backend API changes).

Ingestion integration tests

• Not applicable (no ingestion changes).

Playwright (UI) tests

• Not applicable (no new Playwright E2E added — the modal already has round-trip coverage in playwright/e2e/Features/DataQuality/Profiler.spec.ts, and this change is purely popup-container wiring with no payload-shape impact).
• Existing Playwright coverage for this modal could not be re-run locally (see Manual testing).

Manual testing performed

• Ran the full jest suite for the modal (22/22 pass) and confirmed a RED/GREEN regression check: reverting the two pickers to the old container makes exactly the two row-picker tests fail (Received: <div class="h-max-40 overflow-y-auto" data-testid="include-column-container">), proving the tests catch the regression and it is scoped to the two row pickers.
• Ran UI checkstyle (yarn ui-checkstyle:changed <files>) — ESLint, Prettier, organize-imports, license-header, i18n, app-docs, tw-audit and tw-deprecation-guard all clean (0 errors).
• Ran tsc --noEmit — no type errors in the changed files.
• The Playwright spec Profiler.spec.ts and a live-UI manual check (verifying dropdown options render fully when 2+ include rows exist) could not be run: they require a live OpenMetadata server on :8585, which needs Docker for MySQL + Elasticsearch. The Docker daemon could not start in this environment (failed to start daemon: Error initializing network controller: error obtaining controller instance: timeout). I installed the Playwright Chromium browser and its OS shared libraries — the browser launches, but the suite aborts at setup with ECONNREFUSED ::1:8585 on /auth/login. Since the fix changes only popup-mounting wiring (no form/state serialization), the existing Playwright round-trip assertion on the PUT payload is unaffected.

UI screen recording:

Not applicable — standalone bug fix (a clipping regression in the profiler settings modal). The fix is DOM-portal wiring only and is covered by unit tests asserting popup ancestry; no feature surface or visual flow changed beyond restoring the pre-regression dropdown behaviour.

Checklist:

• I have read the CONTRIBUTING document.
• My PR title is Fixes <issue-number>: <short explanation>
• My PR is linked to a GitHub issue via Fixes #<issue-number> above.
• I have commented on my code, particularly in hard-to-understand areas.
• For JSON Schema changes: I updated the migration scripts or explained why it is not needed.
• For a UI feature or feature task: as part of PR creation, I ran the PR build in Docker with sample data and embedded a verified GitHub-hosted recording plus build/health evidence above (or explained why this requirement is not applicable).
• I have added tests (unit / integration / Playwright as applicable) and listed them above.
• Decision check: if this PR decides something the next contributor could undo — a schema field, REST path or format another component or repo must agree with, a new default or limit, an ordering that must hold, or a rule stated only in this description — it adds a record under docs/decisions/ (see its README.md). This description is gone from git log after the squash-merge.

• I have added a test that covers the exact scenario we are fixing. For complex issues, comment the issue number in the test for future reference.

---

Automatic Fixes PRs can be configured here.

[github-actions]

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

[shah-harshit]

Standards: 2 findings. Worst: popup container found through a data-testid selector with a silent document.body fallback. Also a test-only data-testid in production markup.
Spec (#35369): 2 findings. Worst: superseded by #35190 (core Select.ComboBox/TreeSelect portal their popovers, so no clipping), so coordinate merge order. Also unverified scroll-while-open alignment, and tests that check ancestry rather than clipping.

CI: authorize fails because the PR has no safe to test label (it's from detail-app); ui-coverage(-tests), ui-sonar-gate, java-checkstyle and maven-collate-ci fail as a result. That's not a code issue: a maintainer needs to add the label.

[github-actions]

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

[github-actions]

Jest test Coverage

UI tests summary

Lines	Statements	Branches	Functions
	77.42% (125009/161456)	63.9% (78292/122512)	65.15% (26101/40057)

[detail-app]

Re: #35370 (review) — All five findings were addressed in c9b1699: the data-testid/document.body fallback was replaced with includeSectionRef, the test-only data-testid="include-column-metrics" was removed, and the three include-column tests were fixed to click the add button by accessible name (they previously targeted a non-existent .include-columns-add-button class and never ran). #35190 (the superseding rewrite) is still open; merge-order will be handled if/when it lands. The remaining CI failure is playwright-visual-regression on the glossary static-page baseline, which is also failing on the main merge queue with the same 2% pixel diff (run 38437595614), so it is a pre-existing baseline drift unrelated to this PR.

[github-actions]

⚠️ UI Checkstyle passed — lint findings in changed files

🔍 ESLint findings in this PR's files — 0 error(s), 9 warning(s)

Errors block the build. Warnings do not yet — they are rules whose backlog is still
being worked down, listed so this PR does not add to it. See docs/ui-code-quality-gate.md.

0 error(s), 9 warning(s) across 1 changed file(s).

Count	Rule
9	react-hooks/exhaustive-deps

All findings

	Location	Rule	Message
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:148:6	react-hooks/exhaustive-deps	React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:165:6	react-hooks/exhaustive-deps	React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:413:5	react-hooks/exhaustive-deps	React Hook useCallback has missing dependencies: 'onVisibilityChange', 't', and 'tableId'. Either include them or remove the dependency array. If 'onVisibilityC
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:420:6	react-hooks/exhaustive-deps	React Hook useCallback has missing dependencies: 'onVisibilityChange' and 'updateInitialConfig'. Either include them or remove the dependency array. If 'onVisib
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:427:5	react-hooks/exhaustive-deps	React Hook useCallback has a missing dependency: 'handleStateChange'. Either include it or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:435:5	react-hooks/exhaustive-deps	React Hook useCallback has a missing dependency: 'handleStateChange'. Either include it or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:442:6	react-hooks/exhaustive-deps	React Hook useCallback has a missing dependency: 'handleStateChange'. Either include it or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:467:5	react-hooks/exhaustive-deps	React Hook useCallback has missing dependencies: 'form' and 'handleStateChange'. Either include them or remove the dependency array.
🟡	src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx:487:6	react-hooks/exhaustive-deps	React Hook useEffect has a missing dependency: 'fetchProfileConfig'. Either include it or remove the dependency array.

---

Fix locally (fast - only checks files changed in this branch):

make ui-checkstyle-changed

[sonarqubecloud]

Quality Gate passed for 'open-metadata-ui'

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud