Fixes broken tests

app/assets/javascripts/environments/components/environment_actions.js.es6

@@ -27,10 +27,13 @@
 
       const dropdownContainer = this.$el.querySelector('.dropdown-play-icon-container');
       const actionContainers = this.$el.querySelectorAll('.action-play-icon-container');
+      // Phantomjs does not have support to iterate a nodelist.
+      const actionsArray = [].slice.call(actionContainers);
 
-      if (playIcon) {
+      if (playIcon && actionsArray && dropdownContainer) {
         dropdownContainer.appendChild(playIcon.cloneNode(true));
-        actionContainers.forEach((element) => {
+
+        actionsArray.forEach((element) => {
           element.appendChild(playIcon.cloneNode(true));
         });
       }

app/assets/stylesheets/pages/environments.scss

-.environments-container,
 .deployments-container {
   width: 100%;
   overflow: auto;
@@ -9,6 +8,13 @@
   font-size: 34px;
 }
 
+@media (max-width: $screen-sm-min) {
+  .environments-container {
+    width: 100%;
+    overflow: auto;
+  }
+}
+
 .environments {
   .deployment-column {
     .avatar {

spec/features/environment_spec.rb

+require 'spec_helper'
+
+feature 'Environments', feature: true do
+  given(:project) { create(:empty_project) }
+  given(:user) { create(:user) }
+  given(:role) { :developer }
+
+  background do
+    login_as(user)
+    project.team << [user, role]
+  end
+
+  describe 'when showing the environment' do
+    given(:environment) { create(:environment, project: project) }
+    given!(:deployment) { }
+    given!(:manual) { }
+
+    before do
+      visit namespace_project_environment_path(project.namespace, project, environment)
+    end
+
+    context 'without deployments' do
+      scenario 'does show no deployments' do
+        expect(page).to have_content('You don\'t have any deployments right now.')
+      end
+    end
+
+    context 'with deployments' do
+      given(:deployment) { create(:deployment, environment: environment) }
+
+      scenario 'does show deployment SHA' do
+        expect(page).to have_link(deployment.short_sha)
+      end
+
+      scenario 'does not show a re-deploy button for deployment without build' do
+        expect(page).not_to have_link('Re-deploy')
+      end
+
+      context 'with build' do
+        given(:pipeline) { create(:ci_pipeline, project: project) }
+        given(:build) { create(:ci_build, pipeline: pipeline) }
+        given(:deployment) { create(:deployment, environment: environment, deployable: build) }
+
+        scenario 'does show build name' do
+          expect(page).to have_link("#{build.name} (##{build.id})")
+        end
+
+        scenario 'does show re-deploy button' do
+          expect(page).to have_link('Re-deploy')
+        end
+
+        scenario 'does not show stop button' do
+          expect(page).not_to have_link('Stop')
+        end
+
+        context 'with manual action' do
+          given(:manual) { create(:ci_build, :manual, pipeline: pipeline, name: 'deploy to production') }
+
+          scenario 'does show a play button' do
+
+            expect(page).to have_link(manual.name.humanize)
+          end
+
+          scenario 'does allow to play manual action' do
+            expect(manual).to be_skipped
+            expect{ click_link(manual.name.humanize) }.not_to change { Ci::Pipeline.count }
+            expect(page).to have_content(manual.name)
+            expect(manual.reload).to be_pending
+          end
+
+          context 'with external_url' do
+            given(:environment) { create(:environment, project: project, external_url: 'https://git.gitlab.com') }
+            given(:build) { create(:ci_build, pipeline: pipeline) }
+            given(:deployment) { create(:deployment, environment: environment, deployable: build) }
+
+            scenario 'does show an external link button' do
+              expect(page).to have_link(nil, href: environment.external_url)
+            end
+          end
+
+          context 'with stop action' do
+            given(:manual) { create(:ci_build, :manual, pipeline: pipeline, name: 'close_app') }
+            given(:deployment) { create(:deployment, environment: environment, deployable: build, on_stop: 'close_app') }
+
+            scenario 'does show stop button' do
+              expect(page).to have_link('Stop')
+            end
+
+            scenario 'does allow to stop environment' do
+              click_link('Stop')
+
+              expect(page).to have_content('close_app')
+            end
+
+            context 'for reporter' do
+              let(:role) { :reporter }
+
+              scenario 'does not show stop button' do
+                expect(page).not_to have_link('Stop')
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

spec/features/environments_spec.rb

@@ -84,7 +84,7 @@ feature 'Environments', feature: true, js: true do
           end
 
           scenario 'does show build name and id' do
-            expect(page).to have_link("#{build.name} (##{build.id})")
+            expect(page).to have_link("#{build.name} ##{build.id}")
           end
 
           scenario 'does not show stop button' do
@@ -114,7 +114,7 @@ feature 'Environments', feature: true, js: true do
             end
 
             scenario 'starts build when stop button clicked' do
-              first('.stop-env-link').click
+              page.find('.stop-env-link').click
 
               expect(page).to have_content('close_app')
             end
@@ -136,100 +136,6 @@ feature 'Environments', feature: true, js: true do
     end
   end
 
-  describe 'when showing the environment' do
-    given(:environment) { create(:environment, project: project) }
-    given!(:deployment) { }
-    given!(:manual) { }
-
-    before do
-      visit namespace_project_environment_path(project.namespace, project, environment)
-    end
-
-    context 'without deployments' do
-      scenario 'does show no deployments' do
-        expect(page).to have_content('You don\'t have any deployments right now.')
-      end
-    end
-
-    context 'with deployments' do
-      given(:deployment) { create(:deployment, environment: environment) }
-
-      scenario 'does show deployment SHA' do
-        expect(page).to have_link(deployment.short_sha)
-      end
-
-      scenario 'does not show a re-deploy button for deployment without build' do
-        expect(page).not_to have_link('Re-deploy')
-      end
-
-      context 'with build' do
-        given(:pipeline) { create(:ci_pipeline, project: project) }
-        given(:build) { create(:ci_build, pipeline: pipeline) }
-        given(:deployment) { create(:deployment, environment: environment, deployable: build) }
-
-        scenario 'does show build name' do
-          expect(page).to have_link("#{build.name} (##{build.id})")
-        end
-
-        scenario 'does show re-deploy button' do
-          expect(page).to have_link('Re-deploy')
-        end
-
-        scenario 'does not show stop button' do
-          expect(page).not_to have_link('Stop')
-        end
-
-        context 'with manual action' do
-          given(:manual) { create(:ci_build, :manual, pipeline: pipeline, name: 'deploy to production') }
-
-          scenario 'does show a play button' do
-            expect(page).to have_link(manual.name.humanize)
-          end
-
-          scenario 'does allow to play manual action' do
-            expect(manual).to be_skipped
-            expect{ click_link(manual.name.humanize) }.not_to change { Ci::Pipeline.count }
-            expect(page).to have_content(manual.name)
-            expect(manual.reload).to be_pending
-          end
-
-          context 'with external_url' do
-            given(:environment) { create(:environment, project: project, external_url: 'https://git.gitlab.com') }
-            given(:build) { create(:ci_build, pipeline: pipeline) }
-            given(:deployment) { create(:deployment, environment: environment, deployable: build) }
-
-            scenario 'does show an external link button' do
-              expect(page).to have_link(nil, href: environment.external_url)
-            end
-          end
-
-          context 'with stop action' do
-            given(:manual) { create(:ci_build, :manual, pipeline: pipeline, name: 'close_app') }
-            given(:deployment) { create(:deployment, environment: environment, deployable: build, on_stop: 'close_app') }
-
-            scenario 'does show stop button' do
-              expect(page).to have_link('Stop')
-            end
-
-            scenario 'does allow to stop environment' do
-              click_link('Stop')
-
-              expect(page).to have_content('close_app')
-            end
-
-            context 'for reporter' do
-              let(:role) { :reporter }
-
-              scenario 'does not show stop button' do
-                expect(page).not_to have_link('Stop')
-              end
-            end
-          end
-        end
-      end
-    end
-  end
-
   describe 'when creating a new environment' do
     before do
       visit namespace_project_environments_path(project.namespace, project)