aboutsummaryrefslogtreecommitdiffstats
path: root/web_src/js/features/repo-settings-branches.test.ts
blob: 526e279723c99e8d652e1736d22ffa9373f09f2a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
import {beforeEach, describe, expect, test, vi} from 'vitest';
import {initRepoSettingsBranchesDrag} from './repo-settings-branches.ts';
import {POST} from '../modules/fetch.ts';
import {createSortable} from '../modules/sortable.ts';
import type {SortableEvent, SortableOptions} from 'sortablejs';
import type Sortable from 'sortablejs';

vi.mock('../modules/fetch.ts', () => ({
  POST: vi.fn(),
}));

vi.mock('../modules/sortable.ts', () => ({
  createSortable: vi.fn(),
}));

describe('Repository Branch Settings', () => {
  beforeEach(() => {
    document.body.innerHTML = `
      <div id="protected-branches-list" data-update-priority-url="some/repo/branches/priority">
        <div class="flex-item tw-items-center item" data-id="1" >
          <div class="drag-handle"></div>
        </div>
        <div class="flex-item tw-items-center item" data-id="2" >
          <div class="drag-handle"></div>
        </div>
        <div class="flex-item tw-items-center item" data-id="3" >
          <div class="drag-handle"></div>
        </div>
      </div>
    `;

    vi.clearAllMocks();
  });

  test('should initialize sortable for protected branches list', () => {
    initRepoSettingsBranchesDrag();

    expect(createSortable).toHaveBeenCalledWith(
      document.querySelector('#protected-branches-list'),
      expect.objectContaining({
        handle: '.drag-handle',
        animation: 150,
      }),
    );
  });

  test('should not initialize if protected branches list is not present', () => {
    document.body.innerHTML = '';

    initRepoSettingsBranchesDrag();

    expect(createSortable).not.toHaveBeenCalled();
  });

  test('should post new order after sorting', async () => {
    vi.mocked(POST).mockResolvedValue({ok: true} as Response);

    // Mock createSortable to capture and execute the onEnd callback
    vi.mocked(createSortable).mockImplementation(async (_el: Element, options: SortableOptions) => {
      options.onEnd(new Event('SortableEvent') as SortableEvent);
      // @ts-expect-error: mock is incomplete
      return {destroy: vi.fn()} as Sortable;
    });

    initRepoSettingsBranchesDrag();

    expect(POST).toHaveBeenCalledWith(
      'some/repo/branches/priority',
      expect.objectContaining({
        data: {ids: [1, 2, 3]},
      }),
    );
  });
});