add pagination to user e2e

lint

awx/ui/test/e2e/fixtures.js

@@ -306,17 +306,23 @@ const getUpdatedProject = (namespace = session) => {
  * @param [namespace] - Name prefix for associated dependencies.
  * @param [playbook] - Playbook for the job template.
  * @param [name] - Unique name prefix for the job template.
+ * @param [updateProject] - Choose whether to sync the project with its repository.
  * */
 const getJobTemplate = (
     namespace = session,
     playbook = 'hello_world.yml',
-    name = `${namespace}-job-template`
+    name = `${namespace}-job-template`,
+    updateProject = true
 ) => {
     const promises = [
         getInventory(namespace),
         getAdminMachineCredential(namespace),
-        getUpdatedProject(namespace)
     ];
+    if (updateProject) {
+        promises.push(getUpdatedProject(namespace));
+    } else {
+        promises.push(getProject(namespace));
+    }
 
     return Promise.all(promises)
         .then(([inventory, credential, project]) => getOrCreate('/job_templates/', {

awx/ui/test/e2e/tests/test-pagination.js

@@ -0,0 +1,82 @@
+import {
+    getJobTemplate,
+    getUpdatedProject,
+} from '../fixtures';
+
+import {
+    AWX_E2E_TIMEOUT_MEDIUM,
+} from '../settings';
+
+const namespace = 'test-pagination';
+
+module.exports = {
+
+    before: (client, done) => {
+        const resources = [getUpdatedProject(namespace)];
+
+        Promise.all(resources)
+            .then(() => {
+                for (let i = 0; i < 25; i++) {
+                    // Create enough job templates to make at least 2 pages of data
+                    resources.push(getJobTemplate(namespace, 'hello_world.yml', `${namespace}-job-template-${i}`, false));
+                }
+                Promise.all(resources)
+                    .then(() => done());
+            });
+
+        client
+            .login()
+            .waitForAngular()
+            .resizeWindow(1200, 1000);
+    },
+    'Test job template pagination': client => {
+        client
+            .useCss()
+            .findThenClick('[ui-sref="templates"]', 'css')
+            .waitForElementVisible('.SmartSearch-input')
+            .clearValue('.SmartSearch-input');
+        const firstRow = client
+            .getText('#templates_list .at-RowItem-header >  a:nth-of-type(1)');
+        client.findThenClick('.Paginate-controls--next', 'css');
+        client.expect.element('#templates_list .at-RowItem-header >  a:nth-of-type(1)')
+            .to.have.value.not.equals(firstRow).before(AWX_E2E_TIMEOUT_MEDIUM);
+        client.findThenClick('.Paginate-controls--previous', 'css');
+    },
+    'Test filtered job template pagination': client => {
+        client
+            .useCss()
+            .waitForElementVisible('.SmartSearch-input')
+            .clearValue('.SmartSearch-input')
+            .setValue(
+                '.SmartSearch-input',
+                [`name.istartswith:"${namespace}"`, client.Keys.ENTER]
+            );
+        client.useXpath().expect.element('//a[text()="test-pagination-job-template-0"]')
+            .to.be.visible.after(AWX_E2E_TIMEOUT_MEDIUM);
+        client
+            .useCss()
+            .waitForSpinny()
+            .findThenClick('.Paginate-controls--next', 'css');
+
+        // Default search sort uses alphanumeric sorting, so template #9 is last
+        client.useXpath().expect.element('//a[text()="test-pagination-job-template-9"]')
+            .to.be.visible.after(AWX_E2E_TIMEOUT_MEDIUM);
+        client.useXpath()
+            .expect.element('//*[contains(@class, "Paginate-controls--active") and text()="2"]')
+            .to.be.visible.after(AWX_E2E_TIMEOUT_MEDIUM);
+
+        client
+            .useCss()
+            .findThenClick('.Paginate-controls--previous', 'css');
+        // Default search sort uses alphanumeric sorting, so template #9 is last
+        client.useXpath().expect.element('//a[text()="test-pagination-job-template-0"]')
+            .to.be.visible.after(AWX_E2E_TIMEOUT_MEDIUM);
+        client.useXpath()
+            .expect.element('//*[contains(@class, "Paginate-controls--active") and text()="1"]')
+            .to.be.visible.after(AWX_E2E_TIMEOUT_MEDIUM);
+    },
+
+    after: client => {
+        client.end();
+    }
+};