diff --git a/packages/metal-drag-drop/src/Drag.js b/packages/metal-drag-drop/src/Drag.js
index 03a9370a1..4652fb9ef 100644
--- a/packages/metal-drag-drop/src/Drag.js
+++ b/packages/metal-drag-drop/src/Drag.js
@@ -1,6 +1,6 @@
 'use strict';
 
-import {core, object} from 'metal';
+import {core, object, isServerSide} from 'metal';
 import dom from 'metal-dom';
 import DragAutoScroll from './helpers/DragAutoScroll';
 import DragScrollDelta from './helpers/DragScrollDelta';
@@ -21,6 +21,10 @@ class Drag extends State {
 	constructor(config) {
 		super(config);
 
+		if (isServerSide()) {
+			return;
+		}
+
 		/**
 		 * The drag placeholder that is active at the moment.
 		 * @type {Element}
@@ -866,7 +870,11 @@ Drag.STATE = {
 	container: {
 		setter: dom.toElement,
 		validator: 'validateElementOrString_',
-		value: document,
+		valueFn: function() {
+			if (!isServerSide()) {
+				return document;
+			}
+		},
 	},
 
 	/**
diff --git a/packages/metal-toggler/src/Toggler.js b/packages/metal-toggler/src/Toggler.js
index 7da054242..6d2e10cdf 100644
--- a/packages/metal-toggler/src/Toggler.js
+++ b/packages/metal-toggler/src/Toggler.js
@@ -1,6 +1,6 @@
 'use strict';
 
-import core from 'metal';
+import {core, isServerSide} from 'metal';
 import dom from 'metal-dom';
 import {EventHandler} from 'metal-events';
 import State from 'metal-state';
@@ -15,6 +15,10 @@ class Toggler extends State {
 	constructor(config) {
 		super(config);
 
+		if (isServerSide()) {
+			return;
+		}
+
 		this.headerEventHandler_ = new EventHandler();
 
 		this.on('headerChanged', this.syncHeader);
@@ -25,6 +29,10 @@ class Toggler extends State {
 	 * @inheritDoc
 	 */
 	disposeInternal() {
+		if (isServerSide()) {
+			return;
+		}
+
 		super.disposeInternal();
 		this.headerEventHandler_.removeAllListeners();
 	}