diff --git a/.changeset/cyan-fireants-do.md b/.changeset/cyan-fireants-do.md new file mode 100644 index 0000000000..41394c73ed --- /dev/null +++ b/.changeset/cyan-fireants-do.md @@ -0,0 +1,5 @@ +--- +"@ultraviolet/ui": minor +--- + +Change where the data-testid is placed on the `SelectInputV2` to target it more easily in unit tests diff --git a/packages/form/src/components/SelectInputFieldV2/__tests__/__snapshots__/index.test.tsx.snap b/packages/form/src/components/SelectInputFieldV2/__tests__/__snapshots__/index.test.tsx.snap index da2dc23d7b..5df5ff0bda 100644 --- a/packages/form/src/components/SelectInputFieldV2/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/form/src/components/SelectInputFieldV2/__tests__/__snapshots__/index.test.tsx.snap @@ -563,7 +563,7 @@ exports[`SelectInputField > should display right value on grouped options 1`] = data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rc:" role="combobox" tabindex="0" @@ -1127,7 +1127,7 @@ exports[`SelectInputField > should render correctly 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r0:" role="combobox" tabindex="0" @@ -1369,7 +1369,7 @@ exports[`SelectInputField > should render correctly disabled 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r3:" role="combobox" tabindex="0" @@ -1611,7 +1611,7 @@ exports[`SelectInputField > should render correctly grouped 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r9:" role="combobox" tabindex="0" @@ -1853,7 +1853,7 @@ exports[`SelectInputField > should render correctly multiselect 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r6:" role="combobox" tabindex="0" @@ -2162,7 +2162,7 @@ exports[`SelectInputField > should trigger events 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r18:" role="combobox" tabindex="0" diff --git a/packages/form/src/components/SelectInputFieldV2/__tests__/index.test.tsx b/packages/form/src/components/SelectInputFieldV2/__tests__/index.test.tsx index 5ab0e39e3b..1702df4345 100644 --- a/packages/form/src/components/SelectInputFieldV2/__tests__/index.test.tsx +++ b/packages/form/src/components/SelectInputFieldV2/__tests__/index.test.tsx @@ -38,7 +38,7 @@ describe('SelectInputField', () => { const { asFragment } = renderWithForm( , ) - const select = screen.getByTestId('select-bar') + const select = screen.getByTestId('select-input-test') act(() => select.click()) fireEvent.keyDown(select, { key: 'ArrowDown', keyCode: 40 }) const mercury = screen.getByTestId(`option-stack-mercury`) @@ -61,7 +61,7 @@ describe('SelectInputField', () => { onChange={onChange} />, ) - const select = screen.getByTestId('select-bar') + const select = screen.getByTestId('select-input-test') await userEvent.click(select) const option = screen.getByTestId('option-stack-mercury') diff --git a/packages/form/src/components/UnitInputField/__tests__/__snapshots__/index.test.tsx.snap b/packages/form/src/components/UnitInputField/__tests__/__snapshots__/index.test.tsx.snap index ea671ee6f3..0ffc73e3e8 100644 --- a/packages/form/src/components/UnitInputField/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/form/src/components/UnitInputField/__tests__/__snapshots__/index.test.tsx.snap @@ -572,7 +572,7 @@ exports[`UnitInputField > should handles onChange and selection 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -1109,7 +1109,7 @@ exports[`UnitInputField > should render correctly 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" diff --git a/packages/form/src/components/UnitInputField/__tests__/index.test.tsx b/packages/form/src/components/UnitInputField/__tests__/index.test.tsx index 0c5fa4754d..9ba7959f5d 100644 --- a/packages/form/src/components/UnitInputField/__tests__/index.test.tsx +++ b/packages/form/src/components/UnitInputField/__tests__/index.test.tsx @@ -60,7 +60,7 @@ describe('UnitInputField', () => { , ) - const selectBar = screen.getByTestId('select-bar') + const selectBar = screen.getByTestId('select-input-test-unit') const numberInput = screen.getByTestId('unit-input') const submit = screen.getByText('Submit') await userEvent.click(selectBar) diff --git a/packages/ui/src/components/SelectInputV2/SelectBar.tsx b/packages/ui/src/components/SelectInputV2/SelectBar.tsx index 258ec2cb59..c9af21628a 100644 --- a/packages/ui/src/components/SelectInputV2/SelectBar.tsx +++ b/packages/ui/src/components/SelectInputV2/SelectBar.tsx @@ -22,6 +22,7 @@ type SelectBarProps = { autoFocus?: boolean innerRef: RefObject id?: string + 'data-testid': string } type DisplayValuesProps = { @@ -195,6 +196,7 @@ export const SelectBar = ({ autoFocus, innerRef, id, + 'data-testid': dataTestId, }: SelectBarProps) => { const { isDropdownVisible, @@ -296,7 +298,7 @@ export const SelectBar = ({ onClick={ openable ? () => setIsDropdownVisible(!isDropdownVisible) : undefined } - data-testid="select-bar" + data-testid={dataTestId} autoFocus={autoFocus} onKeyDown={event => { if (event.key === 'ArrowDown') { diff --git a/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap b/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap index 344f0c1265..0f1d732e58 100644 --- a/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap @@ -249,7 +249,7 @@ exports[`SelectInputV2 > renders correctly 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r0:" role="combobox" tabindex="0" @@ -487,7 +487,7 @@ exports[`SelectInputV2 > renders correctly disabled 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":ra2:" role="combobox" tabindex="0" @@ -1206,7 +1206,7 @@ exports[`SelectInputV2 > renders correctly grouped 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r18:" role="combobox" tabindex="0" @@ -1799,7 +1799,7 @@ exports[`SelectInputV2 > renders correctly loadMore 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r9q:" role="combobox" tabindex="0" @@ -2257,7 +2257,7 @@ exports[`SelectInputV2 > renders correctly loading - grouped data 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r1rg:" role="combobox" tabindex="0" @@ -2801,7 +2801,7 @@ exports[`SelectInputV2 > renders correctly loading - ungrouped data 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r1rj:" role="combobox" tabindex="0" @@ -4061,7 +4061,7 @@ exports[`SelectInputV2 > renders correctly multiselect 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r44:" role="combobox" tabindex="0" @@ -5209,7 +5209,7 @@ exports[`SelectInputV2 > renders correctly not clearable 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rc:" role="combobox" tabindex="0" @@ -5447,7 +5447,7 @@ exports[`SelectInputV2 > renders correctly readOnly 1`] = ` data-readonly="true" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rau:" role="combobox" tabindex="0" @@ -5752,7 +5752,7 @@ exports[`SelectInputV2 > renders correctly required 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r8:" role="combobox" tabindex="0" @@ -6413,7 +6413,7 @@ exports[`SelectInputV2 > renders correctly required 2`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":ra5:" role="combobox" tabindex="0" @@ -6979,7 +6979,7 @@ exports[`SelectInputV2 > renders correctly small 1`] = ` data-readonly="false" data-size="small" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r4:" role="combobox" tabindex="0" @@ -7334,7 +7334,7 @@ exports[`SelectInputV2 > renders correctly unclosable tags when readonly 1`] = ` data-readonly="true" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rj4:" role="combobox" tabindex="0" @@ -8021,7 +8021,7 @@ exports[`SelectInputV2 > renders correctly ungrouped 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rf:" role="combobox" tabindex="0" @@ -9080,7 +9080,7 @@ exports[`SelectInputV2 > renders correctly with default value 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r26:" role="combobox" tabindex="0" @@ -9950,7 +9950,7 @@ exports[`SelectInputV2 > renders correctly with emptyState 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-emptystate" id=":r9t:" role="combobox" tabindex="0" @@ -10696,7 +10696,7 @@ exports[`SelectInputV2 > renders correctly with error 1`] = ` data-readonly="false" data-size="large" data-state="danger" - data-testid="select-bar" + data-testid="select-input-test" id=":rb1:" role="combobox" tabindex="0" @@ -11777,7 +11777,7 @@ exports[`SelectInputV2 > renders correctly with footer 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r35:" role="combobox" tabindex="0" @@ -12896,7 +12896,7 @@ exports[`SelectInputV2 > renders correctly with label on the bottom and optional data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r7o:" role="combobox" tabindex="0" @@ -13991,7 +13991,7 @@ exports[`SelectInputV2 > renders correctly with label on the bottom and optional data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r8p:" role="combobox" tabindex="0" @@ -15125,7 +15125,7 @@ exports[`SelectInputV2 > renders correctly with label on the right and optional data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r5m:" role="combobox" tabindex="0" @@ -16259,7 +16259,7 @@ exports[`SelectInputV2 > renders correctly with label on the right and optional data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":r6n:" role="combobox" tabindex="0" @@ -17160,7 +17160,7 @@ exports[`SelectInputV2 > renders correctly with not searchable 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test" id=":rcl:" role="combobox" tabindex="0" @@ -17760,6 +17760,8 @@ exports[`SelectInputV2 > renders correctly with success 1`] = ` background: #ffffff; border: 1px solid #d9dadd; border-radius: 4px; + box-shadow: 0px 0px 0px 3px #8c40ef40; + border: 1px solid #8c40ef; } .emotion-24>.emotion-31 { @@ -18092,7 +18094,7 @@ exports[`SelectInputV2 > renders correctly with success 1`] = ` data-readonly="false" data-size="large" data-state="success" - data-testid="select-bar" + data-testid="select-input-test" id=":rbr:" role="combobox" tabindex="0" diff --git a/packages/ui/src/components/SelectInputV2/__tests__/index.test.tsx b/packages/ui/src/components/SelectInputV2/__tests__/index.test.tsx index 439d69e865..dbd2059525 100644 --- a/packages/ui/src/components/SelectInputV2/__tests__/index.test.tsx +++ b/packages/ui/src/components/SelectInputV2/__tests__/index.test.tsx @@ -424,7 +424,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.tab() await userEvent.tab() expect(input).toHaveFocus() @@ -449,7 +449,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.tab() await userEvent.tab() expect(input).toHaveFocus() @@ -468,7 +468,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.tab() await userEvent.tab() expect(input).toHaveFocus() @@ -512,7 +512,7 @@ describe('SelectInputV2', () => { /> , ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') act(() => input.click()) const dropdown = screen.getByRole('dialog') @@ -536,7 +536,7 @@ describe('SelectInputV2', () => { onChange={onChange} />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') act(() => input.click()) const dropdown = screen.getByRole('dialog') @@ -558,7 +558,7 @@ describe('SelectInputV2', () => { searchable={false} />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const dropdown = screen.getByRole('dialog') const venus = screen.getByRole('option', { @@ -580,7 +580,7 @@ describe('SelectInputV2', () => { size="medium" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const dropdown = screen.getByRole('dialog') const venus = screen.getByRole('option', { @@ -602,7 +602,7 @@ describe('SelectInputV2', () => { onChange={(values: (string | undefined)[]) => values} />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByText('Earth') await userEvent.click(earth) @@ -620,7 +620,7 @@ describe('SelectInputV2', () => { multiselect />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -636,7 +636,7 @@ describe('SelectInputV2', () => { onChange={(values: (string | undefined)[]) => values} />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const dropdown = screen.getByRole('dialog') expect(dropdown).toBeVisible() @@ -691,7 +691,7 @@ describe('SelectInputV2', () => { searchable />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const dropdown = screen.getByRole('dialog') expect(dropdown).toBeVisible() @@ -740,7 +740,7 @@ describe('SelectInputV2', () => { searchable />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const dropdown = screen.getByRole('dialog') expect(dropdown).toBeVisible() @@ -801,7 +801,7 @@ describe('SelectInputV2', () => { await userEvent.click(closeTag) expect(tag).not.toBeVisible() - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const options = screen.getAllByRole('option') @@ -830,7 +830,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const selectAllCheckBox = screen.getByRole('checkbox', { name: 'Select all', @@ -887,7 +887,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const selectAllCheckBox = screen.getByRole('checkbox', { name: 'Select all', @@ -941,7 +941,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const selectAllGroupCheckBox = screen.getByRole('checkbox', { name: 'TERRESTRIAL PLANETS', @@ -985,7 +985,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const selectAllGroupCheckBox = screen.getByRole('checkbox', { name: 'TERRESTRIAL PLANETS', @@ -1023,7 +1023,7 @@ describe('SelectInputV2', () => { />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const selectAllGroupCheckBox = screen.getByRole('checkbox', { name: 'TERRESTRIAL PLANETS', @@ -1076,7 +1076,7 @@ describe('SelectInputV2', () => { descriptionDirection="row" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1092,7 +1092,7 @@ describe('SelectInputV2', () => { descriptionDirection="row" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1108,7 +1108,7 @@ describe('SelectInputV2', () => { descriptionDirection="column" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1124,7 +1124,7 @@ describe('SelectInputV2', () => { descriptionDirection="column" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1139,7 +1139,7 @@ describe('SelectInputV2', () => { descriptionDirection="row" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1154,7 +1154,7 @@ describe('SelectInputV2', () => { descriptionDirection="row" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1169,7 +1169,7 @@ describe('SelectInputV2', () => { descriptionDirection="column" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) @@ -1184,7 +1184,7 @@ describe('SelectInputV2', () => { descriptionDirection="column" />, ) - const input = screen.getByTestId('select-bar') + const input = screen.getByTestId('select-input-test') await userEvent.click(input) const earth = screen.getByTestId('option-earth') await userEvent.click(earth) diff --git a/packages/ui/src/components/SelectInputV2/index.tsx b/packages/ui/src/components/SelectInputV2/index.tsx index 7bb8ec3c35..8ded5976f9 100644 --- a/packages/ui/src/components/SelectInputV2/index.tsx +++ b/packages/ui/src/components/SelectInputV2/index.tsx @@ -175,6 +175,7 @@ export const SelectInputV2 = ({ acc + current.filter(option => !option.disabled).length, 0, ) + const finalDataTestId = dataTestId ?? `select-input-${name}` return ( ({ @@ -223,6 +223,7 @@ export const SelectInputV2 = ({ ) : null} renders click 1`] = ` data-readonly="false" data-size="medium" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -1636,7 +1636,7 @@ exports[`UnitInput > renders with default props 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -2495,7 +2495,7 @@ exports[`UnitInput > renders with default value 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -3344,7 +3344,7 @@ exports[`UnitInput > renders with disabled and placeHolder 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -4245,7 +4245,7 @@ exports[`UnitInput > renders with error and success 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -5148,7 +5148,7 @@ exports[`UnitInput > renders with error 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -6047,7 +6047,7 @@ exports[`UnitInput > renders with label and label information 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -6940,7 +6940,7 @@ exports[`UnitInput > renders with label and no label information 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -7423,7 +7423,7 @@ exports[`UnitInput > renders with min max 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input--unit" id="unit" role="combobox" tabindex="0" @@ -8272,7 +8272,7 @@ exports[`UnitInput > renders with no label and label information 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -9134,7 +9134,7 @@ exports[`UnitInput > renders with size large 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -9617,7 +9617,7 @@ exports[`UnitInput > renders with size medioum 1`] = ` data-readonly="false" data-size="medium" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -10100,7 +10100,7 @@ exports[`UnitInput > renders with size small 1`] = ` data-readonly="false" data-size="small" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" @@ -11000,7 +11000,7 @@ exports[`UnitInput > renders with success 1`] = ` data-readonly="false" data-size="large" data-state="neutral" - data-testid="select-bar" + data-testid="select-input-test-unit" id="unit" role="combobox" tabindex="0" diff --git a/packages/ui/src/components/UnitInput/__tests__/index.test.tsx b/packages/ui/src/components/UnitInput/__tests__/index.test.tsx index 4d881886db..1c1446a718 100644 --- a/packages/ui/src/components/UnitInput/__tests__/index.test.tsx +++ b/packages/ui/src/components/UnitInput/__tests__/index.test.tsx @@ -72,7 +72,7 @@ describe('UnitInput', () => { />, ) - const select = screen.getByTestId('select-bar') + const select = screen.getByTestId('select-input-test-unit') await userEvent.click(select) expect(asFragment()).toMatchSnapshot() }) @@ -190,7 +190,7 @@ describe('UnitInput', () => { , ) - await userEvent.click(screen.getByTestId('select-bar')) + await userEvent.click(screen.getByTestId('select-input-test-unit')) await userEvent.click(screen.getByTestId('option-mb')) })