Commit f4772b37 authored by Clement Ho's avatar Clement Ho

Change CI template linter textarea with Ace Editor

parent 7c2a4699
(() => {
window.gl = window.gl || {};
class CILintEditor {
constructor() {
this.editor = window.ace.edit('ci-editor');
this.textarea = document.querySelector('#content');
this.editor.getSession().setMode('ace/mode/yaml');
this.editor.on('input', () => {
const content = this.editor.getSession().getValue();
this.textarea.value = content;
});
}
}
gl.CILintEditor = CILintEditor;
})();
...@@ -275,6 +275,10 @@ ...@@ -275,6 +275,10 @@
case 'projects:variables:index': case 'projects:variables:index':
new gl.ProjectVariables(); new gl.ProjectVariables();
break; break;
case 'ci:lints:create':
case 'ci:lints:show':
new gl.CILintEditor();
break;
} }
switch (path.first()) { switch (path.first()) {
case 'admin': case 'admin':
......
...@@ -9,3 +9,13 @@ ...@@ -9,3 +9,13 @@
color: $lint-correct-color; color: $lint-correct-color;
} }
} }
.ci-linter {
.ci-editor {
height: 400px;
}
.ci-template pre {
white-space: pre-wrap;
}
}
...@@ -2,19 +2,26 @@ ...@@ -2,19 +2,26 @@
- page_description "Validate your GitLab CI configuration file" - page_description "Validate your GitLab CI configuration file"
%h2 Check your .gitlab-ci.yml %h2 Check your .gitlab-ci.yml
%hr
.row .ci-linter
.row
= form_tag ci_lint_path, method: :post do = form_tag ci_lint_path, method: :post do
.form-group .form-group
= label_tag(:content, 'Content of .gitlab-ci.yml', class: 'control-label text-nowrap')
.col-sm-12 .col-sm-12
= text_area_tag(:content, @content, class: 'form-control span1', rows: 7, require: true) .file-holder
.file-title.clearfix
Content of .gitlab-ci.yml
#ci-editor.ci-editor #{@content}
= text_area_tag(:content, @content, class: 'hidden form-control span1', rows: 7, require: true)
.col-sm-12 .col-sm-12
.pull-left.prepend-top-10 .pull-left.prepend-top-10
= submit_tag('Validate', class: 'btn btn-success submit-yml') = submit_tag('Validate', class: 'btn btn-success submit-yml')
.row.prepend-top-20 .row.prepend-top-20
.col-sm-12 .col-sm-12
.results .results.ci-template
= render partial: 'create' if defined?(@status) = render partial: 'create' if defined?(@status)
- content_for :page_specific_javascripts do
= page_specific_javascript_tag('lib/ace.js')
---
title: Change CI template linter textarea with Ace Editor
merge_request: 8452
author: Didem Acet
require 'spec_helper' require 'spec_helper'
describe 'CI Lint' do describe 'CI Lint', js: true do
before do before do
login_as :user login_as :user
end end
...@@ -8,7 +8,10 @@ describe 'CI Lint' do ...@@ -8,7 +8,10 @@ describe 'CI Lint' do
describe 'YAML parsing' do describe 'YAML parsing' do
before do before do
visit ci_lint_path visit ci_lint_path
fill_in 'content', with: yaml_content # Ace editor updates a hidden textarea and it happens asynchronously
# `sleep 0.1` is actually needed here because of this
execute_script("ace.edit('ci-editor').setValue(" + yaml_content.to_json + ");")
sleep 0.1
click_on 'Validate' click_on 'Validate'
end end
...@@ -40,7 +43,7 @@ describe 'CI Lint' do ...@@ -40,7 +43,7 @@ describe 'CI Lint' do
let(:yaml_content) { 'my yaml content' } let(:yaml_content) { 'my yaml content' }
it 'loads previous YAML content after validation' do it 'loads previous YAML content after validation' do
expect(page).to have_field('content', with: 'my yaml content', type: 'textarea') expect(page).to have_field('content', with: 'my yaml content', visible: false, type: 'textarea')
end end
end end
end end
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment