Skip to content

Commit 3f57cf5

Browse files
AkryumAkryum
authored
refactor(ssr): use ssrPrefetch (#469)
* refactor(ssr): use ssrPrefetch * fix: ssrPrefetch option was renamed to serverPrefetch * docs(ssr): vue version notice * fix: skip ssrPrefetch if apollo.$prefetch is false * docs: new SSR docs * chore: v3.0.0-beta.28
2 parents 05dd426 + 455a5e7 commit 3f57cf5

13 files changed

+306
-724
lines changed

‎dist/vue-apollo.esm.js

+70-18
Original file line numberDiff line numberDiff line change
@@ -413,10 +413,6 @@ function () {
413413
this._watchers = [];
414414
this._destroyed = false;
415415

416-
if (this.vm.$isServer) {
417-
this.options.fetchPolicy = 'cache-first';
418-
}
419-
420416
if (autostart) {
421417
this.autostart();
422418
}
@@ -724,14 +720,23 @@ function (_SmartApollo) {
724720
});
725721
}
726722

727-
_this = _possibleConstructorReturn(this, _getPrototypeOf(SmartQuery).call(this, vm, key, options, autostart));
723+
_this = _possibleConstructorReturn(this, _getPrototypeOf(SmartQuery).call(this, vm, key, options, false));
728724

729725
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "type", 'query');
730726

731727
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "vueApolloSpecialKeys", VUE_APOLLO_QUERY_KEYWORDS);
732728

733729
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "_loading", false);
734730

731+
_this.firstRun = new Promise(function (resolve, reject) {
732+
_this._firstRunResolve = resolve;
733+
_this._firstRunReject = reject;
734+
});
735+
736+
if (_this.vm.$isServer) {
737+
_this.options.fetchPolicy = 'network-only';
738+
}
739+
735740
if (!options.manual) {
736741
_this.hasDataField = _this.vm.$data.hasOwnProperty(key);
737742

@@ -754,6 +759,10 @@ function (_SmartApollo) {
754759
}
755760
}
756761

762+
if (autostart) {
763+
_this.autostart();
764+
}
765+
757766
return _this;
758767
}
759768

