diff --git a/shells/dev/target/Other.vue b/shells/dev/target/Other.vue
index 5d5b8bb6a..b710defa5 100644
--- a/shells/dev/target/Other.vue
+++ b/shells/dev/target/Other.vue
@@ -6,7 +6,7 @@
 </template>
 
 <script>
-// this computed property should be visible 
+// this computed property should be visible
 // even if component has no 'computed' defined
 const computedPropMixin = {
   computed: {
@@ -21,12 +21,12 @@ export default {
   mixins: [ computedPropMixin ],
   data () {
     let a = { c: function () {} }
-    a.a = a
+    a.intentionalRecursion = a
     let b = []
     b[0] = b
     return {
       a: a,
-      b: b
+      intentionalRecusionArray: b
     }
   },
   components: {
@@ -42,7 +42,9 @@ export default {
           e: undefined,
           f: true,
           g: 12345,
-          h: 'I am a really long string mostly just to see how the horizontal scrolling works.'
+          h: 'I am a really long string mostly just to see how the horizontal scrolling works.',
+          i: new Set([1, 2, 3, 4, new Set([5, 6, 7, 8]), new Map([[1, 2], [3, 4], [5, new Map([[6, 7,]])]])]),
+          j: new Map([[1, 2], [3, 4], [5, new Map([[6, 7,]])], [8, new Set([1, 2, 3, 4, new Set([5, 6, 7, 8]), new Map([[1, 2], [3, 4], [5, new Map([[6, 7,]])]])])]])
         }
       }
     }
diff --git a/src/devtools/components/DataField.vue b/src/devtools/components/DataField.vue
index 2fa1d7037..6f34cdfae 100644
--- a/src/devtools/components/DataField.vue
+++ b/src/devtools/components/DataField.vue
@@ -40,6 +40,9 @@ import {
   INFINITY,
   NAN,
   isPlainObject,
+  isMap,
+  isSet,
+  reviver,
   sortByKey
 } from 'src/util'
 
@@ -88,23 +91,28 @@ export default {
       }
     },
     isExpandableType () {
-      const value = this.field.value
-      return Array.isArray(value) || isPlainObject(value)
+      const value = reviver(null, this.field.value)
+      return Array.isArray(value) || isPlainObject(value) ||
+        isSet(value) || isMap(value)
     },
     formattedValue () {
-      const value = this.field.value
+      const value = reviver(null, this.field.value)
       if (value === null) {
         return 'null'
-      } else if (value === UNDEFINED) {
+      } else if (value === undefined) {
         return 'undefined'
-      } else if (value === NAN) {
+      } else if (Number.isNaN(value)) {
         return 'NaN'
-      } else if (value === INFINITY) {
+      } else if (value === Number.POSITIVE_INFINITY) {
         return 'Infinity'
       } else if (Array.isArray(value)) {
         return 'Array[' + value.length + ']'
       } else if (isPlainObject(value)) {
-        return 'Object' + (Object.keys(value).length ? '' : ' (empty)')
+        return 'Object[' + Object.keys(value).length + ']'
+      } else if (isSet(value)) {
+        return 'Set[' + value.size + ']'
+      } else if (isMap(value)) {
+        return 'Map[' + value.size + ']'
       } else if (this.valueType === 'native') {
         return specialTypeRE.exec(value)[1]
       } else if (typeof value === 'string') {
@@ -119,17 +127,22 @@ export default {
       }
     },
     formattedSubFields () {
-      let value = this.field.value
+      let value = reviver(null, this.field.value)
       if (Array.isArray(value)) {
         value = value.map((item, i) => ({
           key: i,
           value: item
         }))
-      } else if (typeof value === 'object') {
+      } else if (isPlainObject(value)) {
         value = sortByKey(Object.keys(value).map(key => ({
           key,
           value: value[key]
         })))
+      } else if (isSet(value)) {
+        // Use many zero-width spaces for keys to ensure each key is unique
+        value = Array.from(value.values()).map((v, i) => ({ key: '_' + '​'.repeat(i), value: v }))
+      } else if (isMap(value)) {
+        value = Array.from(value.entries()).map(([k, v]) => ({ key: k, value: v }))
       }
       return value
     },
diff --git a/src/util.js b/src/util.js
index ae1158acf..f596da488 100644
--- a/src/util.js
+++ b/src/util.js
@@ -38,6 +38,8 @@ export function inDoc (node) {
 export const UNDEFINED = '__vue_devtool_undefined__'
 export const INFINITY = '__vue_devtool_infinity__'
 export const NAN = '__vue_devtool_nan__'
+export const SET = '__vue_devtool_set__'
+export const MAP = '__vue_devtool_map__'
 
 export function stringify (data) {
   return CircularJSON.stringify(data, replacer)
@@ -53,6 +55,10 @@ function replacer (key, val) {
   } else if (val instanceof RegExp) {
     // special handling of native type
     return `[native RegExp ${val.toString()}]`
+  } else if (isSet(val)) {
+    return SET + stringify(Array.from(val))
+  } else if (isMap(val)) {
+    return MAP + stringify(Array.from(val))
   } else {
     return sanitize(val)
   }
@@ -64,13 +70,17 @@ export function parse (data, revive) {
     : CircularJSON.parse(data)
 }
 
-function reviver (key, val) {
+export function reviver (key, val) {
   if (val === UNDEFINED) {
     return undefined
   } else if (val === INFINITY) {
     return Infinity
   } else if (val === NAN) {
     return NaN
+  } else if (isSerializedSet(val)) {
+    return new Set(parse(val.substring(SET.length), true))
+  } else if (isSerializedMap(val)) {
+    return new Map(parse(val.substring(MAP.length), true))
   } else {
     return val
   }
@@ -103,6 +113,26 @@ export function isPlainObject (obj) {
   return Object.prototype.toString.call(obj) === '[object Object]'
 }
 
+export function isMap (obj) {
+  return obj instanceof Map
+}
+
+export function isSet (obj) {
+  return obj instanceof Set
+}
+
+export function isSerializedMap (obj) {
+  return isString(obj) && obj.startsWith(MAP)
+}
+
+export function isSerializedSet (obj) {
+  return isString(obj) && obj.startsWith(SET)
+}
+
+export function isString (obj) {
+  return obj instanceof String || typeof obj === 'string'
+}
+
 function isPrimitive (data) {
   if (data == null) {
     return true