gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: enhancements and fixes (#810)

Browse Source
This commit is contained in:
Daniel Lautzenheiser
2023-05-18 16:25:14 -04:00
committed by GitHub
parent f64f20231e
commit 6d1ce609aa
46 changed files with 352 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/core/src/widgets/markdown/plate/components/balloon-toolbar/BalloonToolbar.tsx
View File

@ -266,7 +266,7 @@ const BalloonToolbar: FC<BalloonToolbarProps> = ({
bg-white
p-1
text-base
shadow-lg
shadow-md
ring-1
ring-black
ring-opacity-5
@ -274,6 +274,7 @@ const BalloonToolbar: FC<BalloonToolbarProps> = ({
sm:text-sm
z-40
dark:bg-slate-700
dark:shadow-lg
"
>
<div

5
packages/core/src/widgets/markdown/plate/components/buttons/FontTypeSelect.tsx
View File

@ -151,7 +151,7 @@ const FontTypeSelect: FC<FontTypeSelectProps> = ({ disabled = false }) => {
dark:text-gray-500
`
: `
text-gray-900
text-gray-800
border-gray-600
dark:border-gray-200
dark:text-gray-100
@ -166,13 +166,14 @@ const FontTypeSelect: FC<FontTypeSelectProps> = ({ disabled = false }) => {
overflow-auto
rounded-md
bg-white
shadow-lg
shadow-md
ring-1
ring-black
ring-opacity-5
focus:outline-none
sm:text-sm
dark:bg-slate-800
dark:shadow-lg
`,
},
}}

3
packages/core/src/widgets/markdown/plate/components/common/MediaPopover.tsx
View File

@ -91,7 +91,7 @@ const MediaPopover = <T extends FileOrImageField | MarkdownField>({
bg-white
p-1
text-base
shadow-lg
shadow-md
ring-1
ring-black
ring-opacity-5
@ -99,6 +99,7 @@ const MediaPopover = <T extends FileOrImageField | MarkdownField>({
sm:text-sm
z-40
dark:bg-slate-700
dark:shadow-lg
"
>
<div

3
packages/core/src/widgets/markdown/plate/components/toolbar/Toolbar.tsx
View File

@ -81,9 +81,10 @@ const Toolbar: FC<ToolbarProps> = ({ collection, field, disabled }) => {
border-bottom-2
border-gray-400
gap-0.5
shadow-md
shadow-sm
bg-slate-50
dark:bg-slate-900
dark:shadow-md
sticky
top-0
z-10

50
packages/core/src/widgets/relation/__tests__/RelationControl.spec.ts
View File

@ -425,12 +425,12 @@ describe(RelationControl.name, () => {
const option5 = 'autocomplete-option-Post 5';
const option6 = 'autocomplete-option-Post 6';
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option3)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option4)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option5)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option6)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option3)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option4)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option5)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option6)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.type(input, 'ost body text for Post 3');
@ -441,7 +441,7 @@ describe(RelationControl.name, () => {
await waitFor(() => expect(queryByTestId(option1)).not.toBeInTheDocument());
expect(queryByTestId(option2)).not.toBeInTheDocument();
expect(getByTestId(option3)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option3)).toHaveClass('text-gray-800'); // Not selected
expect(queryByTestId(option4)).not.toBeInTheDocument();
expect(queryByTestId(option5)).not.toBeInTheDocument();
expect(queryByTestId(option6)).not.toBeInTheDocument();
@ -469,11 +469,11 @@ describe(RelationControl.name, () => {
expect(input).toHaveValue('P');
expect(getByTestId('autocomplete-option-Post 1')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 2')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 3')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 4')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 5')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 1')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 2')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 3')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 4')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 5')).toHaveClass('text-gray-800'); // Not selected
expect(queryByTestId('autocomplete-option-Post 6')).not.toBeInTheDocument();
});
@ -504,12 +504,12 @@ describe(RelationControl.name, () => {
await userEvent.type(input, 'P');
});
expect(getByTestId('autocomplete-option-Post 1')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 2')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 3')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 4')).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId('autocomplete-option-Post 1')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 2')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 3')).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId('autocomplete-option-Post 4')).toHaveClass('text-gray-800'); // Not selected
expect(queryByTestId('autocomplete-option-Post 5')).not.toBeInTheDocument();
expect(getByTestId('autocomplete-option-Post 6')).toHaveClass('bg-gray-100', 'text-gray-900'); // Selected
expect(getByTestId('autocomplete-option-Post 6')).toHaveClass('bg-gray-100', 'text-gray-800'); // Selected
});
it('should call onChange when option is selected', async () => {
@ -604,8 +604,8 @@ describe(RelationControl.name, () => {
const option1 = 'autocomplete-option-Post 1';
const option2 = 'autocomplete-option-Post 2';
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -619,8 +619,8 @@ describe(RelationControl.name, () => {
await userEvent.type(input, 'o');
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-gray-100', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-gray-100', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -633,8 +633,8 @@ describe(RelationControl.name, () => {
await userEvent.type(input, 's');
});
expect(getByTestId(option1)).toHaveClass('bg-gray-100', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-gray-100', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-gray-100', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-gray-100', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -647,8 +647,8 @@ describe(RelationControl.name, () => {
await userEvent.type(input, 't');
});
expect(getByTestId(option1)).toHaveClass('bg-gray-100', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-gray-100', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});

168
packages/core/src/widgets/select/__tests__/SelectControl.spec.ts
View File

@ -132,8 +132,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -146,8 +146,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -160,8 +160,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
it('should show error', async () => {
@ -236,8 +236,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -250,8 +250,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -264,8 +264,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
});
@ -324,8 +324,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -338,8 +338,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -352,8 +352,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
});
@ -425,8 +425,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -439,8 +439,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -453,8 +453,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
});
@ -526,8 +526,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -540,8 +540,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -554,8 +554,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
});
@ -627,8 +627,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -641,8 +641,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -655,8 +655,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not selected
});
});
@ -716,8 +716,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -730,8 +730,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -744,8 +744,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -758,8 +758,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
@ -819,8 +819,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -833,8 +833,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -847,8 +847,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -861,8 +861,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
@ -922,8 +922,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -936,8 +936,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -950,8 +950,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -964,8 +964,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
@ -1029,8 +1029,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1043,8 +1043,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -1057,8 +1057,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1071,8 +1071,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
@ -1136,8 +1136,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1150,8 +1150,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -1164,8 +1164,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1178,8 +1178,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
@ -1243,8 +1243,8 @@ describe(SelectControl.name, () => {
expect(queryByTestId(option2)).toBeInTheDocument();
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1257,8 +1257,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('text-gray-800'); // Not Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option1));
@ -1271,8 +1271,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
await act(async () => {
await userEvent.click(getByTestId(option2));
@ -1285,8 +1285,8 @@ describe(SelectControl.name, () => {
await userEvent.click(input);
});
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-900'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-900'); // Not Selected
expect(getByTestId(option1)).toHaveClass('bg-blue-400/75', 'text-gray-800'); // Selected
expect(getByTestId(option2)).toHaveClass('text-gray-800'); // Not Selected
});
});
});