Merge branch '28248-use-page' into 'master'

Use `page` query parameter instead of `p` to keep consistency with all URLs

Closes #28248

See merge request !9268

2 files changed, 23 insertions, 3 deletions

diff --git a/app/assets/javascripts/vue_pipelines_index/pipelines.js.es6 b/app/assets/javascripts/vue_pipelines_index/pipelines.js.es6
index dac364977d5..0265c00a414 100644
--- a/app/assets/javascripts/vue_pipelines_index/pipelines.js.es6
+++ b/app/assets/javascripts/vue_pipelines_index/pipelines.js.es6
@@ -29,7 +29,7 @@ const CommitPipelinesStoreWithTimeAgo = require('../commit/pipelines/pipelines_s
     },
     props: ['scope', 'store', 'svgs'],
     created() {
-      const pagenum = gl.utils.getParameterByName('p');
+      const pagenum = gl.utils.getParameterByName('page');
       const scope = gl.utils.getParameterByName('scope');
       if (pagenum) this.pagenum = pagenum;
       if (scope) this.apiScope = scope;
@@ -44,7 +44,6 @@ const CommitPipelinesStoreWithTimeAgo = require('../commit/pipelines/pipelines_s
     },
 
     methods: {
-
       /**
        * Changes the URL according to the pagination component.
        *
@@ -57,7 +56,7 @@ const CommitPipelinesStoreWithTimeAgo = require('../commit/pipelines/pipelines_s
        */
       change(pagenum, apiScope) {
         if (!apiScope) apiScope = 'all';
-        gl.utils.visitUrl(`?scope=${apiScope}&p=${pagenum}`);
+        gl.utils.visitUrl(`?scope=${apiScope}&page=${pagenum}`);
       },
     },
     template: `
diff --git a/spec/features/projects/pipelines/pipelines_spec.rb b/spec/features/projects/pipelines/pipelines_spec.rb
index b56be499264..8d1214dedb4 100644
--- a/spec/features/projects/pipelines/pipelines_spec.rb
+++ b/spec/features/projects/pipelines/pipelines_spec.rb
@@ -285,6 +285,27 @@ describe 'Pipelines', :feature, :js do
           end
         end
       end
+
+      context 'with pagination' do
+        before do
+          allow(Ci::Pipeline).to receive(:default_per_page).and_return(1)
+          create(:ci_empty_pipeline,  project: project)
+        end
+
+        it 'should render pagination' do
+          visit namespace_project_pipelines_path(project.namespace, project)
+          wait_for_vue_resource
+
+          expect(page).to have_selector('.gl-pagination')
+        end
+
+        it 'should render second page of pipelines' do
+          visit namespace_project_pipelines_path(project.namespace, project, page: '2')
+          wait_for_vue_resource
+
+          expect(page).to have_selector('.gl-pagination .page', count: 2)
+        end
+      end
     end
 
     describe 'POST /:project/pipelines' do