2021-02-22 17:27:13 +05:30
|
|
|
import {
|
|
|
|
findAllByText,
|
|
|
|
fireEvent,
|
|
|
|
getByLabelText,
|
|
|
|
findByTestId,
|
|
|
|
getByText,
|
|
|
|
screen,
|
|
|
|
findByText,
|
|
|
|
} from '@testing-library/dom';
|
2021-01-03 14:25:43 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const isFolderRowOpen = (row) => row.matches('.folder.is-open');
|
2021-01-03 14:25:43 +05:30
|
|
|
|
|
|
|
const getLeftSidebar = () => screen.getByTestId('left-sidebar');
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const switchLeftSidebarTab = (name) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
const sidebar = getLeftSidebar();
|
|
|
|
|
|
|
|
const button = getByLabelText(sidebar, name);
|
|
|
|
|
|
|
|
button.click();
|
|
|
|
};
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const getStatusBar = () => document.querySelector('.ide-status-bar');
|
2021-01-03 14:25:43 +05:30
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const waitForMonacoEditor = () =>
|
2021-03-08 18:12:59 +05:30
|
|
|
new Promise((resolve) => window.monaco.editor.onDidCreateEditor(resolve));
|
2021-02-22 17:27:13 +05:30
|
|
|
|
|
|
|
export const findMonacoEditor = () =>
|
|
|
|
screen.findAllByLabelText(/Editor content;/).then(([x]) => x.closest('.monaco-editor'));
|
|
|
|
|
|
|
|
export const findMonacoDiffEditor = () =>
|
|
|
|
screen.findAllByLabelText(/Editor content;/).then(([x]) => x.closest('.monaco-diff-editor'));
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const findAndSetEditorValue = async (value) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
const editor = await findMonacoEditor();
|
|
|
|
const uri = editor.getAttribute('data-uri');
|
|
|
|
|
|
|
|
window.monaco.editor.getModel(uri).setValue(value);
|
|
|
|
};
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const getEditorValue = async () => {
|
|
|
|
const editor = await findMonacoEditor();
|
|
|
|
const uri = editor.getAttribute('data-uri');
|
|
|
|
|
|
|
|
return window.monaco.editor.getModel(uri).getValue();
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const findTreeBody = () => screen.findByTestId('ide-tree-body');
|
2021-01-03 14:25:43 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const findRootActions = () => screen.findByTestId('ide-root-actions');
|
2021-01-03 14:25:43 +05:30
|
|
|
|
|
|
|
const findFileRowContainer = (row = null) =>
|
|
|
|
row ? Promise.resolve(row.parentElement) : findTreeBody();
|
|
|
|
|
|
|
|
const findFileChild = async (row, name, index = 0) => {
|
|
|
|
const container = await findFileRowContainer(row);
|
|
|
|
const children = await findAllByText(container, name, { selector: '.file-row-name' });
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
return children
|
|
|
|
.map((x) => x.closest('.file-row'))
|
|
|
|
.find((x) => x.dataset.level === index.toString());
|
2021-01-03 14:25:43 +05:30
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const openFileRow = (row) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
if (!row || isFolderRowOpen(row)) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
row.click();
|
|
|
|
};
|
|
|
|
|
2021-03-11 19:13:27 +05:30
|
|
|
export const findAndTraverseToPath = async (path, index = 0, row = null) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
if (!path) {
|
|
|
|
return row;
|
|
|
|
}
|
|
|
|
|
|
|
|
const [name, ...restOfPath] = path.split('/');
|
|
|
|
|
|
|
|
openFileRow(row);
|
|
|
|
|
|
|
|
const child = await findFileChild(row, name, index);
|
|
|
|
|
|
|
|
return findAndTraverseToPath(restOfPath.join('/'), index + 1, child);
|
|
|
|
};
|
|
|
|
|
|
|
|
const clickFileRowAction = (row, name) => {
|
|
|
|
fireEvent.mouseOver(row);
|
|
|
|
|
|
|
|
const dropdownButton = getByLabelText(row, 'Create new file or directory');
|
|
|
|
dropdownButton.click();
|
|
|
|
|
|
|
|
const dropdownAction = getByLabelText(dropdownButton.parentNode, name);
|
|
|
|
dropdownAction.click();
|
|
|
|
};
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
const fillFileNameModal = async (value, submitText = 'Create file') => {
|
|
|
|
const modal = await screen.findByTestId('ide-new-entry');
|
|
|
|
|
|
|
|
const nameField = await findByTestId(modal, 'file-name-field');
|
2021-01-03 14:25:43 +05:30
|
|
|
fireEvent.input(nameField, { target: { value } });
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
const createButton = getByText(modal, submitText, { selector: 'button' });
|
2021-01-03 14:25:43 +05:30
|
|
|
createButton.click();
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const findAndClickRootAction = async (name) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
const container = await findRootActions();
|
|
|
|
const button = getByLabelText(container, name);
|
|
|
|
|
|
|
|
button.click();
|
|
|
|
};
|
|
|
|
|
2021-03-11 19:13:27 +05:30
|
|
|
/**
|
|
|
|
* Drop leading "/-/ide" and file path from the current URL
|
|
|
|
*/
|
|
|
|
export const getBaseRoute = (url = window.location.pathname) =>
|
|
|
|
url.replace(/^\/-\/ide/, '').replace(/\/-\/.*$/, '');
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const clickPreviewMarkdown = () => {
|
|
|
|
screen.getByText('Preview Markdown').click();
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const openFile = async (path) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
const row = await findAndTraverseToPath(path);
|
|
|
|
|
|
|
|
openFileRow(row);
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const waitForTabToOpen = (fileName) =>
|
2021-02-22 17:27:13 +05:30
|
|
|
findByText(document.querySelector('.multi-file-edit-pane'), fileName);
|
|
|
|
|
2021-01-03 14:25:43 +05:30
|
|
|
export const createFile = async (path, content) => {
|
2021-03-08 18:12:59 +05:30
|
|
|
const parentPath = path.split('/').slice(0, -1).join('/');
|
2021-01-03 14:25:43 +05:30
|
|
|
|
|
|
|
const parentRow = await findAndTraverseToPath(parentPath);
|
|
|
|
|
|
|
|
if (parentRow) {
|
|
|
|
clickFileRowAction(parentRow, 'New file');
|
|
|
|
} else {
|
|
|
|
await findAndClickRootAction('New file');
|
|
|
|
}
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
await fillFileNameModal(path);
|
2021-01-03 14:25:43 +05:30
|
|
|
await findAndSetEditorValue(content);
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const updateFile = async (path, content) => {
|
|
|
|
await openFile(path);
|
|
|
|
await findAndSetEditorValue(content);
|
|
|
|
};
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const getFilesList = () => {
|
2021-03-08 18:12:59 +05:30
|
|
|
return screen.getAllByTestId('file-row-name-container').map((e) => e.textContent.trim());
|
2021-02-22 17:27:13 +05:30
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const deleteFile = async (path) => {
|
2021-01-03 14:25:43 +05:30
|
|
|
const row = await findAndTraverseToPath(path);
|
|
|
|
clickFileRowAction(row, 'Delete');
|
|
|
|
};
|
|
|
|
|
2021-02-22 17:27:13 +05:30
|
|
|
export const renameFile = async (path, newPath) => {
|
|
|
|
const row = await findAndTraverseToPath(path);
|
|
|
|
clickFileRowAction(row, 'Rename/Move');
|
|
|
|
|
|
|
|
await fillFileNameModal(newPath, 'Rename file');
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
export const closeFile = async (path) => {
|
2021-02-22 17:27:13 +05:30
|
|
|
const button = await screen.getByLabelText(`Close ${path}`, {
|
|
|
|
selector: '.multi-file-tabs button',
|
|
|
|
});
|
|
|
|
|
|
|
|
button.click();
|
|
|
|
};
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
/**
|
|
|
|
* Fill out and submit the commit form in the Web IDE
|
|
|
|
*
|
|
|
|
* @param {Object} options - Used to fill out the commit form in the IDE
|
|
|
|
* @param {Boolean} options.newBranch - Flag for the "Create a new branch" radio.
|
|
|
|
* @param {Boolean} options.newMR - Flag for the "Start a new merge request" checkbox.
|
|
|
|
* @param {String} options.newBranchName - Value to put in the new branch name input field. The Web IDE supports leaving this field blank.
|
|
|
|
*/
|
|
|
|
export const commit = async ({ newBranch = false, newMR = false, newBranchName = '' } = {}) => {
|
2021-02-22 17:27:13 +05:30
|
|
|
switchLeftSidebarTab('Commit');
|
2021-01-03 14:25:43 +05:30
|
|
|
screen.getByTestId('begin-commit-button').click();
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
if (!newBranch) {
|
|
|
|
const option = await screen.findByLabelText(/Commit to .+ branch/);
|
|
|
|
option.click();
|
|
|
|
} else {
|
|
|
|
const option = await screen.findByLabelText('Create a new branch');
|
|
|
|
option.click();
|
|
|
|
|
|
|
|
const branchNameInput = await screen.findByTestId('ide-new-branch-name');
|
|
|
|
fireEvent.input(branchNameInput, { target: { value: newBranchName } });
|
|
|
|
|
|
|
|
const mrCheck = await screen.findByLabelText('Start a new merge request');
|
|
|
|
if (Boolean(mrCheck.checked) !== newMR) {
|
|
|
|
mrCheck.click();
|
|
|
|
}
|
|
|
|
}
|
2021-01-03 14:25:43 +05:30
|
|
|
|
|
|
|
screen.getByText('Commit').click();
|
|
|
|
};
|