Moved ci_status environments logic to new action ci_envrionments_status and set up frontend polling

app/assets/javascripts/merge_request_widget.js.es6

@@ -35,13 +35,17 @@
       });
       this.firstCICheck = true;
       this.readyForCICheck = false;
+      this.readyForCIEnvironmentCheck = false;
       this.cancel = false;
       clearInterval(this.fetchBuildStatusInterval);
+      clearInterval(this.fetchBuildEnvironmentStatusInterval);
       this.clearEventListeners();
       this.addEventListeners();
       this.getCIStatus(false);
+      this.getCIEnvironmentsStatus();
       this.retrieveSuccessIcon();
       this.pollCIStatus();
+      this.pollCIEnvironmentsStatus();
       notifyPermissions();
     }
@@ -62,6 +66,7 @@
           page = $('body').data('page').split(':').last();
           if (allowedPages.indexOf(page) < 0) {
             clearInterval(_this.fetchBuildStatusInterval);
+            clearInterval(_this.fetchBuildEnvironmentStatusInterval);
             _this.cancelPolling();
             return _this.clearEventListeners();
           }
@@ -178,23 +183,39 @@
       })(this));
     };
+    MergeRequestWidget.prototype.pollCIEnvironmentsStatus = function() {
+      this.fetchBuildEnvironmentStatusInterval = setInterval(() => {
+        if (!this.readyForCIEnvironmentCheck) return;
+        this.getCIEnvironmentsStatus();
+        this.readyForCIEnvironmentCheck = false;
+      }, 300000);
+    };
+
+    MergeRequestWidget.prototype.getCIEnvironmentsStatus = function() {
+      $.getJSON(this.opts.ci_environments_status_url, (environments) => {
+        if (this.cancel) return;
+        this.readyForCIEnvironmentCheck = true;
+        if (environments && environments.length) this.renderEnvironments(environments);
+      });
+    };
+
     MergeRequestWidget.prototype.renderEnvironments = function(environments) {
-       for (let i = 0; i < environments.length; i++) {
-         const environment = environments[i];
-         if ($(`.mr-state-widget #${ environment.id }`).length) return;
-         const $template = $(DEPLOYMENT_TEMPLATE);
-         if (!environment.external_url) $('.js-environment-link', $template).remove();
-         if (environment.deployed_at) {
-           environment.deployed_at = $.timeago(environment.deployed_at) + '.';
-         } else {
-           $('.js-environment-timeago', $template).remove();
-           environment.name += '.';
-         }
-         environment.ci_success_icon = this.$ciSuccessIcon;
-         const templateString = _.unescape($template[0].outerHTML);
-         const template = _.template(templateString)(environment)
-         this.$widgetBody.before(template);
-       }
+      for (let i = 0; i < environments.length; i++) {
+        const environment = environments[i];
+        if ($(`.mr-state-widget #${ environment.id }`).length) return;
+        const $template = $(DEPLOYMENT_TEMPLATE);
+        if (!environment.external_url) $('.js-environment-link', $template).remove();
+        if (environment.deployed_at) {
+          environment.deployed_at = $.timeago(environment.deployed_at) + '.';
+        } else {
+          $('.js-environment-timeago', $template).remove();
+          environment.name += '.';
+        }
+        environment.ci_success_icon = this.$ciSuccessIcon;
+        const templateString = _.unescape($template[0].outerHTML);
+        const template = _.template(templateString)(environment)
+        this.$widgetBody.before(template);
+      }
      };
     MergeRequestWidget.prototype.showCIStatus = function(state) {

app/controllers/projects/merge_requests_controller.rb

@@ -10,7 +10,7 @@ class Projects::MergeRequestsController < Projects::ApplicationController
   before_action :module_enabled
   before_action :merge_request, only: [
     :edit, :update, :show, :diffs, :commits, :conflicts, :builds, :pipelines, :merge, :merge_check,
-    :ci_status, :toggle_subscription, :cancel_merge_when_build_succeeds, :remove_wip, :resolve_conflicts, :assign_related_issues
+    :ci_status, :ci_environments_status, :toggle_subscription, :cancel_merge_when_build_succeeds, :remove_wip, :resolve_conflicts, :assign_related_issues
   ]
   before_action :validates_merge_request, only: [:show, :diffs, :commits, :builds, :pipelines]
   before_action :define_show_vars, only: [:show, :diffs, :commits, :conflicts, :builds, :pipelines]
@@ -393,11 +393,23 @@ class Projects::MergeRequestsController < Projects::ApplicationController
       end
     end
-    environments = @merge_request.environments.map do |environment|
+    response = {
+      title: merge_request.title,
+      sha: merge_request.diff_head_commit.short_id,
+      status: status,
+      coverage: coverage
+    }
+
+    render json: response
+  end
+
+  def ci_environments_status
+    render json: @merge_request.environments.map do |environment|
       next unless can?(current_user, :read_environment, environment)
       deployment = environment.first_deployment_for(@merge_request.diff_head_commit)
-      environment = {
+
+      environment_data = {
         name: environment.name,
         id: environment.id,
         url: namespace_project_environment_path(@project.namespace, @project, environment),
@@ -405,26 +417,16 @@ class Projects::MergeRequestsController < Projects::ApplicationController
         deployed_at: deployment ? deployment.created_at : nil
       }
-      if environment[:external_url]
-        environment[:external_url_formatted] = environment[:external_url].gsub(/\A.*?:\/\//, '')
+      if environment_data[:external_url]
+        environment_data[:external_url_formatted] = environment_data[:external_url].gsub(/\A.*?:\/\//, '')
       end
-      if environment[:deployed_at]
-        environment[:deployed_at_formatted] = environment[:deployed_at].to_time.in_time_zone.to_s(:medium)
+      if environment_data[:deployed_at]
+        environment_data[:deployed_at_formatted] = environment_data[:deployed_at].to_time.in_time_zone.to_s(:medium)
       end
-      environment
+      environment_data
     end.compact
-
-    response = {
-      title: merge_request.title,
-      sha: merge_request.diff_head_commit.short_id,
-      status: status,
-      coverage: coverage,
-      environments: environments
-    }
-
-    render json: response
   end
   protected

app/views/projects/merge_requests/widget/_show.html.haml

@@ -12,6 +12,7 @@
     merge_check_url: "#{merge_check_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
     check_enable: #{@merge_request.unchecked? ? "true" : "false"},
     ci_status_url: "#{ci_status_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
+    ci_environments_status_url: "#{ci_environments_status_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
     gitlab_icon: "#{asset_path 'gitlab_logo.png'}",
     ci_status: "#{@merge_request.pipeline ? @merge_request.pipeline.status : ''}",
     ci_message: {

config/routes.rb

@@ -83,9 +83,4 @@ Rails.application.routes.draw do
   draw :group
   draw :user
   draw :project
-
-  # Get all keys of user
-  get ':username.keys' => 'profiles/keys#get_keys', constraints: { username: /.*/ }
-
-  root to: "root#index"
 end

config/routes/project.rb

@@ -273,6 +273,7 @@ resources :namespaces, path: '/', constraints: { id: /[a-zA-Z.0-9_\-]+/ }, only:
           post :merge
           post :cancel_merge_when_build_succeeds
           get :ci_status
+          get :ci_environments_status
           post :toggle_subscription
           post :remove_wip
           get :diff_for_path

spec/javascripts/merge_request_widget_spec.js

@@ -8,6 +8,7 @@
       window.notify = function() {};
       this.opts = {
         ci_status_url: "http://sampledomain.local/ci/getstatus",
+        ci_environments_status_url: "http://sampledomain.local/ci/getenvironmentsstatus",
         ci_status: "",
         ci_message: {
           normal: "Build {{status}} for \"{{title}}\"",
@@ -21,15 +22,45 @@
         builds_path: "http://sampledomain.local/sampleBuildsPath"
       };
       this["class"] = new window.gl.MergeRequestWidget(this.opts);
-      return this.ciStatusData = {
-        "title": "Sample MR title",
-        "sha": "12a34bc5",
-        "status": "success",
-        "coverage": 98
-      };
     });
+
+    describe('getCIEnvironmentsStatus', function() {
+      beforeEach(function() {
+        this.ciEnvironmentsStatusData = {
+          created_at: '2016-09-12T13:38:30.636Z',
+          environment_id: 1,
+          environment_name: 'env1',
+          external_url: 'https://test-url.com',
+          external_url_formatted: 'test-url.com'
+        };
+
+        spyOn(jQuery, 'getJSON').and.callFake((req, cb) => {
+          cb(this.ciEnvironmentsStatusData);
+        });
+      });
+
+      it('should call renderEnvironments when the environments property is set', function() {
+         const spy = spyOn(this.class, 'renderEnvironments').and.stub();
+         this.class.getCIEnvironmentsStatus();
+         expect(spy).toHaveBeenCalledWith(this.ciEnvironmentsStatusData);
+       });
+
+       it('should not call renderEnvironments when the environments property is not set', function() {
+         const spy = spyOn(this.class, 'renderEnvironments').and.stub();
+         this.class.getCIEnvironmentsStatus();
+         expect(spy).not.toHaveBeenCalled();
+       });
+    });
+
     return describe('getCIStatus', function() {
       beforeEach(function() {
+        this.ciStatusData = {
+          "title": "Sample MR title",
+          "sha": "12a34bc5",
+          "status": "success",
+          "coverage": 98
+        };
+
         spyOn(jQuery, 'getJSON').and.callFake((function(_this) {
           return function(req, cb) {
             return cb(_this.ciStatusData);
@@ -68,23 +99,6 @@
         this["class"].getCIStatus(true);
         return expect(spy).not.toHaveBeenCalled();
       });
-      it('should call renderEnvironments when the environments property is set', function() {
-         this.ciStatusData.environments = [{
-           created_at: '2016-09-12T13:38:30.636Z',
-           environment_id: 1,
-           environment_name: 'env1',
-           external_url: 'https://test-url.com',
-           external_url_formatted: 'test-url.com'
-         }];
-         var spy = spyOn(this['class'], 'renderEnvironments').and.stub();
-         this['class'].getCIStatus(false);
-         expect(spy).toHaveBeenCalledWith(this.ciStatusData.environments);
-       });
-       it('should not call renderEnvironments when the environments property is not set', function() {
-         var spy = spyOn(this['class'], 'renderEnvironments').and.stub();
-         this['class'].getCIStatus(false);
-         expect(spy).not.toHaveBeenCalled();
-       });
     });
   });