From 1dcc8705115364a2c2ead2ececae8883dd6e9d07 Mon Sep 17 00:00:00 2001 From: Robert Snow Date: Wed, 31 Jul 2024 13:06:20 +1000 Subject: [PATCH] Update Picker placeholder to be shorter (#6796) --- .../@react-spectrum/picker/intl/en-US.json | 2 +- .../picker/test/Picker.test.js | 50 +++++++++---------- 2 files changed, 26 insertions(+), 26 deletions(-) diff --git a/packages/@react-spectrum/picker/intl/en-US.json b/packages/@react-spectrum/picker/intl/en-US.json index 2829e8a0db6..05ea63ada2e 100644 --- a/packages/@react-spectrum/picker/intl/en-US.json +++ b/packages/@react-spectrum/picker/intl/en-US.json @@ -1,4 +1,4 @@ { - "placeholder": "Select an option…", + "placeholder": "Select…", "loading": "Loading…" } diff --git a/packages/@react-spectrum/picker/test/Picker.test.js b/packages/@react-spectrum/picker/test/Picker.test.js index 99c1a8cc651..9595777562e 100644 --- a/packages/@react-spectrum/picker/test/Picker.test.js +++ b/packages/@react-spectrum/picker/test/Picker.test.js @@ -70,7 +70,7 @@ describe('Picker', function () { expect(picker).toHaveAttribute('data-testid', 'test'); let label = getAllByText('Test')[0]; - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(label).toBeVisible(); expect(value).toBeVisible(); }); @@ -362,7 +362,7 @@ describe('Picker', function () { expect(listbox).toBeVisible(); expect(onOpenChange).not.toBeCalled(); - let picker = getByLabelText('Select an option…'); + let picker = getByLabelText('Select…'); expect(picker).toHaveAttribute('aria-expanded', 'true'); expect(picker).toHaveAttribute('aria-controls', listbox.id); @@ -393,7 +393,7 @@ describe('Picker', function () { expect(listbox).toBeVisible(); expect(onOpenChange).not.toBeCalled(); - let picker = getByLabelText('Select an option…'); + let picker = getByLabelText('Select…'); expect(picker).toHaveAttribute('aria-expanded', 'true'); expect(picker).toHaveAttribute('aria-controls', listbox.id); @@ -721,7 +721,7 @@ describe('Picker', function () { expect(listbox).toBeVisible(); expect(onOpenChange).not.toBeCalled(); - let picker = getByLabelText('Select an option…'); + let picker = getByLabelText('Select…'); expect(picker).toHaveAttribute('aria-expanded', 'true'); expect(picker).toHaveAttribute('aria-controls', listbox.id); @@ -751,7 +751,7 @@ describe('Picker', function () { expect(getByRole('listbox')).toBeVisible(); expect(onOpenChange).not.toBeCalled(); - let picker = getByLabelText('Select an option…'); + let picker = getByLabelText('Select…'); expect(picker).toHaveAttribute('aria-expanded', 'true'); let listbox = getByRole('listbox'); @@ -804,7 +804,7 @@ describe('Picker', function () { expect(picker).toHaveAttribute('aria-haspopup', 'listbox'); let label = getAllByText('Test')[0]; - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(label).toHaveAttribute('id'); expect(value).toHaveAttribute('id'); expect(picker).toHaveAttribute('aria-labelledby', `${value.id} ${label.id}`); @@ -829,7 +829,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(picker).toHaveAttribute('id'); expect(value).toHaveAttribute('id'); expect(picker).toHaveAttribute('aria-label', 'Test'); @@ -855,7 +855,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(picker).toHaveAttribute('id'); expect(value).toHaveAttribute('id'); expect(picker).toHaveAttribute('aria-labelledby', `${value.id} foo`); @@ -880,7 +880,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(picker).toHaveAttribute('id'); expect(value).toHaveAttribute('id'); expect(picker).toHaveAttribute('aria-label', 'Test'); @@ -914,7 +914,7 @@ describe('Picker', function () { expect(span).not.toHaveAttribute('aria-hidden'); let label = span.parentElement; - let value = getByText('Select an option…'); + let value = getByText('Select…'); expect(label).toHaveAttribute('id'); expect(value).toHaveAttribute('id'); expect(picker).toHaveAttribute('aria-labelledby', `${value.id} ${label.id}`); @@ -978,7 +978,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1015,7 +1015,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1086,7 +1086,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1132,7 +1132,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); act(() => {picker.focus();}); fireEvent.keyDown(picker, {key: 'ArrowUp'}); @@ -1177,7 +1177,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1223,7 +1223,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); expect(onOpenChangeSpy).toHaveBeenCalledTimes(0); await user.click(picker); act(() => jest.runAllTimers()); @@ -1370,7 +1370,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1443,7 +1443,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.click(picker); act(() => jest.runAllTimers()); @@ -1545,7 +1545,7 @@ describe('Picker', function () { let picker = getByRole('button'); act(() => {picker.focus();}); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); fireEvent.keyDown(picker, {key: 'ArrowDown'}); act(() => jest.runAllTimers()); @@ -1641,7 +1641,7 @@ describe('Picker', function () { let picker = getByRole('button'); await user.tab(); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); await user.keyboard('{ArrowLeft}'); act(() => jest.runAllTimers()); expect(onSelectionChange).toHaveBeenCalledTimes(1); @@ -1687,7 +1687,7 @@ describe('Picker', function () { let picker = getByRole('button'); act(() => {picker.focus();}); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); fireEvent.keyDown(picker, {key: 't'}); fireEvent.keyUp(picker, {key: 't'}); @@ -1715,7 +1715,7 @@ describe('Picker', function () { let picker = getByRole('button'); act(() => {picker.focus();}); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); fireEvent.keyDown(picker, {key: 't'}); fireEvent.keyUp(picker, {key: 't'}); @@ -1744,7 +1744,7 @@ describe('Picker', function () { let picker = getByRole('button'); act(() => {picker.focus();}); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); fireEvent.keyDown(picker, {key: 't'}); fireEvent.keyUp(picker, {key: 't'}); @@ -1772,7 +1772,7 @@ describe('Picker', function () { ); let picker = getByRole('button'); - expect(picker).toHaveTextContent('Select an option…'); + expect(picker).toHaveTextContent('Select…'); let hiddenLabel = getByText('Test', {hidden: true, selector: 'label'}); expect(hiddenLabel.tagName).toBe('LABEL'); @@ -2500,7 +2500,7 @@ describe('Picker', function () { jest.runAllTimers(); }); - expect(button).toHaveTextContent('Select an option…'); + expect(button).toHaveTextContent('Select…'); expect(listbox).not.toBeInTheDocument(); expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement); expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');