Skip to content

Commit 26389e3

Browse files
committed
Attempt to fix SSR auto height
1 parent dc37456 commit 26389e3

File tree

5 files changed

+38
-21
lines changed

5 files changed

+38
-21
lines changed

dist/index.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,13 +79,13 @@
7979
timestamp: Date.now(),
8080
canceled: !1
8181
}, args);
82-
}, exports.MutationObserver = function() {
82+
}, exports.getMutationObserver = function() {
8383
if ("undefined" != typeof window) for (var prefixes = [ "", "WebKit", "Moz", "O", "Ms" ], i = 0; i < prefixes.length; i++) {
8484
var name = prefixes[i] + "MutationObserver";
8585
if (name in window) return window[name];
8686
}
8787
return !1;
88-
}();
88+
};
8989
}, function(module, exports) {
9090
module.exports = function() {
9191
var list = [];
@@ -475,11 +475,15 @@
475475
},
476476
beforeMount: function() {
477477
var _this = this;
478-
_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
478+
if (_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
479479
this.handleWindowResize(), this.scrollable && !this.isAutoHeight && console.warn('Modal "' + this.name + '" has scrollable flag set to true but height is not "auto" (' + this.height + ")"),
480-
this.isAutoHeight && _util.MutationObserver && (this.mutationObserver = new _util.MutationObserver(function(mutations) {
481-
_this.updateRenderedHeight();
482-
})), this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
480+
this.isAutoHeight) {
481+
var MutationObserver = (0, _util.getMutationObserver)();
482+
MutationObserver && (this.mutationObserver = new MutationObserver(function(mutations) {
483+
_this.updateRenderedHeight();
484+
}));
485+
}
486+
this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
483487
},
484488
beforeDestroy: function() {
485489
_index2.default.event.$off("toggle", this.handleToggleEvent), window.removeEventListener("resize", this.handleWindowResize),

dist/ssr.index.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,13 +79,13 @@
7979
timestamp: Date.now(),
8080
canceled: !1
8181
}, args);
82-
}, exports.MutationObserver = function() {
82+
}, exports.getMutationObserver = function() {
8383
if ("undefined" != typeof window) for (var prefixes = [ "", "WebKit", "Moz", "O", "Ms" ], i = 0; i < prefixes.length; i++) {
8484
var name = prefixes[i] + "MutationObserver";
8585
if (name in window) return window[name];
8686
}
8787
return !1;
88-
}();
88+
};
8989
}, function(module, exports) {
9090
module.exports = function() {
9191
var list = [];
@@ -429,11 +429,15 @@
429429
},
430430
beforeMount: function() {
431431
var _this = this;
432-
_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
432+
if (_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
433433
this.handleWindowResize(), this.scrollable && !this.isAutoHeight && console.warn('Modal "' + this.name + '" has scrollable flag set to true but height is not "auto" (' + this.height + ")"),
434-
this.isAutoHeight && _util.MutationObserver && (this.mutationObserver = new _util.MutationObserver(function(mutations) {
435-
_this.updateRenderedHeight();
436-
})), this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
434+
this.isAutoHeight) {
435+
var MutationObserver = (0, _util.getMutationObserver)();
436+
MutationObserver && (this.mutationObserver = new MutationObserver(function(mutations) {
437+
_this.updateRenderedHeight();
438+
}));
439+
}
440+
this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
437441
},
438442
beforeDestroy: function() {
439443
_index2.default.event.$off("toggle", this.handleToggleEvent), window.removeEventListener("resize", this.handleWindowResize),

dist/ssr.nocss.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,13 +79,13 @@
7979
timestamp: Date.now(),
8080
canceled: !1
8181
}, args);
82-
}, exports.MutationObserver = function() {
82+
}, exports.getMutationObserver = function() {
8383
if ("undefined" != typeof window) for (var prefixes = [ "", "WebKit", "Moz", "O", "Ms" ], i = 0; i < prefixes.length; i++) {
8484
var name = prefixes[i] + "MutationObserver";
8585
if (name in window) return window[name];
8686
}
8787
return !1;
88-
}();
88+
};
8989
}, function(module, exports, __webpack_require__) {
9090
"use strict";
9191
function _interopRequireDefault(obj) {
@@ -366,11 +366,15 @@
366366
},
367367
beforeMount: function() {
368368
var _this = this;
369-
_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
369+
if (_index2.default.event.$on("toggle", this.handleToggleEvent), window.addEventListener("resize", this.handleWindowResize),
370370
this.handleWindowResize(), this.scrollable && !this.isAutoHeight && console.warn('Modal "' + this.name + '" has scrollable flag set to true but height is not "auto" (' + this.height + ")"),
371-
this.isAutoHeight && _util.MutationObserver && (this.mutationObserver = new _util.MutationObserver(function(mutations) {
372-
_this.updateRenderedHeight();
373-
})), this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
371+
this.isAutoHeight) {
372+
var MutationObserver = (0, _util.getMutationObserver)();
373+
MutationObserver && (this.mutationObserver = new MutationObserver(function(mutations) {
374+
_this.updateRenderedHeight();
375+
}));
376+
}
377+
this.clickToClose && window.addEventListener("keyup", this.handleEscapeKeyUp);
374378
},
375379
beforeDestroy: function() {
376380
_index2.default.event.$off("toggle", this.handleToggleEvent), window.removeEventListener("resize", this.handleWindowResize),

src/Modal.vue

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
<script>
4343
import Modal from './index'
4444
import Resizer from './Resizer.vue'
45-
import { inRange, createModalEvent, MutationObserver } from './util'
45+
import { inRange, createModalEvent, getMutationObserver } from './util'
4646
import { parseNumber, validateNumber } from './parser'
4747
4848
export default {
@@ -208,7 +208,12 @@ export default {
208208
* (Provide polyfill to support IE < 11)
209209
*
210210
* https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
211+
*
212+
* For the sake of SSR, MutationObserver cannot be initialized
213+
* before component creation >_<
211214
*/
215+
const MutationObserver = getMutationObserver()
216+
212217
if (MutationObserver) {
213218
this.mutationObserver = new MutationObserver(mutations => {
214219
this.updateRenderedHeight()

src/util.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export const createModalEvent = (args = {}) => {
3131
}
3232
}
3333

34-
export const MutationObserver = (() => {
34+
export const getMutationObserver = () => {
3535
if (typeof window !== 'undefined') {
3636
const prefixes = ['', 'WebKit', 'Moz', 'O', 'Ms']
3737

@@ -45,4 +45,4 @@ export const MutationObserver = (() => {
4545
}
4646

4747
return false
48-
})()
48+
}

0 commit comments

Comments
 (0)