Skip to content

FE: Fix search-box-by-type input box in Gl-Form

Summary

The search-box-by-type input box used by gl-dropdown and gl-listbox extends outside the dropbox when encapsulated by a gl-form with the inline property enabled

Steps to reproduce

  1. Navigate to https://staging.gitlab.com/defend-team-test/cnp-alert-demo/-/security/policies/Require%20security%20approval%20for%20critical-only%20vulnerabilities%2F/edit?type=scan_result_policy and expand the Protected Branhces dropdown

What is the current bug behavior?

Input box DOES extend past the dropdown box

What is the expected correct behavior?

Input box DOES NOT extend past the dropdown box

Relevant logs and/or screenshots

Protected Branches User dropdown
image image

Possible fixes

See the discussion at !98370 (comment 1106724375); perhaps update https://gitlab.com/gitlab-org/gitlab-ui/-/blob/main/src/components/base/search_box_by_type/search_box_by_type.scss to include gl-w-max-full for .gl-search-box-by-type and .gl-search-box-by-type-input

Edited by Alexander Turinske