web_src/js/components/ViewFileTree.test.ts - master - uzer_007/Rixea

web_src/js/components/ViewFileTree.test.ts
87 строк4 KB
uzer_007
feat: первая версия Rixea
02 авг 2026, 22:16
02 авг 2026, 22:16d4f7504
import {createApp} from 'vue';
import ViewFileTree from './ViewFileTree.vue';

const directoryNode = {
  entryName: 'docs',
  entryMode: 'tree',
  entryIcon: '<svg></svg>',
  entryIconOpen: '<svg></svg>',
  fullPath: 'docs',
};

const fileNode = {
  entryName: 'architecture.md',
  entryMode: 'blob',
  entryIcon: '<svg></svg>',
  fullPath: 'docs/architecture.md',
};

test('восстанавливает корень и вложенный каталог после ошибок', async () => {
  const fetchMock = vi.fn()
    .mockResolvedValueOnce(new Response('{}', {status: 503}))
    .mockResolvedValueOnce(Response.json({renderedIconPool: {}, fileTreeNodes: [directoryNode]}))
    .mockResolvedValueOnce(new Response('{}', {status: 503}))
    .mockResolvedValueOnce(Response.json({renderedIconPool: {}, fileTreeNodes: [fileNode]}))
    .mockResolvedValueOnce(new Response('<p>Некорректное содержимое</p>', {status: 200}))
    .mockResolvedValueOnce(new Response(`
      <div class="repo-view-content-data" data-document-title="architecture.md" data-document-title-common="Rixea"></div>
    `, {status: 200}));
  vi.stubGlobal('fetch', fetchMock);

  const root = document.createElement('div');
  const content = document.createElement('div');
  content.className = 'repo-view-content';
  document.body.append(root);
  document.body.append(content);
  const pushState = vi.spyOn(window.history, 'pushState').mockImplementation(() => {});
  const app = createApp(ViewFileTree, {
    repoLink: '/owner/repository',
    treePath: '',
    currentRefNameSubURL: 'branch/main',
    loadErrorText: 'Не удалось загрузить дерево файлов.',
    contentLoadErrorText: 'Не удалось открыть выбранный путь.',
    loadingText: 'Загрузка…',
    retryText: 'Повторить',
  });

  try {
    app.mount(root);
    await vi.waitFor(() => {
      expect(root.querySelector('[role="alert"]')?.textContent).toContain('Не удалось загрузить дерево файлов.');
    });

    root.querySelector<HTMLButtonElement>('[role="alert"] button')!.click();
    await vi.waitFor(() => expect(root.querySelector('.tree-item[title="docs"]')).not.toBeNull());
    const directoryLink = root.querySelector<HTMLAnchorElement>('.tree-item[title="docs"]')!;
    expect(directoryLink).toBe(document.activeElement);

    directoryLink.querySelector<SVGElement>('.item-toggle svg')!.dispatchEvent(new MouseEvent('click', {bubbles: true}));
    await vi.waitFor(() => {
      expect(root.querySelector('[role="alert"]')?.textContent).toContain('Не удалось загрузить дерево файлов.');
    });
    expect(directoryLink.getAttribute('aria-expanded')).toBe('true');
    expect(directoryLink.getAttribute('aria-busy')).toBeNull();

    root.querySelector<HTMLButtonElement>('[role="alert"] button')!.click();
    await vi.waitFor(() => expect(root.querySelector('.tree-item[title="architecture.md"]')).not.toBeNull());
    expect(directoryLink).toBe(document.activeElement);

    const fileLink = root.querySelector<HTMLAnchorElement>('.tree-item[title="architecture.md"]')!;
    fileLink.click();
    await vi.waitFor(() => {
      expect(root.querySelector('[role="alert"]')?.textContent).toContain('Не удалось открыть выбранный путь.');
    });
    root.querySelector<HTMLButtonElement>('[role="alert"] button')!.click();
    await vi.waitFor(() => expect(fileLink.classList.contains('selected')).toBe(true));
    expect(fileLink).toBe(document.activeElement);
    expect(document.title).toBe('architecture.md - Rixea');
    expect(pushState).toHaveBeenCalledTimes(1);
    expect(fetchMock).toHaveBeenCalledTimes(6);
  } finally {
    app.unmount();
    root.remove();
    content.remove();
    pushState.mockRestore();
    vi.unstubAllGlobals();
  }
});