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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
|
import {
findAllByText,
fireEvent,
getByLabelText,
findByTestId,
getByText,
screen,
findByText,
} from '@testing-library/dom';
const isFolderRowOpen = row => row.matches('.folder.is-open');
const getLeftSidebar = () => screen.getByTestId('left-sidebar');
export const switchLeftSidebarTab = name => {
const sidebar = getLeftSidebar();
const button = getByLabelText(sidebar, name);
button.click();
};
export const getStatusBar = () => document.querySelector('.ide-status-bar');
export const waitForMonacoEditor = () =>
new Promise(resolve => window.monaco.editor.onDidCreateEditor(resolve));
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'));
export const findAndSetEditorValue = async value => {
const editor = await findMonacoEditor();
const uri = editor.getAttribute('data-uri');
window.monaco.editor.getModel(uri).setValue(value);
};
export const getEditorValue = async () => {
const editor = await findMonacoEditor();
const uri = editor.getAttribute('data-uri');
return window.monaco.editor.getModel(uri).getValue();
};
const findTreeBody = () => screen.findByTestId('ide-tree-body', {}, { timeout: 5000 });
const findRootActions = () => screen.findByTestId('ide-root-actions', {}, { timeout: 7000 });
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' });
return children.map(x => x.closest('.file-row')).find(x => x.dataset.level === index.toString());
};
const openFileRow = row => {
if (!row || isFolderRowOpen(row)) {
return;
}
row.click();
};
const findAndTraverseToPath = async (path, index = 0, row = null) => {
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();
};
const fillFileNameModal = async (value, submitText = 'Create file') => {
const modal = await screen.findByTestId('ide-new-entry');
const nameField = await findByTestId(modal, 'file-name-field');
fireEvent.input(nameField, { target: { value } });
const createButton = getByText(modal, submitText, { selector: 'button' });
createButton.click();
};
const findAndClickRootAction = async name => {
const container = await findRootActions();
const button = getByLabelText(container, name);
button.click();
};
export const clickPreviewMarkdown = () => {
screen.getByText('Preview Markdown').click();
};
export const openFile = async path => {
const row = await findAndTraverseToPath(path);
openFileRow(row);
};
export const waitForTabToOpen = fileName =>
findByText(document.querySelector('.multi-file-edit-pane'), fileName);
export const createFile = async (path, content) => {
const parentPath = path
.split('/')
.slice(0, -1)
.join('/');
const parentRow = await findAndTraverseToPath(parentPath);
if (parentRow) {
clickFileRowAction(parentRow, 'New file');
} else {
await findAndClickRootAction('New file');
}
await fillFileNameModal(path);
await findAndSetEditorValue(content);
};
export const getFilesList = () => {
return screen.getAllByTestId('file-row-name-container').map(e => e.textContent.trim());
};
export const deleteFile = async path => {
const row = await findAndTraverseToPath(path);
clickFileRowAction(row, 'Delete');
};
export const renameFile = async (path, newPath) => {
const row = await findAndTraverseToPath(path);
clickFileRowAction(row, 'Rename/Move');
await fillFileNameModal(newPath, 'Rename file');
};
export const closeFile = async path => {
const button = await screen.getByLabelText(`Close ${path}`, {
selector: '.multi-file-tabs button',
});
button.click();
};
export const commit = async () => {
switchLeftSidebarTab('Commit');
screen.getByTestId('begin-commit-button').click();
await screen.findByLabelText(/Commit to .+ branch/).then(x => x.click());
screen.getByText('Commit').click();
};
|
