Commit d0beb755 authored by Douglas Lovell's avatar Douglas Lovell Committed by Alfredo Sumaran

Add a name field to the group edit form

Enables user specification of group name vs. name inferred from group path.

Cause new group form to copy name from path

Adds some new page-specific javascript that copies entry from the
group path field to the group name field when the group name field
is initially empty.

Remove duplicate group name entry field on group edit form

This corrects the duplicated name entry field and tests that the
JavaScript does not update the group name field if the user
edits the group path.  (Editing the group path is not recommended
in any case, but it is possible.)

Address eslint errors in group.js

Enable group name copy with dispatch and explore group creation

The dispatch and explore group creation forms require the group.js
asset, and their tests now require testing against poltergeist

Update workflow new group instruction

Update the gitlab basics group creation document

Add a change log entry

Remove unused variable for eslint
parent 3d1cade1
......@@ -37,6 +37,7 @@
import Issue from './issue';
import BindInOut from './behaviors/bind_in_out';
import Group from './group';
import GroupName from './group_name';
import GroupsList from './groups_list';
import ProjectsList from './projects_list';
......@@ -271,8 +272,9 @@ const ShortcutsBlob = require('./shortcuts_blob');
case 'groups:create':
case 'admin:groups:create':
case 'groups:new':
case 'admin:groups:new':
new Group();
new GroupAvatar();
case 'groups:edit':
case 'admin:groups:edit':
new GroupAvatar();
export default class Group {
constructor() {
this.groupPath = $('#group_path');
this.groupName = $('#group_name');
this.updateHandler = this.update.bind(this);
this.resetHandler = this.reset.bind(this);
if (this.groupName.val() === '') {
this.groupPath.on('keyup', this.updateHandler);
this.groupName.on('keydown', this.resetHandler);
update() {
reset() {'keyup', this.updateHandler);'keydown', this.resetHandler);
- content_for :page_specific_javascripts do
= page_specific_javascript_bundle_tag('group')
- parent = params[:parent_id] || @group.parent_id)
- group_path = root_url
- group_path << parent.full_path + '/' if parent
- if @group.persisted?
= f.label :name, class: 'control-label' do
Group name
= f.text_field :name, placeholder: 'open-source', class: 'form-control'
= f.label :path, class: 'control-label' do
......@@ -20,7 +16,7 @@
= f.text_field :path, placeholder: 'open-source', class: 'form-control',
autofocus: local_assigns[:autofocus] || false, required: true,
pattern: Gitlab::Regex::NAMESPACE_REGEX_STR_JS,
title: 'Please choose a group name with no special characters.',
title: 'Please choose a group path with no special characters.',
"data-bind-in" => "#{'create_chat_team' if Gitlab.config.mattermost.enabled}"
- if parent
= f.hidden_field :parent_id, value:
......@@ -33,6 +29,14 @@
%li It will change web url for access group and group projects.
%li It will change the git path to repositories under this group.
= f.label :name, class: 'control-label' do
Group name
= f.text_field :name, class: 'form-control',
required: true,
title: 'You can choose a descriptive name different from the path.'
= f.label :description, class: 'control-label'
title: Add a name field to the group form
merge_request: 9891
author: Douglas Lovell
......@@ -49,6 +49,7 @@ var config = {
users: './users/users_bundle.js',
vue_pipelines: './vue_pipelines_index/index.js',
issue_show: './issue_show/index.js',
group: './group.js',
output: {
......@@ -25,6 +25,8 @@ To create a group:
1. Set the "Group path" which will be the namespace under which your projects
will be hosted (path can contain only letters, digits, underscores, dashes
and dots; it cannot start with dashes or end in dot).
1. The "Group name" will populate with the path. Optionally, you can change
it. This is the name that will display in the group views.
1. Optionally, you can add a description so that others can briefly understand
what this group is about.
1. Optionally, choose and avatar for your project.
......@@ -11,9 +11,9 @@ You can create a group by going to the 'Groups' tab of the GitLab dashboard and
![Click the 'New group' button in the 'Groups' tab](groups/new_group_button.png)
Next, enter the name (required) and the optional description and group avatar.
Next, enter the path and name (required) and the optional description and group avatar.
![Fill in the name for your new group](groups/new_group_form.png)
![Fill in the path for your new group](groups/new_group_form.png)
When your group has been created you are presented with the group dashboard feed, which will be empty.
......@@ -25,13 +25,22 @@ feature 'Admin Groups', feature: true do
visit admin_groups_path
click_link "New group"
fill_in 'group_path', with: 'gitlab'
fill_in 'group_description', with: 'Group description'
path_component = 'gitlab'
group_name = 'GitLab group name'
group_description = 'Description of group for GitLab'
fill_in 'group_path', with: path_component
fill_in 'group_name', with: group_name
fill_in 'group_description', with: group_description
click_button "Create group"
expect(current_path).to eq admin_group_path(Group.find_by(path: 'gitlab'))
expect(page).to have_content('Group: gitlab')
expect(page).to have_content('Group description')
expect(current_path).to eq admin_group_path(Group.find_by(path: path_component))
content = page.find('div#content-body')
h3_texts = content.all('h3').collect(&:text).join("\n")
expect(h3_texts).to match group_name
li_texts = content.all('li').collect(&:text).join("\n")
expect(li_texts).to match group_name
expect(li_texts).to match path_component
expect(li_texts).to match group_description
scenario 'shows the visibility level radio populated with the default value' do
......@@ -39,6 +48,15 @@ feature 'Admin Groups', feature: true do
scenario 'when entered in group path, it auto filled the group name', js: true do
visit admin_groups_path
click_link "New group"
group_path = 'gitlab'
fill_in 'group_path', with: group_path
name_field = find('input#group_name')
expect(name_field.value).to eq group_path
describe 'show a group' do
......@@ -59,6 +77,17 @@ feature 'Admin Groups', feature: true do
scenario 'edit group path does not change group name', js: true do
group = create(:group, :private)
visit admin_group_edit_path(group)
name_field = find('input#group_name')
original_name = name_field.value
fill_in 'group_path', with: 'this-new-path'
expect(name_field.value).to eq original_name
describe 'add user into a group', js: true do
......@@ -5,16 +5,18 @@ RSpec.describe 'Dashboard Group', feature: true do
it 'creates new grpup' do
it 'creates new group', js: true do
visit dashboard_groups_path
click_link 'New group'
new_path = 'Samurai'
new_description = 'Tokugawa Shogunate'
fill_in 'group_path', with: 'Samurai'
fill_in 'group_description', with: 'Tokugawa Shogunate'
fill_in 'group_path', with: new_path
fill_in 'group_description', with: new_description
click_button 'Create group'
expect(current_path).to eq group_path(Group.find_by(name: 'Samurai'))
expect(page).to have_content('Samurai')
expect(page).to have_content('Tokugawa Shogunate')
expect(current_path).to eq group_path(Group.find_by(name: new_path))
expect(page).to have_content(new_path)
expect(page).to have_content(new_description)
......@@ -83,7 +83,7 @@ feature 'Group', feature: true do
describe 'create a nested group' do
describe 'create a nested group', js: true do
let(:group) { create(:group, path: 'foo') }
context 'as admin' do
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment