@coveord/plasma-mantine 49.2.2 → 49.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/.eslintrc.js +9 -4
  2. package/.turbo/turbo-build.log +3 -3
  3. package/.turbo/turbo-test.log +35 -31
  4. package/{src/components/code-editor/__mocks__ → __mocks__}/@monaco-editor/react.tsx +6 -8
  5. package/{src/components/code-editor/__mocks__ → __mocks__}/monaco-editor.ts +0 -0
  6. package/dist/.tsbuildinfo +1 -1
  7. package/dist/cjs/__tests__/Utils.js.map +1 -1
  8. package/dist/cjs/__tests__/VitestSetup.js +35 -0
  9. package/dist/cjs/__tests__/VitestSetup.js.map +1 -0
  10. package/dist/cjs/components/table/Th.js +8 -11
  11. package/dist/cjs/components/table/Th.js.map +1 -1
  12. package/dist/definitions/__tests__/Utils.d.ts +1 -1
  13. package/dist/definitions/__tests__/Utils.d.ts.map +1 -1
  14. package/dist/definitions/__tests__/VitestSetup.d.ts +2 -0
  15. package/dist/definitions/__tests__/VitestSetup.d.ts.map +1 -0
  16. package/dist/definitions/components/table/Th.d.ts.map +1 -1
  17. package/dist/esm/__tests__/Utils.js +1 -1
  18. package/dist/esm/__tests__/Utils.js.map +1 -1
  19. package/dist/esm/__tests__/VitestSetup.js +30 -0
  20. package/dist/esm/__tests__/VitestSetup.js.map +1 -0
  21. package/dist/esm/components/table/Th.js +9 -12
  22. package/dist/esm/components/table/Th.js.map +1 -1
  23. package/package.json +7 -6
  24. package/src/__tests__/Utils.tsx +1 -1
  25. package/src/__tests__/VitestSetup.ts +27 -0
  26. package/src/components/code-editor/__tests__/CodeEditor.spec.tsx +7 -5
  27. package/src/components/collection/__tests__/Collection.spec.tsx +2 -2
  28. package/src/components/date-range-picker/__tests__/DateRangePickerInlineCalendar.spec.tsx +17 -17
  29. package/src/components/date-range-picker/__tests__/DateRangePickerPopoverCalendar.spec.tsx +11 -7
  30. package/src/components/date-range-picker/__tests__/DateRangePickerPresetSelect.spec.tsx +1 -1
  31. package/src/components/inline-confirm/__tests__/InlineConfirm.spec.tsx +6 -6
  32. package/src/components/modal/__tests__/Modal.spec.tsx +3 -3
  33. package/src/components/modal-wizard/__tests__/ModalWizard.spec.tsx +8 -8
  34. package/src/components/prompt/__tests__/Prompt.spec.tsx +2 -2
  35. package/src/components/table/Th.tsx +9 -7
  36. package/src/components/table/__tests__/Table.spec.tsx +1 -1
  37. package/src/components/table/__tests__/TableActions.spec.tsx +1 -1
  38. package/src/components/table/__tests__/TableDateRangePicker.spec.tsx +11 -8
  39. package/src/components/table/__tests__/TableFilter.spec.tsx +4 -4
  40. package/src/components/table/__tests__/TablePagination.spec.tsx +2 -2
  41. package/src/components/table/__tests__/TablePerPage.spec.tsx +3 -3
  42. package/src/components/table/__tests__/TablePredicate.spec.tsx +2 -2
  43. package/src/components/table/__tests__/Th.spec.tsx +6 -15
  44. package/src/hooks/__tests__/useControlledList.spec.tsx +1 -1
  45. package/tsconfig.build.json +2 -1
  46. package/tsconfig.json +3 -2
  47. package/vitest.config.ts +24 -0
  48. package/dist/cjs/__tests__/GlobalSetup.js +0 -17
  49. package/dist/cjs/__tests__/GlobalSetup.js.map +0 -1
  50. package/dist/cjs/__tests__/Setup.js +0 -6
  51. package/dist/cjs/__tests__/Setup.js.map +0 -1
  52. package/dist/cjs/__tests__/SetupAfterEnv.js +0 -19
  53. package/dist/cjs/__tests__/SetupAfterEnv.js.map +0 -1
  54. package/dist/cjs/components/code-editor/__mocks__/@monaco-editor/react.js +0 -45
  55. package/dist/cjs/components/code-editor/__mocks__/@monaco-editor/react.js.map +0 -1
  56. package/dist/cjs/components/code-editor/__mocks__/monaco-editor.js +0 -24
  57. package/dist/cjs/components/code-editor/__mocks__/monaco-editor.js.map +0 -1
  58. package/dist/definitions/__tests__/GlobalSetup.d.ts +0 -3
  59. package/dist/definitions/__tests__/GlobalSetup.d.ts.map +0 -1
  60. package/dist/definitions/__tests__/Setup.d.ts +0 -5
  61. package/dist/definitions/__tests__/Setup.d.ts.map +0 -1
  62. package/dist/definitions/__tests__/SetupAfterEnv.d.ts +0 -7
  63. package/dist/definitions/__tests__/SetupAfterEnv.d.ts.map +0 -1
  64. package/dist/definitions/components/code-editor/__mocks__/@monaco-editor/react.d.ts +0 -10
  65. package/dist/definitions/components/code-editor/__mocks__/@monaco-editor/react.d.ts.map +0 -1
  66. package/dist/definitions/components/code-editor/__mocks__/monaco-editor.d.ts +0 -8
  67. package/dist/definitions/components/code-editor/__mocks__/monaco-editor.d.ts.map +0 -1
  68. package/dist/esm/__tests__/GlobalSetup.js +0 -7
  69. package/dist/esm/__tests__/GlobalSetup.js.map +0 -1
  70. package/dist/esm/__tests__/Setup.js +0 -5
  71. package/dist/esm/__tests__/Setup.js.map +0 -1
  72. package/dist/esm/__tests__/SetupAfterEnv.js +0 -15
  73. package/dist/esm/__tests__/SetupAfterEnv.js.map +0 -1
  74. package/dist/esm/components/code-editor/__mocks__/@monaco-editor/react.js +0 -24
  75. package/dist/esm/components/code-editor/__mocks__/@monaco-editor/react.js.map +0 -1
  76. package/dist/esm/components/code-editor/__mocks__/monaco-editor.js +0 -14
  77. package/dist/esm/components/code-editor/__mocks__/monaco-editor.js.map +0 -1
  78. package/jest.config.js +0 -26
  79. package/src/__tests__/GlobalSetup.ts +0 -5
  80. package/src/__tests__/Setup.ts +0 -4
  81. package/src/__tests__/SetupAfterEnv.ts +0 -16
