From 4bdbccfc066b3ff1ed3bd29a6266215ed2421df3 Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Fri, 7 Apr 2017 19:36:09 +0000 Subject: [PATCH] Remove Vue from main bundle and disable production warnings --- app/assets/javascripts/boards/boards_bundle.js | 4 ++++ .../javascripts/commit/pipelines/pipelines_bundle.js | 12 +++++------- app/assets/javascripts/merge_request_tabs.js | 5 +---- app/assets/javascripts/milestone_select.js | 6 ++---- app/assets/javascripts/subscription.js | 5 +---- app/assets/javascripts/users_select.js | 8 +++----- spec/javascripts/merge_request_tabs_spec.js | 1 + 7 files changed, 17 insertions(+), 24 deletions(-) diff --git a/app/assets/javascripts/boards/boards_bundle.js b/app/assets/javascripts/boards/boards_bundle.js index e057ac8df02..37094c5c9be 100644 --- a/app/assets/javascripts/boards/boards_bundle.js +++ b/app/assets/javascripts/boards/boards_bundle.js @@ -38,6 +38,10 @@ $(() => { Store.create(); + // hack to allow sidebar scripts like milestone_select manipulate the BoardsStore + gl.issueBoards.boardStoreIssueSet = (...args) => Vue.set(Store.detail.issue, ...args); + gl.issueBoards.boardStoreIssueDelete = (...args) => Vue.delete(Store.detail.issue, ...args); + gl.IssueBoardsApp = new Vue({ el: $boardApp, components: { diff --git a/app/assets/javascripts/commit/pipelines/pipelines_bundle.js b/app/assets/javascripts/commit/pipelines/pipelines_bundle.js index 5f3ed9374bf..86d99dd87da 100644 --- a/app/assets/javascripts/commit/pipelines/pipelines_bundle.js +++ b/app/assets/javascripts/commit/pipelines/pipelines_bundle.js @@ -12,20 +12,18 @@ Vue.use(VueResource); * Renders Pipelines table in pipelines tab in the commits show view. */ +// export for use in merge_request_tabs.js (TODO: remove this hack) +window.gl = window.gl || {}; +window.gl.CommitPipelinesTable = CommitPipelinesTable; + $(() => { - window.gl = window.gl || {}; gl.commits = gl.commits || {}; gl.commits.pipelines = gl.commits.pipelines || {}; - if (gl.commits.PipelinesTableBundle) { - document.querySelector('#commit-pipeline-table-view').removeChild(this.pipelinesTableBundle.$el); - gl.commits.PipelinesTableBundle.$destroy(true); - } - const pipelineTableViewEl = document.querySelector('#commit-pipeline-table-view'); if (pipelineTableViewEl && pipelineTableViewEl.dataset.disableInitialization === undefined) { gl.commits.pipelines.PipelinesTableBundle = new CommitPipelinesTable().$mount(); - document.querySelector('#commit-pipeline-table-view').appendChild(gl.commits.pipelines.PipelinesTableBundle.$el); + pipelineTableViewEl.appendChild(gl.commits.pipelines.PipelinesTableBundle.$el); } }); diff --git a/app/assets/javascripts/merge_request_tabs.js b/app/assets/javascripts/merge_request_tabs.js index 7f6c74ce39a..f7f6a773036 100644 --- a/app/assets/javascripts/merge_request_tabs.js +++ b/app/assets/javascripts/merge_request_tabs.js @@ -3,9 +3,6 @@ /* global Flash */ import Cookies from 'js-cookie'; - -import CommitPipelinesTable from './commit/pipelines/pipelines_table'; - import './breakpoints'; import './flash'; @@ -234,7 +231,7 @@ import './flash'; } mountPipelinesView() { - this.commitPipelinesTable = new CommitPipelinesTable().$mount(); + this.commitPipelinesTable = new gl.CommitPipelinesTable().$mount(); // $mount(el) replaces the el with the new rendered component. We need it in order to mount // it everytime this tab is clicked - https://vuejs.org/v2/api/#vm-mount document.querySelector('#commit-pipeline-table-view') diff --git a/app/assets/javascripts/milestone_select.js b/app/assets/javascripts/milestone_select.js index ac4fad88fe5..773fe3233a7 100644 --- a/app/assets/javascripts/milestone_select.js +++ b/app/assets/javascripts/milestone_select.js @@ -2,8 +2,6 @@ /* global Issuable */ /* global ListMilestone */ -import Vue from 'vue'; - (function() { this.MilestoneSelect = (function() { function MilestoneSelect(currentProject, els) { @@ -151,12 +149,12 @@ import Vue from 'vue'; return $dropdown.closest('form').submit(); } else if ($dropdown.hasClass('js-issue-board-sidebar')) { if (selected.id !== -1) { - Vue.set(gl.issueBoards.BoardsStore.detail.issue, 'milestone', new ListMilestone({ + gl.issueBoards.boardStoreIssueSet('milestone', new ListMilestone({ id: selected.id, title: selected.name })); } else { - Vue.delete(gl.issueBoards.BoardsStore.detail.issue, 'milestone'); + gl.issueBoards.boardStoreIssueDelete('milestone'); } $dropdown.trigger('loading.gl.dropdown'); diff --git a/app/assets/javascripts/subscription.js b/app/assets/javascripts/subscription.js index 9c307915ec4..5f9a3e00c22 100644 --- a/app/assets/javascripts/subscription.js +++ b/app/assets/javascripts/subscription.js @@ -1,5 +1,3 @@ -import Vue from 'vue'; - (() => { class Subscription { constructor(containerElm) { @@ -29,8 +27,7 @@ import Vue from 'vue'; // hack to allow this to work with the issue boards Vue object if (document.querySelector('html').classList.contains('issue-boards-page')) { - Vue.set( - gl.issueBoards.BoardsStore.detail.issue, + gl.issueBoards.boardStoreIssueSet( 'subscribed', !gl.issueBoards.BoardsStore.detail.issue.subscribed, ); diff --git a/app/assets/javascripts/users_select.js b/app/assets/javascripts/users_select.js index 48e20cf501f..3325a7d429c 100644 --- a/app/assets/javascripts/users_select.js +++ b/app/assets/javascripts/users_select.js @@ -2,8 +2,6 @@ /* global Issuable */ /* global ListUser */ -import Vue from 'vue'; - (function() { var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; }, slice = [].slice; @@ -74,7 +72,7 @@ import Vue from 'vue'; e.preventDefault(); if ($dropdown.hasClass('js-issue-board-sidebar')) { - Vue.set(gl.issueBoards.BoardsStore.detail.issue, 'assignee', new ListUser({ + gl.issueBoards.boardStoreIssueSet('assignee', new ListUser({ id: _this.currentUser.id, username: _this.currentUser.username, name: _this.currentUser.name, @@ -225,14 +223,14 @@ import Vue from 'vue'; return $dropdown.closest('form').submit(); } else if ($dropdown.hasClass('js-issue-board-sidebar')) { if (user.id) { - Vue.set(gl.issueBoards.BoardsStore.detail.issue, 'assignee', new ListUser({ + gl.issueBoards.boardStoreIssueSet('assignee', new ListUser({ id: user.id, username: user.username, name: user.name, avatar_url: user.avatar_url })); } else { - Vue.delete(gl.issueBoards.BoardsStore.detail.issue, 'assignee'); + gl.issueBoards.boardStoreIssueDelete('assignee'); } updateIssueBoardsIssue(); diff --git a/spec/javascripts/merge_request_tabs_spec.js b/spec/javascripts/merge_request_tabs_spec.js index 69eb7b1a4cb..e437333d522 100644 --- a/spec/javascripts/merge_request_tabs_spec.js +++ b/spec/javascripts/merge_request_tabs_spec.js @@ -1,6 +1,7 @@ /* eslint-disable no-var, comma-dangle, object-shorthand */ require('~/merge_request_tabs'); +require('~/commit/pipelines/pipelines_bundle.js'); require('~/breakpoints'); require('~/lib/utils/common_utils'); require('~/diff'); -- GitLab