Commit 0feb3a71 authored by Zack Cuddy's avatar Zack Cuddy Committed by Phil Hughes

Init Geo Node Form in Vue

Feature flag on DOM

Backend Tests

Frontend tests

Lint and locale

Duplicate code
parent fa883510
<script>
export default {
name: 'GeoNodeFormApp',
};
</script>
<template>
<article class="geo-node-form-container">
<h3 class="page-title">{{ __('Geo Node Form') }}</h3>
</article>
</template>
import Vue from 'vue';
import Translate from '~/vue_shared/translate';
import GeoNodeFormApp from './components/app.vue';
Vue.use(Translate);
export default () => {
const el = document.getElementById('js-geo-node-form');
return new Vue({
el,
components: {
GeoNodeFormApp,
},
render(createElement) {
return createElement('geo-node-form-app');
},
});
};
import initForm from '../shared/init_form';
import initGeoNodeForm from 'ee/geo_node_form';
document.addEventListener('DOMContentLoaded', initForm);
if (gon.features?.enableGeoNodeFormJs) {
document.addEventListener('DOMContentLoaded', initGeoNodeForm);
} else {
document.addEventListener('DOMContentLoaded', initForm);
}
import initForm from '../shared/init_form';
import initGeoNodeForm from 'ee/geo_node_form';
document.addEventListener('DOMContentLoaded', initForm);
if (gon.features?.enableGeoNodeFormJs) {
document.addEventListener('DOMContentLoaded', initGeoNodeForm);
} else {
document.addEventListener('DOMContentLoaded', initForm);
}
......@@ -3,6 +3,7 @@
class Admin::Geo::NodesController < Admin::Geo::ApplicationController
before_action :check_license!, except: :index
before_action :load_node, only: [:edit, :update]
before_action :push_feature_flag, except: :index
# rubocop: disable CodeReuse/ActiveRecord
def index
......@@ -66,4 +67,8 @@ class Admin::Geo::NodesController < Admin::Geo::ApplicationController
def load_node
@node = GeoNode.find(params[:id])
end
def push_feature_flag
push_frontend_feature_flag(:enable_geo_node_form_js)
end
end
- page_title 'Edit Geo Node'
%h3.page-title
Edit Geo Node
- page_title _('Edit Geo Node')
= form_for [:admin, @node], html: { class: 'js-geo-node-form' } do |f|
= render partial: 'form', locals: { form: f, geo_node: @node }
.form-actions
= f.submit 'Save changes', class: 'btn btn-success'
= link_to 'Cancel', admin_geo_nodes_path, class: 'btn btn-cancel'
- if Feature.enabled?(:enable_geo_node_form_js)
#js-geo-node-form
- else
%h3.page-title
Edit Geo Node
%hr
= form_for [:admin, @node], html: { class: 'js-geo-node-form' } do |f|
= render partial: 'form', locals: { form: f, geo_node: @node }
.form-actions
= f.submit 'Save changes', class: 'btn btn-success'
= link_to 'Cancel', admin_geo_nodes_path, class: 'btn btn-cancel'
%hr
- page_title 'New node'
- page_title _('New Geo Node')
%h2.page-title
%span.title-text
New node
%hr.page-title-separator
- if Feature.enabled?(:enable_geo_node_form_js)
#js-geo-node-form
- else
%h2.page-title
%span.title-text
New node
%hr.page-title-separator
- if Gitlab::Geo.license_allows?
= form_for [:admin, @node], as: :geo_node, url: admin_geo_nodes_path, html: { class: 'js-geo-node-form' } do |f|
= render partial: 'form', locals: { form: f, geo_node: @node }
.form-actions
= f.submit 'Add Node', class: 'btn btn-success qa-add-node-button'
= link_to 'Cancel', admin_geo_nodes_path, class: 'btn btn-cancel'
- if Gitlab::Geo.license_allows?
= form_for [:admin, @node], as: :geo_node, url: admin_geo_nodes_path, html: { class: 'js-geo-node-form' } do |f|
= render partial: 'form', locals: { form: f, geo_node: @node }
.form-actions
= f.submit 'Add Node', class: 'btn btn-success qa-add-node-button'
= link_to 'Cancel', admin_geo_nodes_path, class: 'btn btn-cancel'
......@@ -7,6 +7,7 @@ describe 'admin Geo Nodes', :js, :geo do
before do
allow(Gitlab::Geo).to receive(:license_allows?).and_return(true)
stub_feature_flags(enable_geo_node_form_js: false)
sign_in(create(:admin))
end
......@@ -152,12 +153,7 @@ describe 'admin Geo Nodes', :js, :geo do
it 'updates an existing Geo Node' do
geo_node.update(primary: true)
visit admin_geo_nodes_path
wait_for_requests
page.within(find('.geo-node-actions', match: :first)) do
page.click_link('Edit')
end
visit edit_admin_geo_node_path(geo_node)
fill_in 'URL', with: 'http://newsite.com'
fill_in 'Internal URL', with: 'http://internal-url.com'
......@@ -217,4 +213,46 @@ describe 'admin Geo Nodes', :js, :geo do
end
end
end
describe 'Feature(:enable_geo_node_form_js)' do
describe 'when true' do
before do
stub_feature_flags(enable_geo_node_form_js: true)
end
it '`/new` uses the Vue form instead of the HAML partial' do
visit new_admin_geo_node_path
expect(page).to have_css(".geo-node-form-container")
expect(page).not_to have_css(".js-geo-node-form")
end
it '`/edit` uses the Vue form instead of the HAML partial' do
visit edit_admin_geo_node_path(geo_node)
expect(page).to have_css(".geo-node-form-container")
expect(page).not_to have_css(".js-geo-node-form")
end
end
describe 'when false' do
before do
stub_feature_flags(enable_geo_node_form_js: false)
end
it '`/new` uses the HAML partial instead of the Vue form' do
visit new_admin_geo_node_path
expect(page).not_to have_css(".geo-node-form-container")
expect(page).to have_css(".js-geo-node-form")
end
it '`/edit` uses the HAML partial instead of the Vue form' do
visit edit_admin_geo_node_path(geo_node)
expect(page).not_to have_css(".geo-node-form-container")
expect(page).to have_css(".js-geo-node-form")
end
end
end
end
import { shallowMount } from '@vue/test-utils';
import GeoNodeFormApp from 'ee/geo_node_form/components/app.vue';
describe('GeoNodeFormApp', () => {
let wrapper;
const createComponent = () => {
wrapper = shallowMount(GeoNodeFormApp);
};
afterEach(() => {
wrapper.destroy();
});
const findGeoNodeFormContainer = () => wrapper.find('.geo-node-form-container');
describe('render', () => {
beforeEach(() => {
createComponent();
});
it('the node form container', () => {
expect(findGeoNodeFormContainer().exists()).toBe(true);
});
it('`Geo Node Form` header text', () => {
expect(findGeoNodeFormContainer().text()).toContain('Geo Node Form');
});
});
});
......@@ -6576,6 +6576,9 @@ msgstr ""
msgid "Edit Deploy Key"
msgstr ""
msgid "Edit Geo Node"
msgstr ""
msgid "Edit Group Hook"
msgstr ""
......@@ -8303,6 +8306,9 @@ msgstr ""
msgid "Geo Designs"
msgstr ""
msgid "Geo Node Form"
msgstr ""
msgid "Geo Nodes"
msgstr ""
......@@ -11969,6 +11975,9 @@ msgstr ""
msgid "New Environment"
msgstr ""
msgid "New Geo Node"
msgstr ""
msgid "New Group"
msgstr ""
......
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