diff options
Diffstat (limited to 'spec/frontend_integration/ide/ide_integration_spec.js')
-rw-r--r-- | spec/frontend_integration/ide/ide_integration_spec.js | 136 |
1 files changed, 96 insertions, 40 deletions
diff --git a/spec/frontend_integration/ide/ide_integration_spec.js b/spec/frontend_integration/ide/ide_integration_spec.js index 1f5c1d38450..dacc538d5ba 100644 --- a/spec/frontend_integration/ide/ide_integration_spec.js +++ b/spec/frontend_integration/ide/ide_integration_spec.js @@ -1,61 +1,28 @@ -import { TEST_HOST } from 'helpers/test_constants'; import { waitForText } from 'helpers/wait_for_text'; import waitForPromises from 'helpers/wait_for_promises'; import { useOverclockTimers } from 'test_helpers/utils/overclock_timers'; import { createCommitId } from 'test_helpers/factories/commit_id'; -import { initIde } from '~/ide'; -import extendStore from '~/ide/stores/extend'; -import * as ideHelper from './ide_helper'; - -const TEST_DATASET = { - emptyStateSvgPath: '/test/empty_state.svg', - noChangesStateSvgPath: '/test/no_changes_state.svg', - committedStateSvgPath: '/test/committed_state.svg', - pipelinesEmptyStateSvgPath: '/test/pipelines_empty_state.svg', - promotionSvgPath: '/test/promotion.svg', - ciHelpPagePath: '/test/ci_help_page', - webIDEHelpPagePath: '/test/web_ide_help_page', - clientsidePreviewEnabled: 'true', - renderWhitespaceInCode: 'false', - codesandboxBundlerUrl: 'test/codesandbox_bundler', -}; +import * as ideHelper from './helpers/ide_helper'; +import startWebIDE from './helpers/start'; describe('WebIDE', () => { useOverclockTimers(); let vm; - let root; + let container; beforeEach(() => { - root = document.createElement('div'); - document.body.appendChild(root); - - global.jsdom.reconfigure({ - url: `${TEST_HOST}/-/ide/project/gitlab-test/lorem-ipsum`, - }); + setFixtures('<div class="webide-container"></div>'); + container = document.querySelector('.webide-container'); }); afterEach(() => { vm.$destroy(); vm = null; - root.remove(); - }); - - const createComponent = () => { - const el = document.createElement('div'); - Object.assign(el.dataset, TEST_DATASET); - root.appendChild(el); - vm = initIde(el, { extendStore }); - }; - - it('runs', () => { - createComponent(); - - expect(root).toMatchSnapshot(); }); it('user commits changes', async () => { - createComponent(); + vm = startWebIDE(container); await ideHelper.createFile('foo/bar/test.txt', 'Lorem ipsum dolar sit'); await ideHelper.deleteFile('foo/bar/.gitkeep'); @@ -89,7 +56,7 @@ describe('WebIDE', () => { }); it('user adds file that starts with +', async () => { - createComponent(); + vm = startWebIDE(container); await ideHelper.createFile('+test', 'Hello world!'); await ideHelper.openFile('+test'); @@ -101,4 +68,93 @@ describe('WebIDE', () => { const tabs = Array.from(document.querySelectorAll('.multi-file-tab')); expect(tabs.map(x => x.textContent.trim())).toEqual(['+test']); }); + + describe('editor info', () => { + let statusBar; + let editor; + + const waitForEditor = async () => { + editor = await ideHelper.waitForMonacoEditor(); + }; + + const changeEditorPosition = async (lineNumber, column) => { + editor.setPosition({ lineNumber, column }); + + await vm.$nextTick(); + }; + + beforeEach(async () => { + vm = startWebIDE(container); + + await ideHelper.openFile('README.md'); + editor = await ideHelper.waitForMonacoEditor(); + + statusBar = ideHelper.getStatusBar(); + }); + + it('shows line position and type', () => { + expect(statusBar).toHaveText('1:1'); + expect(statusBar).toHaveText('markdown'); + }); + + it('persists viewer', async () => { + const markdownPreview = 'test preview_markdown result'; + mockServer.post('/:namespace/:project/preview_markdown', () => ({ + body: markdownPreview, + })); + + await ideHelper.openFile('README.md'); + ideHelper.clickPreviewMarkdown(); + + const el = await waitForText(markdownPreview); + expect(el).toHaveText(markdownPreview); + + // Need to wait for monaco editor to load so it doesn't through errors on dispose + await ideHelper.openFile('.gitignore'); + await ideHelper.waitForMonacoEditor(); + await ideHelper.openFile('README.md'); + await ideHelper.waitForMonacoEditor(); + + expect(el).toHaveText(markdownPreview); + }); + + describe('when editor position changes', () => { + beforeEach(async () => { + await changeEditorPosition(4, 10); + }); + + it('shows new line position', () => { + expect(statusBar).not.toHaveText('1:1'); + expect(statusBar).toHaveText('4:10'); + }); + + it('updates after rename', async () => { + await ideHelper.renameFile('README.md', 'READMEZ.txt'); + await waitForEditor(); + + expect(statusBar).toHaveText('1:1'); + expect(statusBar).toHaveText('plaintext'); + }); + + it('persists position after opening then rename', async () => { + await ideHelper.openFile('files/js/application.js'); + await waitForEditor(); + await ideHelper.renameFile('README.md', 'READING_RAINBOW.md'); + await ideHelper.openFile('READING_RAINBOW.md'); + await waitForEditor(); + + expect(statusBar).toHaveText('4:10'); + expect(statusBar).toHaveText('markdown'); + }); + + it('persists position after closing', async () => { + await ideHelper.closeFile('README.md'); + await ideHelper.openFile('README.md'); + await waitForEditor(); + + expect(statusBar).toHaveText('4:10'); + expect(statusBar).toHaveText('markdown'); + }); + }); + }); }); |