more fine tuning - catching edge cases - progress in testing - [ci skip]

app/assets/javascripts/vue_pipelines_index/branch_commit.js.es6

@@ -46,7 +46,6 @@
             <!-- ** will still need gravatar url ** -->
             <img
               class="avatar has-tooltip s20 hidden-xs"
-              :alt='alt'
               :title='pipeline.commit.author_name'
               data-container="body"
               :src='avatarUrl'

app/assets/javascripts/vue_pipelines_index/index.js.es6

@@ -16,7 +16,7 @@
 
 (() => {
   const url = window.location.href;
-  if (~url.indexOf('scope')) return null;
+  if (~url.indexOf('scope') && !~url.indexOf('scope=pipelines')) return null;
 
   const project = document.querySelector('.pipelines');
 

app/assets/javascripts/vue_pipelines_index/pipeline_actions.js.es6

@@ -16,35 +16,41 @@
         <div class="controls pull-right">
           <div class="btn-group inline">
             <div class="btn-group">
-            <a
-              v-if='pipeline.details.manual_actions.length > 0'
-              class="dropdown-toggle btn btn-default"
-              data-toggle="dropdown"
-              type="button"
-            >
-              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 11" class="icon-play">
-                <path
-                  fill-rule="evenodd"
-                  d="m9.283 6.47l-7.564 4.254c-.949.534-1.719.266-1.719-.576v-9.292c0-.852.756-1.117 1.719-.576l7.564 4.254c.949.534.963 1.392 0 1.934"
-                >
-                </path>
-              </svg>
-              <i class="fa fa-caret-down"></i>
-            </a>
-            <ul class="dropdown-menu dropdown-menu-align-right">
-              <li v-for='action in pipeline.details.manual_actions'>
-                <a rel="nofollow" data-method="post" :href='action.url' title="Manual build">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 11" class="icon-play">
-                    <path
-                      fill-rule="evenodd"
-                      d="m9.283 6.47l-7.564 4.254c-.949.534-1.719.266-1.719-.576v-9.292c0-.852.756-1.117 1.719-.576l7.564 4.254c.949.534.963 1.392 0 1.934"
-                    >
-                    </path>
-                  </svg>
-                  <span>{{action.name}}</span>
-                </a>
-              </li>
-            </ul>
+              <a
+                v-if='pipeline.details.manual_actions.length > 0'
+                class="dropdown-toggle btn btn-default"
+                data-toggle="dropdown"
+                type="button"
+                title="Manual build"
+              >
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 11" class="icon-play">
+                  <path
+                    fill-rule="evenodd"
+                    d="m9.283 6.47l-7.564 4.254c-.949.534-1.719.266-1.719-.576v-9.292c0-.852.756-1.117 1.719-.576l7.564 4.254c.949.534.963 1.392 0 1.934"
+                  >
+                  </path>
+                </svg>
+                <i class="fa fa-caret-down"></i>
+              </a>
+              <ul class="dropdown-menu dropdown-menu-align-right">
+                <li v-for='action in pipeline.details.manual_actions'>
+                  <a
+                    rel="nofollow"
+                    data-method="post"
+                    :href='action.url'
+                    title="Manual build"
+                  >
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 11" class="icon-play">
+                      <path
+                        fill-rule="evenodd"
+                        d="m9.283 6.47l-7.564 4.254c-.949.534-1.719.266-1.719-.576v-9.292c0-.852.756-1.117 1.719-.576l7.564 4.254c.949.534.963 1.392 0 1.934"
+                      >
+                      </path>
+                    </svg>
+                    <span>{{action.name}}</span>
+                  </a>
+                </li>
+              </ul>
             </div>
             <div class="btn-group">
               <a

app/assets/javascripts/vue_pipelines_index/pipeline_url.js.es6

@@ -11,8 +11,8 @@
     ],
     computed: {
       user() {
-        if (!this.pipeline.user) return 'API';
-        return this.pipeline.user;
+        if (!this.pipeline.user === null) return true;
+        return false;
       },
     },
     template: `
@@ -21,7 +21,24 @@
           <span class="pipeline-id">#{{pipeline.id}}</span>
         </a>
         <span>by</span>
-        <span class="api monospace">{{user}}</span>
+        <a
+          v-if='user'
+          :href='pipeline.user.url'
+        >
+          <img
+            v-if='user'
+            class="avatar has-tooltip s20 "
+            :title='pipeline.user.name'
+            data-container="body"
+            :src='pipeline.user.avatar_url || pipeline.user.gravatar'
+          >
+        </a>
+        <span
+          v-if='!user'
+          class="api monospace"
+        >
+          API
+        </span>
         <span
           v-if='pipeline.flags.latest === true'
           class="label label-success has-tooltip"

app/assets/javascripts/vue_pipelines_index/pipelines.js.es6

@@ -33,7 +33,9 @@
     ],
     created() {
       const url = window.location.toString();
-      if (~url.indexOf('?')) this.pagenum = url.split('?')[1].split('=')[1];
+      if (~url.indexOf('?') && !~url.indexOf('scope=pipelines')) {
+        this.pagenum = url.split('?')[1].split('=')[1];
+      }
       this.store.fetchDataLoop.call(this, Vue, this.pagenum, this.scope);
     },
     methods: {

app/views/projects/pipelines/index.html.haml

@@ -56,8 +56,6 @@
       .vue-pipelines-index
 
 = page_specific_javascript_tag('vue_icons/index.js')
--# ^^ this component loads Vue so the rest don't
--#    this will no longer be an issue once Vue2 is global
 = page_specific_javascript_tag('vue_pagination/index.js')
 = page_specific_javascript_tag('vue_pipelines_status/index.js')
 = page_specific_javascript_tag('vue_pipelines_index/index.js')

spec/features/projects/pipelines_spec.rb

 require 'spec_helper'
+require 'rails_helper'
 
 describe "Pipelines", feature: true, js: true do
   include GitlabRoutingHelper
-  include WaitForAjax
+  include WaitForVueResource
 
   let(:project) { create(:empty_project) }
   let(:user) { create(:user) }
@@ -12,22 +13,34 @@ describe "Pipelines", feature: true, js: true do
     project.team << [user, :developer]
   end
 
-  describe 'GET /:project/pipelines' do
+  describe 'GET /:project/pipelines', feature: true, js: true do
+    include WaitForVueResource
+
     let!(:pipeline) { create(:ci_empty_pipeline, project: project, ref: 'master', status: 'running') }
 
-    [:all, :running, :branches].each do |scope|
+    [:pipelines].each do |scope|
       context "displaying #{scope}" do
         let(:project) { create(:project) }
 
         before { visit namespace_project_pipelines_path(project.namespace, project, scope: scope) }
 
         it do
-          wait_for_ajax
+          wait_for_vue_resource
           expect(page).to have_content(pipeline.short_sha)
         end
       end
     end
 
+    [:running, :branches].each do |scope|
+      context "displaying #{scope}" do
+        let(:project) { create(:project) }
+
+        before { visit namespace_project_pipelines_path(project.namespace, project, scope: scope) }
+
+        it { expect(page).to have_content(pipeline.short_sha) }
+      end
+    end
+
     context 'anonymous access' do
       before { visit namespace_project_pipelines_path(project.namespace, project) }
 
@@ -42,14 +55,31 @@ describe "Pipelines", feature: true, js: true do
         visit namespace_project_pipelines_path(project.namespace, project)
       end
 
-      it { expect(page).to have_link('Cancel') }
-      it { expect(page).to have_selector('.ci-running') }
+      it do
+        wait_for_vue_resource
+        expect(page).to have_link('Cancel')
+      end
+
+      it do
+        wait_for_vue_resource
+        expect(page).to have_selector('.ci-running')
+      end
 
       context 'when canceling' do
-        before { click_link('Cancel') }
+        before do
+          wait_for_vue_resource
+          click_link('Cancel')
+        end
 
-        it { expect(page).not_to have_link('Cancel') }
-        it { expect(page).to have_selector('.ci-canceled') }
+        it do
+          wait_for_vue_resource
+          expect(page).not_to have_link('Cancel')
+        end
+
+        it do
+          wait_for_vue_resource
+          expect(page).to have_selector('.ci-canceled')
+        end
       end
     end
 
@@ -77,12 +107,21 @@ describe "Pipelines", feature: true, js: true do
 
       before { visit namespace_project_pipelines_path(project.namespace, project) }
 
-      it { expect(page).to have_link('Manual build') }
+      it do
+        wait_for_vue_resource
+        expect(page).to have_link('Manual build')
+      end
 
       context 'when playing' do
-        before { click_link('Manual build') }
+        before do
+          wait_for_vue_resource
+          click_link('Manual build')
+        end
 
-        it { expect(manual.reload).to be_pending }
+        it do
+          wait_for_vue_resource
+          expect(manual.reload).to be_pending
+        end
       end
     end
 
@@ -127,8 +166,15 @@ describe "Pipelines", feature: true, js: true do
 
         before { visit namespace_project_pipelines_path(project.namespace, project) }
 
-        it { expect(page).to have_selector('.build-artifacts') }
-        it { expect(page).to have_link(with_artifacts.name) }
+        it do
+          wait_for_vue_resource
+          expect(page).to have_selector('.build-artifacts')
+        end
+
+        it do
+          wait_for_vue_resource
+          expect(page).to have_link(with_artifacts.name)
+        end
       end
 
       context 'with artifacts expired' do
@@ -149,7 +195,7 @@ describe "Pipelines", feature: true, js: true do
     end
   end
 
-  describe 'GET /:project/pipelines/:id' do
+  describe 'GET /:project/pipelines/:id', feature: true, js: true do
     let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master') }
 
     before do
@@ -207,7 +253,7 @@ describe "Pipelines", feature: true, js: true do
     end
   end
 
-  describe 'POST /:project/pipelines' do
+  describe 'POST /:project/pipelines', feature: true, js: true do
     let(:project) { create(:project) }
 
     before { visit new_namespace_project_pipeline_path(project.namespace, project) }
@@ -238,7 +284,7 @@ describe "Pipelines", feature: true, js: true do
     end
   end
 
-  describe 'Create pipelines', feature: true do
+  describe 'Create pipelines', feature: true, js: true do
     let(:project) { create(:project) }
 
     before do