Add test for not showing the delete button for the first acl...

Also, change the action group page objects to use data-test attributes
instead of last-child which isn't reliable (and stay consistent)

ui-v2/app/templates/dc/acls/index.hbs

@@ -39,17 +39,17 @@
                         {{#action-group index=index onchange=(action change) checked=(if (eq checked index) 'checked')}}
                             <ul>
                                 <li>
-                                    <a href={{href-to 'dc.acls.edit' item.ID}}>Edit</a>
+                                    <a data-test-edit href={{href-to 'dc.acls.edit' item.ID}}>Edit</a>
                                 </li>
                                 <li>
-                                    <a onclick={{queue (action confirm 'use' item) (action change)}}>Use</a>
+                                    <a data-test-use onclick={{queue (action confirm 'use' item) (action change)}}>Use</a>
                                 </li>
                                 <li>
-                                    <a onclick={{action 'sendClone' item}}>Clone</a>
+                                    <a data-test-clone onclick={{action 'sendClone' item}}>Clone</a>
                                 </li>
 {{# if (not-eq item.ID 'anonymous') }}
                                 <li>
-                                    <a onclick={{action confirm 'delete' item}}>Delete</a>
+                                    <a data-test-delete onclick={{action confirm 'delete' item}}>Delete</a>
                                 </li>
 {{/if}}
                             </ul>

ui-v2/app/templates/dc/kv/index.hbs

@@ -51,10 +51,10 @@
                         {{#action-group index=index onchange=(action change) checked=(if (eq checked index) 'checked')}}
                             <ul>
                                 <li>
-                                    <a href={{href-to (if item.isFolder 'dc.kv.folder' 'dc.kv.edit') item.Key}}>{{if item.isFolder 'View' 'Edit'}}</a>
+                                    <a data-test-edit href={{href-to (if item.isFolder 'dc.kv.folder' 'dc.kv.edit') item.Key}}>{{if item.isFolder 'View' 'Edit'}}</a>
                                 </li>
                                 <li>
-                                    <a onclick={{action confirm 'delete' item}}>Delete</a>
+                                    <a data-test-delete onclick={{action confirm 'delete' item}}>Delete</a>
                                 </li>
                             </ul>
                         {{/action-group}}

ui-v2/tests/acceptance/dc/acls/index.feature

@@ -0,0 +1,14 @@
+@setupApplicationTest
+Feature: dc / acls / index: ACL List
+
+  Scenario:
+    Given 1 datacenter model with the value "dc-1"
+    And 3 acl models
+    When I visit the acls page for yaml
+    ---
+      dc: dc-1
+    ---
+    Then the url should be /dc-1/acls
+    And I click actions on the acls
+    Then I don't see delete on the acls
+    Then I see 3 acl models

ui-v2/tests/acceptance/steps/dc/acls/index-steps.js

@@ -0,0 +1,10 @@
+import steps from '../../steps';
+
+// step definitions that are shared between features should be moved to the
+// tests/acceptance/steps/steps.js file
+
+export default function(assert) {
+  return steps(assert).then('I should find a file', function() {
+    assert.ok(true, this.step);
+  });
+}

ui-v2/tests/pages/dc/acls/index.js

@@ -7,7 +7,7 @@ export default create({
     name: attribute('data-test-acl', '[data-test-acl]'),
     acl: clickable('a'),
     actions: clickable('label'),
-    delete: clickable('li:last-child a'),
+    delete: clickable('[data-test-delete]'),
     confirmDelete: clickable('button.type-delete'),
   }),
   filter: filter,

ui-v2/tests/pages/dc/kv/index.js

@@ -6,7 +6,7 @@ export default create({
     name: attribute('data-test-kv', '[data-test-kv]'),
     kv: clickable('a'),
     actions: clickable('label'),
-    delete: clickable('li:last-child a'),
+    delete: clickable('[data-test-delete]'),
     confirmDelete: clickable('button.type-delete'),
   }),
 });

ui-v2/tests/steps.js

@@ -227,7 +227,48 @@ export default function(assert) {
         });
       })
       .then(['I see $property on the $component'], function(property, component) {
-        assert.ok(currentPage[component][property], `Expected to see ${property} on ${component}`);
+        // TODO: Time to work on repetition
+        // Collection
+        var obj;
+        if (typeof currentPage[component].objectAt === 'function') {
+          obj = currentPage[component].objectAt(0);
+        } else {
+          obj = currentPage[component];
+        }
+        let _component;
+        if (typeof obj === 'function') {
+          const func = obj[property].bind(obj);
+          try {
+            _component = func();
+          } catch (e) {
+            console.error(e);
+            throw new Error(
+              `The '${property}' property on the '${component}' page object doesn't exist`
+            );
+          }
+        } else {
+          _component = obj;
+        }
+        assert.ok(_component[property], `Expected to see ${property} on ${component}`);
+      })
+      .then(["I don't see $property on the $component"], function(property, component) {
+        // Collection
+        var obj;
+        if (typeof currentPage[component].objectAt === 'function') {
+          obj = currentPage[component].objectAt(0);
+        } else {
+          obj = currentPage[component];
+        }
+        const func = obj[property].bind(obj);
+        assert.throws(
+          function() {
+            func();
+          },
+          function(e) {
+            return e.toString().indexOf('Element not found') !== -1;
+          },
+          `Expected to not see ${property} on ${component}`
+        );
       })
       .then(['I see $property'], function(property, component) {
         assert.ok(currentPage[property], `Expected to see ${property}`);