Add pagination spec and improve filtering of null values

app/assets/javascripts/environments/mixins/environments_mixin.js

@@ -44,8 +44,8 @@ export default {
       this.isLoading = false;
       // Prevent the absence of the nested flag from causing mismatches
-      const response = _.omit(resp.config.params, _.isUndefined);
-      const request = _.omit(this.requestData, _.isUndefined);
+      const response = this.filterNilValues(resp.config.params);
+      const request = this.filterNilValues(this.requestData);
       if (_.isEqual(response, request)) {
         this.store.storeAvailableCount(resp.data.available_count);
@@ -55,6 +55,10 @@ export default {
       }
     },
+    filterNilValues(obj) {
+      return _.omit(obj, value => _.isUndefined(value) || _.isNull(value));
+    },
+
     /**
      * Handles URL and query parameter changes.
      * When the user uses the pagination or the tabs,

spec/features/projects/environments/environments_spec.rb

@@ -38,6 +38,23 @@ describe 'Environments page', :js do
         end
       end
+      describe 'with environments spanning multiple pages', :js do
+        before do
+          allow(Kaminari.config).to receive(:default_per_page).and_return(3)
+          create_list(:environment, 4, project: project, state: :available)
+        end
+
+        it 'should render second page of pipelines' do
+          visit_environments(project, scope: 'available')
+
+          find('.js-next-button').click
+          wait_for_requests
+
+          expect(page).to have_selector('.gl-pagination .page', count: 2)
+          expect(find('.gl-pagination .page-item.active .page-link').text).to eq("2")
+        end
+      end
+
       describe 'in stopped tab page' do
         it 'should show no environments' do
           visit_environments(project, scope: 'stopped')