Add test for Group Management

src/containers/group-management/group-detail.tsx

@@ -264,6 +264,7 @@ class GroupDetail extends React.Component<RouteComponentProps, IState> {
               style={{ marginTop: '16px' }}
               alignItems={{ default: 'alignItemsCenter' }}
               key={group.name}
+              className={group.name}
             >
               <FlexItem style={{ minWidth: '200px' }}>{group.name}</FlexItem>
               <FlexItem grow={{ default: 'grow' }}>

src/containers/group-management/group-list.tsx

@@ -356,6 +356,7 @@ class GroupList extends React.Component<RouteComponentProps, IState> {
         <td>
           {!!user && user.model_permissions.delete_group && (
             <Button
+              aria-label={'Delete'}
               key='delete'
               variant='danger'
               onClick={() =>

test/cypress/integration/group_management.js

@@ -0,0 +1,45 @@
+describe('Hub Group Management Tests', () => {
+    var host = Cypress.env("host");
+    var adminUsername = Cypress.env("username");
+    var adminPassword = Cypress.env("password");
+
+    beforeEach(() => {
+        cy.visit(host);
+    });
+
+    it('admin user can create/delete a group', () => {
+        let name = 'testGroup';
+        cy.login(adminUsername, adminPassword);
+        cy.createGroup(name);
+        cy.contains(name).should('exist');
+        cy.deleteGroup(name);
+        cy.contains(name).should('not.exist');
+    });
+
+    it('admin user can add/remove a user to/from a group', () => {
+        let groupName = 'testGroup';
+        let userName = 'testUser';
+        cy.login(adminUsername, adminPassword);
+        cy.createGroup(groupName);
+        cy.createUser(userName);
+        cy.addUserToGroup(groupName, userName);
+        cy.removeUserFromGroup(groupName, userName);
+        cy.deleteGroup(groupName);
+        cy.deleteUser(userName);
+    });
+
+    it('admin user can add/remove permissions to/from a group', () => {
+        let name = 'testGroup';
+        let permissionTypes = [ 'namespaces', 'collections', 'users', 'groups', 'remotes' ];
+        cy.login(adminUsername, adminPassword);
+        cy.createGroup(name);
+        cy.contains(name).should('exist');
+        cy.addAllPermissions(name);
+        permissionTypes.forEach(permGroup => cy.get(`.pf-l-flex.pf-m-align-items-center.${permGroup}  [placeholder="No permission"]`).should('not.exist'));;
+        cy.removeAllPermissions(name);
+        permissionTypes.forEach(permGroup => cy.get(`.pf-l-flex.pf-m-align-items-center.${permGroup}  [placeholder="No permission"]`).should('exist'));;
+        cy.deleteGroup(name);
+        cy.contains(name).should('not.exist');
+    });
+
+});

test/cypress/support/commands.js

@@ -40,7 +40,6 @@ Cypress.Commands.add('containsnear', {}, (...args) => {
 Cypress.Commands.add('menuItem', {}, (name) => {
     return cy.contains('#page-sidebar a', name);
 });
-
 Cypress.Commands.add('logout', {}, () => {
     cy.server();
     cy.route('GET', Cypress.env('prefix') + '_ui/v1/me/').as('me');
@@ -59,15 +58,15 @@ Cypress.Commands.add('login', {}, (username, password) => {
     cy.wait('@me');
 });
 
-Cypress.Commands.add('createUser', {}, (username, password, firstName = null, lastName = null, email = null) => {
+Cypress.Commands.add('createUser', {}, (username, password = null, firstName = null, lastName = null, email = null) => {
     cy.contains('#page-sidebar a', 'Users').click();
 
     const user = {
         firstName: firstName || 'First Name',
         lastName: lastName || 'Last Name',
         username: username,
         email: email || 'firstName@example.com',
-        password: password,
+        password: password || 'I am a complicated passw0rd',
     };
     cy.contains('Create user').click();
     cy.get('#first_name').type(user.firstName);
@@ -77,7 +76,102 @@ Cypress.Commands.add('createUser', {}, (username, password, firstName = null, la
     cy.get('#password').type(user.password);
     cy.get('#password-confirm').type(user.password);
 
+    cy.server();
+    cy.route('POST', Cypress.env('prefix') + '_ui/v1/users/').as('createUser');
+
     cy.contains('Save').click();
+    cy.wait('@createUser');
+});
+
+Cypress.Commands.add('createGroup', {}, (name => {
+    cy.contains('#page-sidebar a', 'Groups').click();
+
+    cy.contains('Create').click();
+
+    cy.contains('div', 'Name *').findnear('input').first().type(name);
+
+    cy.server();
+    cy.route('POST', Cypress.env('prefix') + '_ui/v1/groups/').as('createGroup');
+    cy.contains('[role=dialog] button', 'Create').click();
+    cy.wait('@createGroup');
+});
+
+Cypress.Commands.add('addPermissions', {}, (groupName, permissions) => {
+    cy.server();
+    cy.route('GET', Cypress.env('prefix') + '_ui/v1/groups/*/model-permissions/*').as('groups');
+    cy.contains('#page-sidebar a', 'Groups').click();
+    cy.get(`[aria-labelledby=${groupName}] a`).click();
+    cy.wait('@groups');
+    cy.contains('button', 'Edit').click();
+    permissions.forEach(permissionElement => {
+        // closes previously open dropdowns
+        cy.get('h1').click();
+        cy.get(`.pf-l-flex.pf-m-align-items-center.${permissionElement.group} [aria-label="Options menu"]`).click();
+        permissionElement.permissions.forEach(permission => {
+            cy.contains('button', permission).click();
+        })
+    });
+    cy.contains('button', 'Save').click();
+});
+
+Cypress.Commands.add('removePermissions', {}, (groupName, permissions) => {
+    cy.contains('#page-sidebar a', 'Groups').click();
+    cy.get(`[aria-labelledby=${groupName}] a`).click();
+    cy.contains('button', 'Edit').click();
+    permissions.forEach(permissionElement => {
+        // closes previously open dropdowns
+        cy.get('h1').click();
+        if (permissionElement.permissions.length > 3) {
+            // Make sure all permissions are visible
+            cy.containsnear(`.pf-l-flex.pf-m-align-items-center.${permissionElement.group} `, '1 more').first().click();
+        }
+        permissionElement.permissions.forEach(permission => {
+            cy.containsnear(`.pf-l-flex.pf-m-align-items-center.${permissionElement.group} `, permission).findnear('button').first().click();
+        });
+    });
+    cy.contains('button', 'Save').click();
+});
+
+const allPerms = [{
+    group: 'namespaces', permissions: ['Add namespace', 'Change namespace', 'Upload to namespace']
+}, {
+    group: 'collections', permissions: ['Modify Ansible repo content']
+},{
+    group: 'users', permissions: ['View user', 'Delete user', 'Add user', 'Change user']
+},{
+    group: 'groups', permissions: ['View group', 'Delete group', 'Add group', 'Change group']
+},{
+    group: 'remotes', permissions: ['Change collection remote', 'View collection remote']
+}];
+
+Cypress.Commands.add('removeAllPermissions', {}, (groupName) => {
+    cy.removePermissions(groupName, allPerms);
+});
+
+Cypress.Commands.add('addAllPermissions', {}, (groupName) => {
+    cy.addPermissions(groupName, allPerms);
+});
+
+Cypress.Commands.add('addUserToGroup', {}, (groupName, userName) => {
+    cy.contains('#page-sidebar a', 'Groups').click();
+    cy.get(`[aria-labelledby=${groupName}] a`).click();
+    cy.contains('button', 'Users').click();
+    cy.contains('button', 'Add').click();
+    cy.get('input.pf-c-select__toggle-typeahead').type(userName);
+    cy.contains('button', userName).click();
+    // closes previously open dropdown
+    cy.get('[aria-label="Options menu"]').click();
+    cy.contains('footer > button', 'Add').click();
+    cy.get(`[aria-labelledby=${userName}]`).should('exist');
+});
+
+Cypress.Commands.add('removeUserFromGroup', {}, (groupName, userName) => {
+    cy.contains('#page-sidebar a', 'Groups').click();
+    cy.get(`[aria-labelledby=${groupName}] a`).click();
+    cy.contains('button', 'Users').click();
+    cy.get(`[aria-labelledby=${userName}] [aria-label=Actions]`).click();
+    cy.containsnear(`[aria-labelledby=${userName}] [aria-label=Actions]`, 'Remove').click();
+    cy.contains(userName).should('not.exist');
 });
 
 Cypress.Commands.add('deleteUser', {}, (username) => {
@@ -88,8 +182,27 @@ Cypress.Commands.add('deleteUser', {}, (username) => {
     cy.login(adminUsername, adminPassword);
 
     cy.contains('#page-sidebar a', 'Users').click();
-
+    cy.server();
+    cy.route('DELETE', Cypress.env('prefix') + '_ui/v1/users/**').as('deleteUser');
     cy.get(`[aria-labelledby=${username}] [aria-label=Actions]`).click();
     cy.containsnear(`[aria-labelledby=${username}] [aria-label=Actions]`, 'Delete').click();
     cy.contains('[role=dialog] button', 'Delete').click();
+    cy.wait('@deleteUser');
+    cy.get('@deleteUser').should('have.property', 'status', 204);
+});
+
+Cypress.Commands.add('deleteGroup', {}, (name) => {
+    var adminUsername = Cypress.env('username');
+    var adminPassword = Cypress.env('password');
+
+    cy.logout();
+    cy.login(adminUsername, adminPassword);
+
+    cy.contains('#page-sidebar a', 'Groups').click();
+    cy.server();
+    cy.route('DELETE', Cypress.env('prefix') + '_ui/v1/groups/**').as('deleteGroup');
+    cy.get(`[aria-labelledby=${name}] [aria-label=Delete]`).click();
+    cy.contains('[role=dialog] button', 'Delete').click();
+    cy.wait('@deleteGroup');
+    cy.get('@deleteGroup').should('have.property', 'status', 204);
 });