Merge branch...

Merge branch '19814-regression-snippet-pagination-on-user-page-leads-to-raw-json-instead-of-normal-webpage' into 'master'

Fix pagination on user snippets page

## What does this MR do?

Copy the pagination code from projects -> snippets on a user's profile page.

## Are there points in the code the reviewer needs to double check?

Don't think so.

## Why was this MR needed?

It was a bug!

## Screenshots (if relevant)

(I set the pagination to two per page for this, because I'm lazy.)

![Snippets](/uploads/986abd8608cda1cd76416e55b2c3a3ba/Snippets.gif)

## Does this MR meet the acceptance criteria?

- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- Tests
  - [x] Added for this feature/bug
  - [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

## What are the relevant issue numbers?

Closes #19814.

See merge request !6179

CHANGELOG

@@ -9,6 +9,7 @@ v 8.12.0 (unreleased)
   - Add font color contrast to external label in admin area (ClemMakesApps)
   - Change logo animation to CSS (ClemMakesApps)
   - Instructions for enabling Git packfile bitmaps !6104
+  - Fix pagination on user snippets page
   - Change merge_error column from string to text type
   - Reduce contributions calendar data payload (ClemMakesApps)
   - Add `web_url` field to issue, merge request, and snippet API objects (Ben Boeckel)

app/assets/javascripts/snippets_list.js.es6

+(global => {
+  global.gl = global.gl || {};
+
+  gl.SnippetsList = function() {
+    var $holder = $('.snippets-list-holder');
+
+    $holder.find('.pagination').on('ajax:success', (e, data) => {
+      $holder.replaceWith(data.html);
+    });
+  }
+})(window);

app/views/snippets/_snippets.html.haml

-%ul.content-list
+.snippets-list-holder
+  %ul.content-list
     = render partial: 'shared/snippets/snippet', collection: @snippets
     - if @snippets.empty?
       %li
         .nothing-here-block Nothing here.
 
-= paginate @snippets, theme: 'gitlab'
+  = paginate @snippets, theme: 'gitlab', remote: true
+
+:javascript
+  gl.SnippetsList();

spec/features/users/snippets_spec.rb

+require 'spec_helper'
+
+describe 'Snippets tab on a user profile', feature: true, js: true do
+  include WaitForAjax
+
+  let(:user) { create(:user) }
+
+  context 'when the user has snippets' do
+    before do
+      create_list(:snippet, 25, :public, author: user)
+
+      visit user_path(user)
+      page.within('.user-profile-nav') { click_link 'Snippets' }
+      wait_for_ajax
+    end
+
+    it 'is limited to 20 items per page' do
+      expect(page.all('.snippets-list-holder .snippet-row').count).to eq(20)
+    end
+
+    context 'clicking on the link to the second page' do
+      before { click_link('2') }
+
+      it 'shows the remaining snippets' do
+        expect(page.all('.snippets-list-holder .snippet-row').count).to eq(5)
+      end
+    end
+  end
+end