@@ -12,7 +12,7 @@ describe('InlineConfirm', () => {
12
12
 
13
13
  it('calls the onClick prop when clicking on a button', async () => {
14
14
  const user = userEvent.setup({delay: null});
15
- const onClickSpy = jest.fn();
15
+ const onClickSpy = vi.fn();
16
16
  render(
17
17
  <InlineConfirm>
18
18
  <InlineConfirm.Button id="delete" onClick={onClickSpy}>
@@ -28,7 +28,7 @@ describe('InlineConfirm', () => {
28
28
 
29
29
  it('calls the onClick prop when clicking on the menu item', async () => {
30
30
  const user = userEvent.setup({delay: null});
31
- const onClickSpy = jest.fn();
31
+ const onClickSpy = vi.fn();
32
32
  render(
33
33
  <InlineConfirm>
34
34
  <Menu>
@@ -55,7 +55,7 @@ describe('InlineConfirm', () => {
55
55
  render(
56
56
  <InlineConfirm>
57
57
  <InlineConfirm.Button id="my-button-id">Remove</InlineConfirm.Button>
58
- <InlineConfirm.Prompt id="my-button-id" label="Are you sure?" onConfirm={jest.fn()} />
58
+ <InlineConfirm.Prompt id="my-button-id" label="Are you sure?" onConfirm={vi.fn()} />
59
59
  </InlineConfirm>
60
60
  );
61
61
  expect(screen.queryByText('Are you sure?')).not.toBeInTheDocument();
@@ -69,7 +69,7 @@ describe('InlineConfirm', () => {
69
69
 
70
70
  it('hides the prompt when the user cancel and call onConfirm when the user confirms', async () => {
71
71
  const user = userEvent.setup({delay: null});
72
- const confirmSpy = jest.fn();
72
+ const confirmSpy = vi.fn();
73
73
  render(
74
74
  <InlineConfirm>
75
75
  <InlineConfirm.Button id="my-button-id">Remove</InlineConfirm.Button>
@@ -103,10 +103,10 @@ describe('InlineConfirm', () => {
103
103
  render(
104
104
  <InlineConfirm>
105
105
  <InlineConfirm.Button id="remove">Remove</InlineConfirm.Button>
106
- <InlineConfirm.Prompt id="remove" label="Delete X?" onConfirm={jest.fn()} />
106
+ <InlineConfirm.Prompt id="remove" label="Delete X?" onConfirm={vi.fn()} />
107
107
 
108
108
  <InlineConfirm.Button id="print">Print</InlineConfirm.Button>
109
- <InlineConfirm.Prompt id="print" label="Print?" onConfirm={jest.fn()} />
109
+ <InlineConfirm.Prompt id="print" label="Print?" onConfirm={vi.fn()} />
110
110
  </InlineConfirm>
111
111
  );
112
112
 
@@ -6,7 +6,7 @@ import {Modal} from '../Modal';
6
6
  describe('Modal', () => {
7
7
  it('renders title, desctiption, close button, and child', () => {
8
8
  render(
9
- <Modal opened onClose={jest.fn()} title="title" description="modal description">
9
+ <Modal opened onClose={vi.fn()} title="title" description="modal description">
10
10
  <Container>Children</Container>
11
11
  </Modal>
12
12
  );
@@ -22,7 +22,7 @@ describe('Modal', () => {
22
22
  render(
23
23
  <Modal
24
24
  opened
25
- onClose={jest.fn()}
25
+ onClose={vi.fn()}
26
26
  title={
27
27
  <div>
28
28
  <QuestionSize32Px />
@@ -38,7 +38,7 @@ describe('Modal', () => {
38
38
  });
39
39
 
40
40
  it('trigger onClose function when click on the close button', () => {
41
- const onClose = jest.fn();
41
+ const onClose = vi.fn();
42
42
  render(
43
43
  <Modal opened onClose={onClose} title="title">
44
44
  <Container>Children</Container>
@@ -169,7 +169,7 @@ describe('ModalWizard', () => {
169
169
  ];
170
170
 
171
171
  const isDirty = () => false;
172
- const onClose = jest.fn();
172
+ const onClose = vi.fn();
173
173
 
174
174
  render(
175
175
  <ModalWizard isDirty={isDirty} onClose={onClose} closeButtonLabel="closebuttonlabel" opened={true}>
@@ -205,7 +205,7 @@ describe('ModalWizard', () => {
205
205
  ];
206
206
 
207
207
  const isDirty = () => false;
208
- const onClose = jest.fn();
208
+ const onClose = vi.fn();
209
209
 
210
210
  render(
211
211
  <ModalWizard isDirty={isDirty} onClose={onClose} opened={true}>
@@ -241,8 +241,8 @@ describe('ModalWizard', () => {
241
241
  ];
242
242
 
243
243
  const isDirty = () => false;
244
- const onClose = jest.fn();
245
- const onFinish = jest.fn();
244
+ const onClose = vi.fn();
245
+ const onFinish = vi.fn();
246
246
 
247
247
  render(
248
248
  <ModalWizard isDirty={isDirty} onClose={onClose} onFinish={onFinish} opened={true}>
@@ -278,8 +278,8 @@ describe('ModalWizard', () => {
278
278
  ];
279
279
 
280
280
  const isDirty = () => true;
281
- const onClose = jest.fn();
282
- const handleDirtyState = jest.fn();
281
+ const onClose = vi.fn();
282
+ const handleDirtyState = vi.fn();
283
283
 
284
284
  render(
285
285
  <ModalWizard
@@ -323,8 +323,8 @@ describe('ModalWizard', () => {
323
323
  ];
324
324
 
325
325
  const isDirty = () => true;
326
- const onClose = jest.fn();
327
- const handleDirtyState = jest.fn();
326
+ const onClose = vi.fn();
327
+ const handleDirtyState = vi.fn();
328
328
 
329
329
  render(
330
330
  <ModalWizard
@@ -4,7 +4,7 @@ import {Prompt} from '../Prompt';
4
4
  describe('Prompt', () => {
5
5
  it('displays the title, body and close button', () => {
6
6
  render(
7
- <Prompt variant="default" opened onClose={jest.fn()} title="title modal">
7
+ <Prompt variant="default" opened onClose={vi.fn()} title="title modal">
8
8
  content modal
9
9
  <Prompt.Footer>footer content</Prompt.Footer>
10
10
  </Prompt>
@@ -16,7 +16,7 @@ describe('Prompt', () => {
16
16
  });
17
17
 
18
18
  it('calls onClose when clicking on the close button', () => {
19
- const onClose = jest.fn();
19
+ const onClose = vi.fn();
20
20
  render(
21
21
  <Prompt variant="default" opened onClose={onClose} title="title modal">
22
22
  content modal
@@ -1,4 +1,4 @@
1
- import {ArrowHeadDownSize16Px, ArrowHeadUpSize16Px} from '@coveord/plasma-react-icons';
1
+ import {ArrowDownSize16Px, ArrowUpSize16Px, DoubleArrowHeadVSize16Px} from '@coveord/plasma-react-icons';
2
2
  import {Center, createStyles, Group, Text, UnstyledButton} from '@mantine/core';
3
3
  import {defaultColumnSizing, flexRender, Header} from '@tanstack/react-table';
4
4
 
@@ -26,13 +26,15 @@ interface ThProps<T> {
26
26
  }
27
27
 
28
28
  const SortingIcons = {
29
- asc: ArrowHeadDownSize16Px,
30
- desc: ArrowHeadUpSize16Px,
29
+ asc: ArrowUpSize16Px,
30
+ desc: ArrowDownSize16Px,
31
+ none: DoubleArrowHeadVSize16Px,
31
32
  };
32
33
 
33
34
  const SortingLabels = {
34
35
  asc: 'ascending',
35
36
  desc: 'descending',
37
+ none: 'none',
36
38
  } as const;
37
39
 
38
40
  export const Th = <T,>({header}: ThProps<T>) => {
@@ -55,15 +57,15 @@ export const Th = <T,>({header}: ThProps<T>) => {
55
57
  }
56
58
 
57
59
  const onSort = header.column.getToggleSortingHandler();
58
- const sortingOrder = header.column.getIsSorted();
59
- const Icon = SortingIcons[sortingOrder || header.column.getFirstSortDir()];
60
+ const sortingOrder = header.column.getIsSorted() || 'none';
61
+ const Icon = SortingIcons[sortingOrder];
60
62
 
61
63
  return (
62
- <th className={classes.th} style={{width}} aria-sort={sortingOrder ? SortingLabels[sortingOrder] : 'none'}>
64
+ <th className={classes.th} style={{width}} aria-sort={SortingLabels[sortingOrder]}>
63
65
  <UnstyledButton onClick={onSort} className={classes.control}>
64
66
  <Group position="apart" noWrap>
65
67
  <Text size="xs">{flexRender(header.column.columnDef.header, header.getContext())}</Text>
66
- <Center sx={(theme) => ({color: sortingOrder ? theme.colors.action[8] : undefined})}>
68
+ <Center>
67
69
  <Icon height={14} />
68
70
  </Center>
69
71
  </Group>
@@ -169,7 +169,7 @@ describe('Table', () => {
169
169
 
170
170
  it('calls an action when user double clicks on a row', async () => {
171
171
  const user = userEvent.setup();
172
- const doubleClickSpy = jest.fn();
172
+ const doubleClickSpy = vi.fn();
173
173
  render(
174
174
  <Table<RowData>
175
175
  data={[{firstName: 'Mario'}, {firstName: 'Luigi'}]}
@@ -38,7 +38,7 @@ describe('Table.Actions', () => {
38
38
  describe('when multi row selection is enabled', () => {
39
39
  it('passes down an array of selected rows', async () => {
40
40
  const user = userEvent.setup({delay: null});
41
- const renderSpy = jest.fn().mockImplementation(() => <div />);
41
+ const renderSpy = vi.fn().mockImplementation(() => <div />);
42
42
  render(
43
43
  <Table<RowData>
44
44
  data={[{name: 'fruit'}, {name: 'vegetable'}, {name: 'bread'}]}
@@ -11,20 +11,23 @@ const columns: Array<ColumnDef<RowData>> = [columnHelper.accessor('name', {enabl
11
11
  // Since we're mocking the date and the animations are timer based we're mocking useReduceMotion to disable all the animations
12
12
  // I tried wrapping the components in <MantineProvider theme={{components: {Transition: {defaultProps: {duration: 0}}}}}>
13
13
  // but the animation was still happening. :(
14
- jest.mock('@mantine/hooks', () => ({
15
- ...jest.requireActual('@mantine/hooks'),
16
- useReducedMotion: () => true,
17
- }));
14
+ vi.mock('@mantine/hooks', async () => {
15
+ const actual = await vi.importActual('@mantine/hooks');
16
+ return {
17
+ ...actual,
18
+ useReduceMotion: () => true,
19
+ };
20
+ });
18
21
 
19
22
  describe('Table.DateRangePicker', () => {
20
- jest.setTimeout(15000);
23
+ // vi.setTimeout(15000);
21
24
 
22
25
  beforeEach(() => {
23
- jest.useFakeTimers().setSystemTime(new Date(2022, 0, 15));
26
+ vi.useFakeTimers().setSystemTime(new Date(2022, 0, 15));
24
27
  });
25
28
 
26
29
  afterEach(() => {
27
- jest.useRealTimers();
30
+ vi.useRealTimers();
28
31
  });
29
32
 
30
33
  it('displays the intial dates', async () => {
@@ -47,7 +50,7 @@ describe('Table.DateRangePicker', () => {
47
50
 
48
51
  it('displays the selected date range in the table', async () => {
49
52
  const user = userEvent.setup({delay: null});
50
- const onChange = jest.fn();
53
+ const onChange = vi.fn();
51
54
  render(
52
55
  <Table
53
56
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -10,7 +10,7 @@ const columns: Array<ColumnDef<RowData>> = [columnHelper.accessor('name', {enabl
10
10
 
11
11
  describe('Table.Filter', () => {
12
12
  it('displays the placeholder', () => {
13
- const onChange = jest.fn();
13
+ const onChange = vi.fn();
14
14
  render(
15
15
  <Table data={[{name: 'fruit'}, {name: 'vegetable'}]} columns={columns} onChange={onChange}>
16
16
  <Table.Header>
@@ -24,7 +24,7 @@ describe('Table.Filter', () => {
24
24
 
25
25
  it('calls onChange when typing something in the filter', async () => {
26
26
  const user = userEvent.setup({delay: null});
27
- const onChange = jest.fn();
27
+ const onChange = vi.fn();
28
28
  render(
29
29
  <Table data={[{name: 'fruit'}, {name: 'vegetable'}]} columns={columns} onChange={onChange}>
30
30
  <Table.Header>
@@ -40,7 +40,7 @@ describe('Table.Filter', () => {
40
40
 
41
41
  it('goes back to the first page when changing the filter', async () => {
42
42
  const user = userEvent.setup({delay: null});
43
- const onChange = jest.fn();
43
+ const onChange = vi.fn();
44
44
  render(
45
45
  <Table data={[{name: 'fruit'}, {name: 'vegetable'}]} columns={columns} onChange={onChange}>
46
46
  <Table.Header>
@@ -63,7 +63,7 @@ describe('Table.Filter', () => {
63
63
  describe('when multi row selection is enabled', () => {
64
64
  it('does not unselect rows that get filtered out', async () => {
65
65
  const user = userEvent.setup({delay: null});
66
- const onChange = jest.fn();
66
+ const onChange = vi.fn();
67
67
  render(
68
68
  <Table
69
69
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -12,7 +12,7 @@ describe('Table.Pagination', () => {
12
12
  beforeEach(() => {
13
13
  if (!HTMLElement.prototype.scrollIntoView) {
14
14
  HTMLElement.prototype.scrollIntoView = () => {
15
- jest.fn();
15
+ vi.fn();
16
16
  };
17
17
  }
18
18
  });
@@ -37,7 +37,7 @@ describe('Table.Pagination', () => {
37
37
 
38
38
  it('calls onChange when clicking on a page number', async () => {
39
39
  const user = userEvent.setup();
40
- const onChange = jest.fn();
40
+ const onChange = vi.fn();
41
41
  render(
42
42
  <Table data={[{name: 'fruit'}, {name: 'vegetable'}]} columns={columns} onChange={onChange}>
43
43
  <Table.Footer>
@@ -43,7 +43,7 @@ describe('Table.PerPage', () => {
43
43
  });
44
44
 
45
45
  it('calls onMount with the initial value', () => {
46
- const onMount = jest.fn();
46
+ const onMount = vi.fn();
47
47
  render(
48
48
  <Table
49
49
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -64,7 +64,7 @@ describe('Table.PerPage', () => {
64
64
 
65
65
  it('calls onChange when changing the number of items per page', async () => {
66
66
  const user = userEvent.setup({delay: null});
67
- const onChange = jest.fn();
67
+ const onChange = vi.fn();
68
68
  render(
69
69
  <Table data={[{name: 'fruit'}, {name: 'vegetable'}]} columns={columns} onChange={onChange}>
70
70
  <Table.Footer>
@@ -82,7 +82,7 @@ describe('Table.PerPage', () => {
82
82
 
83
83
  it('resets page index when changing the number of items per page', async () => {
84
84
  const user = userEvent.setup({delay: null});
85
- const onChange = jest.fn();
85
+ const onChange = vi.fn();
86
86
  render(
87
87
  <Table
88
88
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -38,7 +38,7 @@ describe('Table.Predicate', () => {
38
38
  });
39
39
 
40
40
  it('calls onMount with the initial value', async () => {
41
- const onMount = jest.fn();
41
+ const onMount = vi.fn();
42
42
  render(
43
43
  <Table
44
44
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -70,7 +70,7 @@ describe('Table.Predicate', () => {
70
70
 
71
71
  it('calls onChange when changing the predicate', async () => {
72
72
  const user = userEvent.setup({delay: null});
73
- const onChange = jest.fn();
73
+ const onChange = vi.fn();
74
74
  render(
75
75
  <Table
76
76
  data={[{name: 'fruit'}, {name: 'vegetable'}]}
@@ -22,15 +22,11 @@ describe('Th', () => {
22
22
  ];
23
23
  render(<Table data={data} columns={columns} />);
24
24
 
25
- // icons are loadable, wait for them to load
26
- await screen.findByRole('img', {name: 'arrowHeadDown'});
27
- await screen.findByRole('img', {name: 'arrowHeadUp'});
28
-
29
25
  const headers = screen.getAllByRole('button');
30
26
  expect(headers.length).toBe(2);
31
27
 
32
- expect(headers[0]).toHaveAccessibleName('name arrowHeadDown');
33
- expect(headers[1]).toHaveAccessibleName('type arrowHeadUp');
28
+ expect(headers[0]).toHaveAccessibleName(/name doubleArrowHead/i);
29
+ expect(headers[1]).toHaveAccessibleName(/type doubleArrowHead/i);
34
30
  });
35
31
 
36
32
  it('changes the sort icon when clicking on a table header', async () => {
@@ -38,25 +34,20 @@ describe('Th', () => {
38
34
  {name: 'apple', type: 'fruit', colors: ['red', 'green']},
39
35
  {name: 'potato', type: 'vegetable', colors: ['brown', 'blue', 'yellow']},
40
36
  ];
41
- const onChange = jest.fn();
37
+ const onChange = vi.fn();
42
38
  render(<Table data={data} columns={columns} onChange={onChange} />);
43
39
 
44
- // icons are loadable, wait for them to load
45
- await screen.findAllByRole('img', {name: 'arrowHeadDown'});
46
- await screen.findAllByRole('img', {name: 'arrowHeadUp'});
47
-
48
- userEvent.click(screen.getByRole('button', {name: /name arrowheaddown/i}));
40
+ userEvent.click(screen.getByRole('button', {name: /name doubleArrowHead/i}));
49
41
  await waitFor(() => {
50
42
  expect(onChange).toHaveBeenCalledWith(expect.objectContaining({sorting: [{id: 'name', desc: false}]}));
51
43
  });
52
44
 
53
- userEvent.click(screen.getByRole('button', {name: 'name arrowHeadDown'}));
45
+ userEvent.click(screen.getByRole('button', {name: /name arrowUp/i}));
54
46
  await waitFor(() => {
55
47
  expect(onChange).toHaveBeenCalledWith(expect.objectContaining({sorting: [{id: 'name', desc: true}]}));
56
48
  });
57
49
 
58
- await waitFor(() => expect(screen.queryByRole('button', {name: 'name arrowHeadUp'})).toBeVisible());
59
- userEvent.click(screen.getByRole('button', {name: 'name arrowHeadUp'}));
50
+ userEvent.click(screen.getByRole('button', {name: /name arrowDown/i}));
60
51
  await waitFor(() => {
61
52
  expect(onChange).toHaveBeenCalledWith(expect.objectContaining({sorting: [{id: 'name', desc: false}]}));
62
53
  });
@@ -3,7 +3,7 @@ import {renderHook} from '@testing-library/react';
3
3
  import {useControlledList} from '../useControlledList';
4
4
 
5
5
  describe('useControlledList', () => {
6
- const onChange = jest.fn();
6
+ const onChange = vi.fn();
7
7
 
8
8
  afterEach(() => {
9
9
  onChange.mockClear();
@@ -1,4 +1,5 @@
1
1
  {
2
2
  "extends": "./tsconfig.json",
3
- "exclude": ["**/*.spec.*"]
3
+ "exclude": ["**/*.spec.*"],
4
+ "include": ["src"]
4
5
  }
package/tsconfig.json CHANGED
@@ -8,7 +8,8 @@
8
8
  "baseUrl": ".",
9
9
  "paths": {
10
10
  "@test-utils": ["./src/__tests__/Utils.tsx"]
11
- }
11
+ },
12
+ "types": ["vitest/globals"]
12
13
  },
13
- "include": ["src"]
14
+ "include": ["src", "__mocks__"]
14
15
  }
@@ -0,0 +1,24 @@
1
+ import {resolve} from 'path';
2
+ import {defineConfig} from 'vitest/config';
3
+
4
+ export default defineConfig({
5
+ resolve: {
6
+ alias: [
7
+ {
8
+ find: '@test-utils',
9
+ replacement: resolve(__dirname, './src/__tests__/Utils.tsx'),
10
+ },
11
+ ],
12
+ },
13
+ test: {
14
+ globals: true,
15
+ environment: 'jsdom',
16
+ setupFiles: './src/__tests__/VitestSetup.ts',
17
+ alias: [
18
+ {
19
+ find: /^monaco-editor$/,
20
+ replacement: 'monaco-editor/esm/vs/editor/editor.main.js',
21
+ },
22
+ ],
23
+ },
24
+ });
@@ -1,17 +0,0 @@
1
- // This file is executed once, before everything else.
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "default", {
7
- enumerable: true,
8
- get: function() {
9
- return _default;
10
- }
11
- });
12
- var _default = function() {
13
- // @ts-ignore
14
- process.env.TZ = "UTC";
15
- };
16
-
17
- //# sourceMappingURL=GlobalSetup.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/__tests__/GlobalSetup.ts"],"sourcesContent":["// This file is executed once, before everything else.\nexport default () => {\n // @ts-ignore\n process.env.TZ = 'UTC';\n};\n"],"names":["process","env","TZ"],"mappings":"AAAA,sDAAsD;;;;;+BACtD;;;eAAA;;;IAAA,WAAe,WAAM;IACjB,aAAa;IACbA,QAAQC,GAAG,CAACC,EAAE,GAAG;AACrB"}
@@ -1,6 +0,0 @@
1
- /**
2
- * This file is executed once per test file.
3
- * It is executed before executing SetupAfterEnv and before the test code itself.
4
- */ "use strict";
5
-
6
- //# sourceMappingURL=Setup.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/__tests__/Setup.ts"],"sourcesContent":["/**\n * This file is executed once per test file.\n * It is executed before executing SetupAfterEnv and before the test code itself.\n */\n"],"names":[],"mappings":"AAAA;;;CAGC"}
@@ -1,19 +0,0 @@
1
- /**
2
- * This file is executed once per test file.
3
- * It is executed after executing Setup and Jest is initialised, but before the test code itself.
4
- */ "use strict";
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- require("@testing-library/jest-dom");
9
- require("@testing-library/jest-dom/extend-expect");
10
- Element.prototype.scrollTo = jest.fn();
11
- window.ResizeObserver = window.ResizeObserver || jest.fn().mockImplementation(function() {
12
- return {
13
- disconnect: jest.fn(),
14
- observe: jest.fn(),
15
- unobserve: jest.fn()
16
- };
17
- });
18
-
19
- //# sourceMappingURL=SetupAfterEnv.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/__tests__/SetupAfterEnv.ts"],"sourcesContent":["/**\n * This file is executed once per test file.\n * It is executed after executing Setup and Jest is initialised, but before the test code itself.\n */\n\nimport '@testing-library/jest-dom';\nimport '@testing-library/jest-dom/extend-expect';\n\nElement.prototype.scrollTo = jest.fn();\nwindow.ResizeObserver =\n window.ResizeObserver ||\n jest.fn().mockImplementation(() => ({\n disconnect: jest.fn(),\n observe: jest.fn(),\n unobserve: jest.fn(),\n }));\n"],"names":["Element","prototype","scrollTo","jest","fn","window","ResizeObserver","mockImplementation","disconnect","observe","unobserve"],"mappings":"AAAA;;;CAGC;;;;QAEM;QACA;AAEPA,QAAQC,SAAS,CAACC,QAAQ,GAAGC,KAAKC,EAAE;AACpCC,OAAOC,cAAc,GACjBD,OAAOC,cAAc,IACrBH,KAAKC,EAAE,GAAGG,kBAAkB,CAAC;WAAO;QAChCC,YAAYL,KAAKC,EAAE;QACnBK,SAASN,KAAKC,EAAE;QAChBM,WAAWP,KAAKC,EAAE;IACtB"}
@@ -1,45 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- function _export(target, all) {
6
- for(var name in all)Object.defineProperty(target, name, {
7
- enumerable: true,
8
- get: all[name]
9
- });
10
- }
11
- _export(exports, {
12
- default: function() {
13
- return _default;
14
- },
15
- loader: function() {
16
- return loader;
17
- },
18
- useMonaco: function() {
19
- return useMonaco;
20
- }
21
- });
22
- var _jsxRuntime = require("react/jsx-runtime");
23
- var _react = require("react");
24
- var editor = {
25
- onDidFocusEditorText: jest.fn(),
26
- onDidBlurEditorText: jest.fn()
27
- };
28
- var monaco = jest.fn();
29
- var MockedEditor = function(props) {
30
- (0, _react.useEffect)(function() {
31
- props.onMount(editor, monaco);
32
- }, []);
33
- return /*#__PURE__*/ (0, _jsxRuntime.jsx)("div", {
34
- "data-testid": "monaco-editor"
35
- });
36
- };
37
- var _default = MockedEditor;
38
- var loader = {
39
- config: jest.fn()
40
- };
41
- var useMonaco = function() {
42
- return jest.fn();
43
- };
44
-
45
- //# sourceMappingURL=react.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../../../src/components/code-editor/__mocks__/@monaco-editor/react.tsx"],"sourcesContent":["import {EditorProps} from '@monaco-editor/react';\nimport {FunctionComponent, useEffect} from 'react';\n\nconst editor: any = {\n onDidFocusEditorText: jest.fn(),\n onDidBlurEditorText: jest.fn(),\n};\n\nconst monaco: any = jest.fn();\n\nconst MockedEditor: FunctionComponent<EditorProps> = (props) => {\n useEffect(() => {\n props.onMount(editor, monaco);\n }, []);\n return <div data-testid=\"monaco-editor\" />;\n};\n\nexport default MockedEditor;\n\nexport const loader = {\n config: jest.fn(),\n};\n\nexport const useMonaco = () => jest.fn();\n"],"names":["loader","useMonaco","editor","onDidFocusEditorText","jest","fn","onDidBlurEditorText","monaco","MockedEditor","props","useEffect","onMount","div","data-testid","config"],"mappings":";;;;;;;;;;;IAiBA,OAA4B;eAA5B;;IAEaA,MAAM;eAANA;;IAIAC,SAAS;eAATA;;;;qBAtB8B;AAE3C,IAAMC,SAAc;IAChBC,sBAAsBC,KAAKC,EAAE;IAC7BC,qBAAqBF,KAAKC,EAAE;AAChC;AAEA,IAAME,SAAcH,KAAKC,EAAE;AAE3B,IAAMG,eAA+C,SAACC,OAAU;IAC5DC,IAAAA,gBAAS,EAAC,WAAM;QACZD,MAAME,OAAO,CAACT,QAAQK;IAC1B,GAAG,EAAE;IACL,qBAAO,qBAACK;QAAIC,eAAY;;AAC5B;IAEA,WAAeL;AAER,IAAMR,SAAS;IAClBc,QAAQV,KAAKC,EAAE;AACnB;AAEO,IAAMJ,YAAY;WAAMG,KAAKC,EAAE"}
@@ -1,24 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "monaco", {
6
- enumerable: true,
7
- get: function() {
8
- return monaco;
9
- }
10
- });
11
- var editor = {
12
- create: function() {
13
- return {
14
- dispose: function() {
15
- return null;
16
- }
17
- };
18
- }
19
- };
20
- var monaco = {
21
- editor: editor
22
- };
23
-
24
- //# sourceMappingURL=monaco-editor.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../../src/components/code-editor/__mocks__/monaco-editor.ts"],"sourcesContent":["const editor = {\n create: () => ({\n dispose: (): void => null,\n }),\n};\n\nexport const monaco = {\n editor,\n};\n"],"names":["monaco","editor","create","dispose"],"mappings":";;;;+BAMaA;;;eAAAA;;;AANb,IAAMC,SAAS;IACXC,QAAQ;eAAO;YACXC,SAAS;uBAAY,IAAI;;QAC7B;;AACJ;AAEO,IAAMH,SAAS;IAClBC,QAAAA;AACJ"}
@@ -1,3 +0,0 @@
1
- declare const _default: () => void;
2
- export default _default;
3
- //# sourceMappingURL=GlobalSetup.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"GlobalSetup.d.ts","sourceRoot":"","sources":["../../../src/__tests__/GlobalSetup.ts"],"names":[],"mappings":";AACA,wBAGE"}
@@ -1,5 +0,0 @@
1
- /**
2
- * This file is executed once per test file.
3
- * It is executed before executing SetupAfterEnv and before the test code itself.
4
- */
5
- //# sourceMappingURL=Setup.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Setup.d.ts","sourceRoot":"","sources":["../../../src/__tests__/Setup.ts"],"names":[],"mappings":"AAAA;;;GAGG"}
@@ -1,7 +0,0 @@
1
- /**
2
- * This file is executed once per test file.
3
- * It is executed after executing Setup and Jest is initialised, but before the test code itself.
4
- */
5
- import '@testing-library/jest-dom';
6
- import '@testing-library/jest-dom/extend-expect';
7
- //# sourceMappingURL=SetupAfterEnv.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SetupAfterEnv.d.ts","sourceRoot":"","sources":["../../../src/__tests__/SetupAfterEnv.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,2BAA2B,CAAC;AACnC,OAAO,yCAAyC,CAAC"}
@@ -1,10 +0,0 @@
1
- /// <reference types="jest" />
2
- import { EditorProps } from '@monaco-editor/react';
3
- import { FunctionComponent } from 'react';
4
- declare const MockedEditor: FunctionComponent<EditorProps>;
5
- export default MockedEditor;
6
- export declare const loader: {
7
- config: jest.Mock<any, any>;
8
- };
9
- export declare const useMonaco: () => jest.Mock<any, any>;
10
- //# sourceMappingURL=react.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../../../../../../src/components/code-editor/__mocks__/@monaco-editor/react.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAC,iBAAiB,EAAY,MAAM,OAAO,CAAC;AASnD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,WAAW,CAKhD,CAAC;AAEF,eAAe,YAAY,CAAC;AAE5B,eAAO,MAAM,MAAM;;CAElB,CAAC;AAEF,eAAO,MAAM,SAAS,2BAAkB,CAAC"}