@@ -827,7 +836,12 @@ function (_SmartApollo) {
827836
_get(_getPrototypeOf(SmartQuery.prototype), "nextResult", this).call(this, result);
828837

829838
var data = result.data,
830-
loading = result.loading;
839+
loading = result.loading,
840+
error = result.error;
841+
842+
if (error) {
843+
this.firstRunReject();
844+
}
831845

832846
if (!loading) {
833847
this.loadingDone();
@@ -861,7 +875,8 @@ function (_SmartApollo) {
861875
value: function catchError(error) {
862876
_get(_getPrototypeOf(SmartQuery.prototype), "catchError", this).call(this, error);
863877

864-
this.loadingDone();
878+
this.firstRunReject();
879+
this.loadingDone(error);
865880
this.nextResult(this.observer.currentResult()); // The observable closes the sub if an error occurs
866881

867882
this.resubscribeToQuery();
@@ -901,11 +916,17 @@ function (_SmartApollo) {
901916
}, {
902917
key: "loadingDone",
903918
value: function loadingDone() {
919+
var error = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
920+
904921
if (this.loading) {
905922
this.applyLoadingModifier(-1);
906923
}
907924

908925
this.loading = false;
926+
927+
if (!error) {
928+
this.firstRunResolve();
929+
}
909930
}
910931
}, {
911932
key: "fetchMore",
@@ -995,6 +1016,24 @@ function (_SmartApollo) {
9951016
return (_this$observer4 = this.observer).stopPolling.apply(_this$observer4, arguments);
9961017
}
9971018
}
1019+
}, {
1020+
key: "firstRunResolve",
1021+
value: function firstRunResolve() {
1022+
if (this._firstRunResolve) {
1023+
this._firstRunResolve();
1024+
1025+
this._firstRunResolve = null;
1026+
}
1027+
}
1028+
}, {
1029+
key: "firstRunReject",
1030+
value: function firstRunReject() {
1031+
if (this._firstRunReject) {
1032+
this._firstRunReject();
1033+
1034+
this._firstRunReject = null;
1035+
}
1036+
}
9981037
}, {
9991038
key: "destroy",
10001039
value: function destroy() {
@@ -1733,7 +1772,7 @@ function hasProperty(holder, key) {
17331772
return typeof holder !== 'undefined' && Object.prototype.hasOwnProperty.call(holder, key);
17341773
}
17351774

1736-
function initDollarApollo() {
1775+
function initProvider() {
17371776
var options = this.$options; // ApolloProvider injection
17381777

17391778
var optionValue = options.apolloProvider;
@@ -1797,6 +1836,8 @@ function launch() {
17971836
var apollo = this.$options.apollo;
17981837

17991838
if (apollo) {
1839+
this.$_apolloPromises = [];
1840+
18001841
if (!apollo.$init) {
18011842
apollo.$init = true; // Default options applied to `apollo` options
18021843

@@ -1824,7 +1865,11 @@ function launch() {
18241865
for (var key in apollo) {
18251866
if (key.charAt(0) !== '$') {
18261867
var options = apollo[key];
1827-
this.$apollo.addSmartQuery(key, options);
1868+
var smart = this.$apollo.addSmartQuery(key, options);
1869+
1870+
if (options.prefetch !== false && apollo.$prefetch !== false) {
1871+
this.$_apolloPromises.push(smart.firstRun);
1872+
}
18281873
}
18291874
}
18301875

@@ -1850,9 +1895,16 @@ function defineReactiveSetter($apollo, key, value, deep) {
18501895
}
18511896
}
18521897

1898+
function destroy() {
1899+
if (this.$_apollo) {
1900+
this.$_apollo.destroy();
1901+
this.$_apollo = null;
1902+
}
1903+
}
1904+
18531905
function installMixin(Vue, vueVersion) {
18541906
Vue.mixin(_objectSpread({}, vueVersion === '1' ? {
1855-
init: initDollarApollo
1907+
init: initProvider
18561908
} : {}, vueVersion === '2' ? {
18571909
data: function data() {
18581910
return {
@@ -1864,17 +1916,17 @@ function installMixin(Vue, vueVersion) {
18641916
};
18651917
},
18661918
beforeCreate: function beforeCreate() {
1867-
initDollarApollo.call(this);
1919+
initProvider.call(this);
18681920
proxyData.call(this);
1921+
},
1922+
serverPrefetch: function serverPrefetch() {
1923+
if (this.$_apolloPromises) {
1924+
return Promise.all(this.$_apolloPromises);
1925+
}
18691926
}
18701927
} : {}, {
18711928
created: launch,
1872-
destroyed: function destroyed() {
1873-
if (this.$_apollo) {
1874-
this.$_apollo.destroy();
1875-
this.$_apollo = null;
1876-
}
1877-
}
1929+
destroyed: destroy
18781930
}));
18791931
}
18801932

@@ -1925,7 +1977,7 @@ function install(Vue, options) {
19251977
}
19261978
ApolloProvider.install = install; // eslint-disable-next-line no-undef
19271979

1928-
ApolloProvider.version = "3.0.0-beta.27"; // Apollo provider
1980+
ApolloProvider.version = "3.0.0-beta.28"; // Apollo provider
19291981

19301982
var ApolloProvider$1 = ApolloProvider; // Components
19311983

‎dist/vue-apollo.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/vue-apollo.umd.js

+70-18
Original file line numberDiff line numberDiff line change
@@ -419,10 +419,6 @@
419419
this._watchers = [];
420420
this._destroyed = false;
421421

422-
if (this.vm.$isServer) {
423-
this.options.fetchPolicy = 'cache-first';
424-
}
425-
426422
if (autostart) {
427423
this.autostart();
428424
}
@@ -730,14 +726,23 @@
730726
});
731727
}
732728

733-
_this = _possibleConstructorReturn(this, _getPrototypeOf(SmartQuery).call(this, vm, key, options, autostart));
729+
_this = _possibleConstructorReturn(this, _getPrototypeOf(SmartQuery).call(this, vm, key, options, false));
734730

735731
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "type", 'query');
736732

737733
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "vueApolloSpecialKeys", VUE_APOLLO_QUERY_KEYWORDS);
738734

739735
_defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "_loading", false);
740736

737+
_this.firstRun = new Promise(function (resolve, reject) {
738+
_this._firstRunResolve = resolve;
739+
_this._firstRunReject = reject;
740+
});
741+
742+
if (_this.vm.$isServer) {
743+
_this.options.fetchPolicy = 'network-only';
744+
}
745+
741746
if (!options.manual) {
742747
_this.hasDataField = _this.vm.$data.hasOwnProperty(key);
743748

@@ -760,6 +765,10 @@
760765
}
761766
}
762767

768+
if (autostart) {
769+
_this.autostart();
770+
}
771+
763772
return _this;
764773
}
765774

@@ -833,7 +842,12 @@
833842
_get(_getPrototypeOf(SmartQuery.prototype), "nextResult", this).call(this, result);
834843

835844
var data = result.data,
836-
loading = result.loading;
845+
loading = result.loading,
846+
error = result.error;
847+
848+
if (error) {
849+
this.firstRunReject();
850+
}
837851

838852
if (!loading) {
839853
this.loadingDone();
@@ -867,7 +881,8 @@
867881
value: function catchError(error) {
868882
_get(_getPrototypeOf(SmartQuery.prototype), "catchError", this).call(this, error);
869883

870-
this.loadingDone();
884+
this.firstRunReject();
885+
this.loadingDone(error);
871886
this.nextResult(this.observer.currentResult()); // The observable closes the sub if an error occurs
872887

873888
this.resubscribeToQuery();
@@ -907,11 +922,17 @@
907922
}, {
908923
key: "loadingDone",
909924
value: function loadingDone() {
925+
var error = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
926+
910927
if (this.loading) {
911928
this.applyLoadingModifier(-1);
912929
}
913930

914931
this.loading = false;
932+
933+
if (!error) {
934+
this.firstRunResolve();
935+
}
915936
}
916937
}, {
917938
key: "fetchMore",
@@ -1001,6 +1022,24 @@
10011022
return (_this$observer4 = this.observer).stopPolling.apply(_this$observer4, arguments);
10021023
}
10031024
}
1025+
}, {
1026+
key: "firstRunResolve",
1027+
value: function firstRunResolve() {
1028+
if (this._firstRunResolve) {
1029+
this._firstRunResolve();
1030+
1031+
this._firstRunResolve = null;
1032+
}
1033+
}
1034+
}, {
1035+
key: "firstRunReject",
1036+
value: function firstRunReject() {
1037+
if (this._firstRunReject) {
1038+
this._firstRunReject();
1039+
1040+
this._firstRunReject = null;
1041+
}
1042+
}
10041043
}, {
10051044
key: "destroy",
10061045
value: function destroy() {
@@ -1739,7 +1778,7 @@
17391778
return typeof holder !== 'undefined' && Object.prototype.hasOwnProperty.call(holder, key);
17401779
}
17411780

1742-
function initDollarApollo() {
1781+
function initProvider() {
17431782
var options = this.$options; // ApolloProvider injection
17441783

17451784
var optionValue = options.apolloProvider;
@@ -1803,6 +1842,8 @@
18031842
var apollo = this.$options.apollo;
18041843

18051844
if (apollo) {
1845+
this.$_apolloPromises = [];
1846+
18061847
if (!apollo.$init) {
18071848
apollo.$init = true; // Default options applied to `apollo` options
18081849

@@ -1830,7 +1871,11 @@
18301871
for (var key in apollo) {
18311872
if (key.charAt(0) !== '$') {
18321873
var options = apollo[key];
1833-
this.$apollo.addSmartQuery(key, options);
1874+
var smart = this.$apollo.addSmartQuery(key, options);
1875+
1876+
if (options.prefetch !== false && apollo.$prefetch !== false) {
1877+
this.$_apolloPromises.push(smart.firstRun);
1878+
}
18341879
}
18351880
}
18361881

@@ -1856,9 +1901,16 @@
18561901
}
18571902
}
18581903

1904+
function destroy() {
1905+
if (this.$_apollo) {
1906+
this.$_apollo.destroy();
1907+
this.$_apollo = null;
1908+
}
1909+
}
1910+
18591911
function installMixin(Vue, vueVersion) {
18601912
Vue.mixin(_objectSpread({}, vueVersion === '1' ? {
1861-
init: initDollarApollo
1913+
init: initProvider
18621914
} : {}, vueVersion === '2' ? {
18631915
data: function data() {
18641916
return {
@@ -1870,17 +1922,17 @@
18701922
};
18711923
},
18721924
beforeCreate: function beforeCreate() {
1873-
initDollarApollo.call(this);
1925+
initProvider.call(this);
18741926
proxyData.call(this);
1927+
},
1928+
serverPrefetch: function serverPrefetch() {
1929+
if (this.$_apolloPromises) {
1930+
return Promise.all(this.$_apolloPromises);
1931+
}
18751932
}
18761933
} : {}, {
18771934
created: launch,
1878-
destroyed: function destroyed() {
1879-
if (this.$_apollo) {
1880-
this.$_apollo.destroy();
1881-
this.$_apollo = null;
1882-
}
1883-
}
1935+
destroyed: destroy
18841936
}));
18851937
}
18861938

@@ -1931,7 +1983,7 @@
19311983
}
19321984
ApolloProvider.install = install; // eslint-disable-next-line no-undef
19331985

1934-
ApolloProvider.version = "3.0.0-beta.27"; // Apollo provider
1986+
ApolloProvider.version = "3.0.0-beta.28"; // Apollo provider
19351987

19361988
var ApolloProvider$1 = ApolloProvider; // Components
19371989

0 commit comments

Comments
 (0)