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

@@ -21,6 +21,7 @@
                 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
@@ -33,7 +34,12 @@
               </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">
+                  <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"

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