diff --git a/packages/jest/README.md b/packages/jest/README.md
index 1de2cc81b7..b765b642c1 100644
--- a/packages/jest/README.md
+++ b/packages/jest/README.md
@@ -17,18 +17,18 @@ The easiest way to test React components with emotion is with the snapshot seria
 module.exports = {
   // ... other config
   snapshotSerializers: [
-    '@emotion/jest' /* if needed other snapshotSerializers should go here */
+    '@emotion/jest/serializer' /* if needed other snapshotSerializers should go here */
   ]
 }
 ```
 
-To assist with shallow rendering, there's a custom enzyme snapshot serializer, that includes the `enzyme-to-json` serializer, which is available by importing `@emotion/jest/enzyme`. If you already have the `enzyme-to-json` serializer added to `snapshotSerializers`, it will need to be removed to allow this to work.
+To assist with shallow rendering, there's a custom enzyme snapshot serializer, that includes the `enzyme-to-json` serializer, which is available by importing `@emotion/jest/enzyme-serializer`. If you already have the `enzyme-to-json` serializer added to `snapshotSerializers`, it will need to be removed to allow this to work.
 
 ```js
 // jest.config.js
 module.exports = {
   // ... other config
-  snapshotSerializers: ['@emotion/jest/enzyme']
+  snapshotSerializers: ['@emotion/jest/enzyme-serializer']
 }
 ```
 
@@ -37,10 +37,10 @@ Or you can add the serializer via the `expect.addSnapshotSerializer` method like
 ```jsx
 import React from 'react'
 import renderer from 'react-test-renderer'
-import serializer from '@emotion/jest'
+import { createSerializer } from '@emotion/jest'
 import styled from '@emotion/styled'
 
-expect.addSnapshotSerializer(serializer)
+expect.addSnapshotSerializer(createSerializer())
 
 test('renders with correct styles', () => {
   const H1 = styled.h1`
@@ -141,7 +141,7 @@ test('renders with correct styles', () => {
 })
 ```
 
-You can provide additional options for `toHaveStyleRule` matcher.  
+You can provide additional options for `toHaveStyleRule` matcher.
 `target` - helps to specify css selector or other component
 where style rule should be found.
 
diff --git a/packages/jest/enzyme-serializer/index.js b/packages/jest/enzyme-serializer/index.js
new file mode 100644
index 0000000000..6b185d52f2
--- /dev/null
+++ b/packages/jest/enzyme-serializer/index.js
@@ -0,0 +1 @@
+export * from '../src/create-enzyme-serializer'
diff --git a/packages/jest/enzyme-serializer/package.json b/packages/jest/enzyme-serializer/package.json
new file mode 100644
index 0000000000..99b42c7b56
--- /dev/null
+++ b/packages/jest/enzyme-serializer/package.json
@@ -0,0 +1,8 @@
+{
+  "main": "dist/jest.cjs.js",
+  "module": "dist/jest.esm.js",
+  "types": "../types/enzyme-serializer",
+  "preconstruct": {
+    "source": "../src/enzyme-serializer"
+  }
+}
diff --git a/packages/jest/enzyme/index.js b/packages/jest/enzyme/index.js
deleted file mode 100644
index 57c18d4771..0000000000
--- a/packages/jest/enzyme/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export * from '../src/enzyme'
diff --git a/packages/jest/enzyme/types/index.d.ts b/packages/jest/enzyme/types/index.d.ts
deleted file mode 100644
index 7cd1ebc63c..0000000000
--- a/packages/jest/enzyme/types/index.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-/// <reference types="jest" />
-
-export interface CreateSerializerOptions {
-  classNameReplacer?: (className: string, index: number) => string
-  DOMElements?: boolean
-}
-export function createSerializer(
-  options?: CreateSerializerOptions
-): jest.SnapshotSerializerPlugin
-export const print: jest.SnapshotSerializerPlugin['print']
-export const test: jest.SnapshotSerializerPlugin['test']
-declare const serializer: jest.SnapshotSerializerPlugin
-export default serializer
diff --git a/packages/jest/package.json b/packages/jest/package.json
index 4d1dbba3d6..91472dbcc6 100644
--- a/packages/jest/package.json
+++ b/packages/jest/package.json
@@ -9,8 +9,8 @@
     "src",
     "dist",
     "types/*.d.ts",
-    "enzyme",
-    "serializer.js"
+    "serializer",
+    "enzyme-serializer"
   ],
   "scripts": {
     "test:typescript": "dtslint types"
@@ -61,7 +61,8 @@
   "preconstruct": {
     "entrypoints": [
       ".",
-      "enzyme"
+      "serializer",
+      "enzyme-serializer"
     ]
   }
 }
diff --git a/packages/jest/serializer.js b/packages/jest/serializer.js
deleted file mode 100644
index 629953e7e1..0000000000
--- a/packages/jest/serializer.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = require('jest-emotion').default
diff --git a/packages/jest/serializer/index.js b/packages/jest/serializer/index.js
new file mode 100644
index 0000000000..8822c9fb90
--- /dev/null
+++ b/packages/jest/serializer/index.js
@@ -0,0 +1 @@
+export * from '../src/create-serializer'
diff --git a/packages/jest/enzyme/package.json b/packages/jest/serializer/package.json
similarity index 56%
rename from packages/jest/enzyme/package.json
rename to packages/jest/serializer/package.json
index feef70a861..e53574168a 100644
--- a/packages/jest/enzyme/package.json
+++ b/packages/jest/serializer/package.json
@@ -1,8 +1,8 @@
 {
   "main": "dist/jest.cjs.js",
   "module": "dist/jest.esm.js",
-  "types": "../types/enzyme",
+  "types": "../types/serializer",
   "preconstruct": {
-    "source": "../src/enzyme"
+    "source": "../src/serializer"
   }
 }
diff --git a/packages/jest/src/enzyme.js b/packages/jest/src/create-enzyme-serializer.js
similarity index 81%
rename from packages/jest/src/enzyme.js
rename to packages/jest/src/create-enzyme-serializer.js
index ad207d2eeb..d564a98327 100644
--- a/packages/jest/src/enzyme.js
+++ b/packages/jest/src/create-enzyme-serializer.js
@@ -1,9 +1,9 @@
 // @flow
 import type { Options } from './serializer'
-import { createSerializer as createEmotionSerializer } from './serializer'
-import { createSerializer as createEnzymeSerializer } from 'enzyme-to-json'
+import { createSerializer as createEmotionSerializer } from './create-serializer'
+import { createSerializer as createEnzymeToJsonSerializer } from 'enzyme-to-json'
 
-const enzymeSerializer = createEnzymeSerializer({})
+const enzymeSerializer = createEnzymeToJsonSerializer({})
 
 const tickle = (wrapper: *) => {
   if (typeof wrapper.dive === 'function') {
@@ -12,7 +12,7 @@ const tickle = (wrapper: *) => {
   return wrapper
 }
 
-export function createSerializer({
+export function createEnzymeSerializer({
   classNameReplacer,
   DOMElements = true
 }: Options = {}) {
@@ -52,5 +52,3 @@ export function createSerializer({
     }
   }
 }
-
-export default createSerializer()
diff --git a/packages/jest/src/create-serializer.js b/packages/jest/src/create-serializer.js
new file mode 100644
index 0000000000..3e9fbdb5e4
--- /dev/null
+++ b/packages/jest/src/create-serializer.js
@@ -0,0 +1,236 @@
+// @flow
+import prettify from '@emotion/css-prettifier'
+import { replaceClassNames } from './replace-class-names'
+import {
+  getClassNamesFromNodes,
+  isReactElement,
+  isEmotionCssPropElementType,
+  isEmotionCssPropEnzymeElement,
+  isDOMElement,
+  getStylesFromClassNames,
+  getStyleElements,
+  getKeys,
+  flatMap,
+  isPrimitive,
+  hasIntersection
+} from './utils'
+
+function getNodes(node, nodes = []) {
+  if (Array.isArray(node)) {
+    for (let child of node) {
+      getNodes(child, nodes)
+    }
+    return nodes
+  }
+
+  if (node.children) {
+    for (let child of node.children) {
+      getNodes(child, nodes)
+    }
+  }
+
+  if (typeof node === 'object') {
+    nodes.push(node)
+  }
+
+  return nodes
+}
+
+function copyProps(src, target) {
+  return Object.defineProperties(src, {
+    ...Object.getOwnPropertyDescriptors(target)
+  })
+}
+
+function deepTransform(node, transform) {
+  if (Array.isArray(node)) {
+    return node.map(child => deepTransform(child, transform))
+  }
+
+  const transformed: any = transform(node)
+
+  if (transformed !== node) {
+    if (transformed.props) {
+      copyProps(transformed, {
+        props: Object.entries(transformed.props).reduce(
+          (props, [key, value]) =>
+            Object.assign(props, {
+              [key]: deepTransform(value, transform)
+            }),
+          {}
+        )
+      })
+    }
+    if (transformed.children) {
+      return copyProps(transformed, {
+        // flatMap to allow a child of <A><B /><C /></A> to be transformed to <B /><C />
+        children: flatMap(
+          (deepTransform(transformed.children, transform): any),
+          id => id
+        )
+      })
+    }
+  }
+
+  return transformed
+}
+
+function getPrettyStylesFromClassNames(
+  classNames: Array<string>,
+  elements: Array<HTMLStyleElement>,
+  indentation: string
+) {
+  return prettify(getStylesFromClassNames(classNames, elements), indentation)
+}
+
+export type Options = {
+  classNameReplacer?: (className: string, index: number) => string,
+  DOMElements?: boolean
+}
+
+function filterEmotionProps(props = {}) {
+  const {
+    css,
+    __EMOTION_TYPE_PLEASE_DO_NOT_USE__,
+    __EMOTION_LABEL_PLEASE_DO_NOT_USE__,
+    ...rest
+  } = props
+
+  rest.css = 'unknown styles'
+
+  return rest
+}
+
+function isShallowEnzymeElement(element: any, classNames: string[]) {
+  const delimiter = ' '
+  const childClassNames = flatMap(element.children || [], ({ props = {} }) =>
+    (props.className || '').split(delimiter)
+  ).filter(Boolean)
+  return !hasIntersection(classNames, childClassNames)
+}
+
+const createConvertEmotionElements = (keys: string[], printer: *) => (
+  node: any
+) => {
+  if (isPrimitive(node)) {
+    return node
+  }
+  if (isEmotionCssPropEnzymeElement(node)) {
+    const cssClassNames = (node.props.css.name || '').split(' ')
+    const expectedClassNames = flatMap(cssClassNames, cssClassName =>
+      keys.map(key => `${key}-${cssClassName}`)
+    )
+    // if this is a shallow element, we need to manufacture the className
+    // since the underlying component is not rendered.
+    if (isShallowEnzymeElement(node, expectedClassNames)) {
+      const className = [node.props.className]
+        .concat(expectedClassNames)
+        .filter(Boolean)
+        .join(' ')
+      const emotionType = node.props.__EMOTION_TYPE_PLEASE_DO_NOT_USE__
+      // emotionType will be a string for DOM elements
+      const type =
+        typeof emotionType === 'string' ? emotionType : emotionType.name
+      return {
+        ...node,
+        props: filterEmotionProps({
+          ...node.props,
+          className
+        }),
+        type
+      }
+    } else {
+      return node.children
+    }
+  }
+  if (isEmotionCssPropElementType(node)) {
+    return {
+      ...node,
+      props: filterEmotionProps(node.props),
+      type: node.props.__EMOTION_TYPE_PLEASE_DO_NOT_USE__
+    }
+  }
+  if (isReactElement(node)) {
+    return copyProps({}, node)
+  }
+  return node
+}
+
+function clean(node: any, classNames: string[]) {
+  if (Array.isArray(node)) {
+    for (const child of node) {
+      clean(child, classNames)
+    }
+    return
+  }
+  if (node.children) {
+    for (const child of node.children) {
+      clean(child, classNames)
+    }
+  }
+  if (node.props) {
+    const { className } = node.props
+    if (!className) {
+      // if it's empty, remove it
+      delete node.props.className
+    } else {
+      const hasKnownClass = hasIntersection(className.split(' '), classNames)
+      if (hasKnownClass) {
+        delete node.props.css
+      }
+    }
+  }
+}
+
+export function createSerializer({
+  classNameReplacer,
+  DOMElements = true
+}: Options = {}) {
+  const cache = new WeakSet()
+  const isTransformed = val => cache.has(val)
+
+  function serialize(
+    val: *,
+    config: *,
+    indentation: string,
+    depth: number,
+    refs: *,
+    printer: Function
+  ) {
+    const elements = getStyleElements()
+    const keys = getKeys(elements)
+    const convertEmotionElements = createConvertEmotionElements(keys, printer)
+    const converted = deepTransform(val, convertEmotionElements)
+    const nodes = getNodes(converted)
+    const classNames = getClassNamesFromNodes(nodes)
+    const styles = getPrettyStylesFromClassNames(
+      classNames,
+      elements,
+      config.indent
+    )
+    clean(converted, classNames)
+
+    nodes.forEach(cache.add, cache)
+    const printedVal = printer(converted, config, indentation, depth, refs)
+    nodes.forEach(cache.delete, cache)
+
+    return replaceClassNames(
+      classNames,
+      styles,
+      printedVal,
+      keys,
+      classNameReplacer
+    )
+  }
+
+  return {
+    test(val: *) {
+      return (
+        val &&
+        (!isTransformed(val) &&
+          (isReactElement(val) || (DOMElements && isDOMElement(val))))
+      )
+    },
+    serialize
+  }
+}
diff --git a/packages/jest/src/enzyme-serializer.js b/packages/jest/src/enzyme-serializer.js
new file mode 100644
index 0000000000..78c5bba6ce
--- /dev/null
+++ b/packages/jest/src/enzyme-serializer.js
@@ -0,0 +1,3 @@
+// @flow
+import { createEnzymeSerializer } from './create-enzyme-serializer'
+export const { test, serialize } = createEnzymeSerializer()
diff --git a/packages/jest/src/index.js b/packages/jest/src/index.js
index 5b352416d6..ff81767f42 100644
--- a/packages/jest/src/index.js
+++ b/packages/jest/src/index.js
@@ -1,3 +1,4 @@
 // @flow
-export { createSerializer, default } from './serializer'
+export { createSerializer } from './create-serializer'
+export { createEnzymeSerializer } from './create-enzyme-serializer'
 export { matchers } from './matchers'
diff --git a/packages/jest/src/serializer.js b/packages/jest/src/serializer.js
index 68bf5751eb..3f6afed572 100644
--- a/packages/jest/src/serializer.js
+++ b/packages/jest/src/serializer.js
@@ -1,238 +1,3 @@
 // @flow
-import prettify from '@emotion/css-prettifier'
-import { replaceClassNames } from './replace-class-names'
-import {
-  getClassNamesFromNodes,
-  isReactElement,
-  isEmotionCssPropElementType,
-  isEmotionCssPropEnzymeElement,
-  isDOMElement,
-  getStylesFromClassNames,
-  getStyleElements,
-  getKeys,
-  flatMap,
-  isPrimitive,
-  hasIntersection
-} from './utils'
-
-function getNodes(node, nodes = []) {
-  if (Array.isArray(node)) {
-    for (let child of node) {
-      getNodes(child, nodes)
-    }
-    return nodes
-  }
-
-  if (node.children) {
-    for (let child of node.children) {
-      getNodes(child, nodes)
-    }
-  }
-
-  if (typeof node === 'object') {
-    nodes.push(node)
-  }
-
-  return nodes
-}
-
-function copyProps(src, target) {
-  return Object.defineProperties(src, {
-    ...Object.getOwnPropertyDescriptors(target)
-  })
-}
-
-function deepTransform(node, transform) {
-  if (Array.isArray(node)) {
-    return node.map(child => deepTransform(child, transform))
-  }
-
-  const transformed: any = transform(node)
-
-  if (transformed !== node) {
-    if (transformed.props) {
-      copyProps(transformed, {
-        props: Object.entries(transformed.props).reduce(
-          (props, [key, value]) =>
-            Object.assign(props, {
-              [key]: deepTransform(value, transform)
-            }),
-          {}
-        )
-      })
-    }
-    if (transformed.children) {
-      return copyProps(transformed, {
-        // flatMap to allow a child of <A><B /><C /></A> to be transformed to <B /><C />
-        children: flatMap(
-          (deepTransform(transformed.children, transform): any),
-          id => id
-        )
-      })
-    }
-  }
-
-  return transformed
-}
-
-function getPrettyStylesFromClassNames(
-  classNames: Array<string>,
-  elements: Array<HTMLStyleElement>,
-  indentation: string
-) {
-  return prettify(getStylesFromClassNames(classNames, elements), indentation)
-}
-
-export type Options = {
-  classNameReplacer?: (className: string, index: number) => string,
-  DOMElements?: boolean
-}
-
-function filterEmotionProps(props = {}) {
-  const {
-    css,
-    __EMOTION_TYPE_PLEASE_DO_NOT_USE__,
-    __EMOTION_LABEL_PLEASE_DO_NOT_USE__,
-    ...rest
-  } = props
-
-  rest.css = 'unknown styles'
-
-  return rest
-}
-
-function isShallowEnzymeElement(element: any, classNames: string[]) {
-  const delimiter = ' '
-  const childClassNames = flatMap(element.children || [], ({ props = {} }) =>
-    (props.className || '').split(delimiter)
-  ).filter(Boolean)
-  return !hasIntersection(classNames, childClassNames)
-}
-
-const createConvertEmotionElements = (keys: string[], printer: *) => (
-  node: any
-) => {
-  if (isPrimitive(node)) {
-    return node
-  }
-  if (isEmotionCssPropEnzymeElement(node)) {
-    const cssClassNames = (node.props.css.name || '').split(' ')
-    const expectedClassNames = flatMap(cssClassNames, cssClassName =>
-      keys.map(key => `${key}-${cssClassName}`)
-    )
-    // if this is a shallow element, we need to manufacture the className
-    // since the underlying component is not rendered.
-    if (isShallowEnzymeElement(node, expectedClassNames)) {
-      const className = [node.props.className]
-        .concat(expectedClassNames)
-        .filter(Boolean)
-        .join(' ')
-      const emotionType = node.props.__EMOTION_TYPE_PLEASE_DO_NOT_USE__
-      // emotionType will be a string for DOM elements
-      const type =
-        typeof emotionType === 'string' ? emotionType : emotionType.name
-      return {
-        ...node,
-        props: filterEmotionProps({
-          ...node.props,
-          className
-        }),
-        type
-      }
-    } else {
-      return node.children
-    }
-  }
-  if (isEmotionCssPropElementType(node)) {
-    return {
-      ...node,
-      props: filterEmotionProps(node.props),
-      type: node.props.__EMOTION_TYPE_PLEASE_DO_NOT_USE__
-    }
-  }
-  if (isReactElement(node)) {
-    return copyProps({}, node)
-  }
-  return node
-}
-
-function clean(node: any, classNames: string[]) {
-  if (Array.isArray(node)) {
-    for (const child of node) {
-      clean(child, classNames)
-    }
-    return
-  }
-  if (node.children) {
-    for (const child of node.children) {
-      clean(child, classNames)
-    }
-  }
-  if (node.props) {
-    const { className } = node.props
-    if (!className) {
-      // if it's empty, remove it
-      delete node.props.className
-    } else {
-      const hasKnownClass = hasIntersection(className.split(' '), classNames)
-      if (hasKnownClass) {
-        delete node.props.css
-      }
-    }
-  }
-}
-
-export function createSerializer({
-  classNameReplacer,
-  DOMElements = true
-}: Options = {}) {
-  const cache = new WeakSet()
-  const isTransformed = val => cache.has(val)
-
-  function serialize(
-    val: *,
-    config: *,
-    indentation: string,
-    depth: number,
-    refs: *,
-    printer: Function
-  ) {
-    const elements = getStyleElements()
-    const keys = getKeys(elements)
-    const convertEmotionElements = createConvertEmotionElements(keys, printer)
-    const converted = deepTransform(val, convertEmotionElements)
-    const nodes = getNodes(converted)
-    const classNames = getClassNamesFromNodes(nodes)
-    const styles = getPrettyStylesFromClassNames(
-      classNames,
-      elements,
-      config.indent
-    )
-    clean(converted, classNames)
-
-    nodes.forEach(cache.add, cache)
-    const printedVal = printer(converted, config, indentation, depth, refs)
-    nodes.forEach(cache.delete, cache)
-
-    return replaceClassNames(
-      classNames,
-      styles,
-      printedVal,
-      keys,
-      classNameReplacer
-    )
-  }
-
-  return {
-    test(val: *) {
-      return (
-        val &&
-        (!isTransformed(val) &&
-          (isReactElement(val) || (DOMElements && isDOMElement(val))))
-      )
-    },
-    serialize
-  }
-}
-
-export default createSerializer()
+import { createSerializer } from './create-serializer'
+export const { test, serialize } = createSerializer()
diff --git a/packages/jest/test/preact.test.js b/packages/jest/test/preact.test.js
index 5ae3c12e4a..70bd010cb8 100644
--- a/packages/jest/test/preact.test.js
+++ b/packages/jest/test/preact.test.js
@@ -5,9 +5,11 @@ import { h } from 'preact'
 import render from 'preact-render-to-json'
 import prettyFormat from 'pretty-format'
 import * as emotion from '@emotion/css'
-import emotionPlugin from '@emotion/jest'
+import { createSerializer } from '@emotion/jest'
 const { ReactElement, ReactTestComponent, DOMElement } = prettyFormat.plugins
 
+let emotionPlugin = createSerializer()
+
 describe('jest-emotion with preact', () => {
   const divStyle = emotion.css`
     color: red;
diff --git a/packages/jest/test/react-enzyme.test.js b/packages/jest/test/react-enzyme.test.js
index 9d18307c1c..0c7df64361 100644
--- a/packages/jest/test/react-enzyme.test.js
+++ b/packages/jest/test/react-enzyme.test.js
@@ -8,7 +8,7 @@ import styled from '@emotion/styled'
 import React from 'react'
 import toJson from 'enzyme-to-json'
 
-import serializer from '@emotion/jest/enzyme'
+import * as serializer from '@emotion/jest/enzyme-serializer'
 
 expect.addSnapshotSerializer(serializer)
 
diff --git a/packages/jest/types/enzyme-serializer.d.ts b/packages/jest/types/enzyme-serializer.d.ts
new file mode 100644
index 0000000000..e53372b1db
--- /dev/null
+++ b/packages/jest/types/enzyme-serializer.d.ts
@@ -0,0 +1,9 @@
+/// <reference types="jest" />
+
+type SnapshotSerializerPlugin = Extract<
+  jest.SnapshotSerializerPlugin,
+  { serialize: any }
+>
+
+export const test: SnapshotSerializerPlugin['test']
+export const serialize: SnapshotSerializerPlugin['serialize']
diff --git a/packages/jest/types/index.d.ts b/packages/jest/types/index.d.ts
index c60dd739ca..c321411761 100644
--- a/packages/jest/types/index.d.ts
+++ b/packages/jest/types/index.d.ts
@@ -30,8 +30,10 @@ export interface CreateSerializerOptions {
 export function createSerializer(
   options?: CreateSerializerOptions
 ): SnapshotSerializerPlugin
-declare const serializer: SnapshotSerializerPlugin
-export default serializer
+
+export function createEnzymeSerializer(
+  options?: CreateSerializerOptions
+): SnapshotSerializerPlugin
 
 declare global {
   namespace jest {
diff --git a/packages/jest/types/serializer.d.ts b/packages/jest/types/serializer.d.ts
new file mode 100644
index 0000000000..e53372b1db
--- /dev/null
+++ b/packages/jest/types/serializer.d.ts
@@ -0,0 +1,9 @@
+/// <reference types="jest" />
+
+type SnapshotSerializerPlugin = Extract<
+  jest.SnapshotSerializerPlugin,
+  { serialize: any }
+>
+
+export const test: SnapshotSerializerPlugin['test']
+export const serialize: SnapshotSerializerPlugin['serialize']
diff --git a/scripts/test-utils/legacy-env.js b/scripts/test-utils/legacy-env.js
index 11a4e2651f..19af57e782 100644
--- a/scripts/test-utils/legacy-env.js
+++ b/scripts/test-utils/legacy-env.js
@@ -1,7 +1,7 @@
 // @flow
 /* eslint-env jest */
 import 'test-utils/enzyme-env'
-import serializer from '@emotion/jest/enzyme'
+import { createEnzymeSerializer } from '@emotion/jest'
 
 // $FlowFixMe jest flow type definitions don't include new plugin API
-expect.addSnapshotSerializer(serializer)
+expect.addSnapshotSerializer(createEnzymeSerializer())
diff --git a/scripts/test-utils/next-env.js b/scripts/test-utils/next-env.js
index 453da77580..c8cc860692 100644
--- a/scripts/test-utils/next-env.js
+++ b/scripts/test-utils/next-env.js
@@ -1,6 +1,6 @@
 // @flow
 /* eslint-env jest */
-import serializer from '@emotion/jest'
+import { createSerializer } from '@emotion/jest'
 
 // $FlowFixMe jest flow type definitions don't include new plugin API
-expect.addSnapshotSerializer(serializer)
+expect.addSnapshotSerializer(createSerializer())
diff --git a/yarn.lock b/yarn.lock
index ff91cee161..47e7255b60 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1314,6 +1314,11 @@
     "@emotion/utils" "0.11.3"
     csstype "^2.5.7"
 
+"@emotion/utils@0.11.3":
+  version "0.11.3"
+  resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.3.tgz#a759863867befa7e583400d322652a3f44820924"
+  integrity sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw==
+
 "@gatsbyjs/relay-compiler@2.0.0-printer-fix.2":
   version "2.0.0-printer-fix.2"
   resolved "https://registry.npmjs.org/@gatsbyjs/relay-compiler/-/relay-compiler-2.0.0-printer-fix.2.tgz#214db0e6072d40ea78ad5fabdb49d56bc95f4e99"
@@ -5136,7 +5141,7 @@ browserify-zlib@^0.2.0:
   dependencies:
     pako "~1.0.5"
 
-browserslist@3.2.8:
+browserslist@3.2.8, browserslist@4.1.1, browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6, browserslist@^2.1.2, browserslist@^2.5.1, browserslist@^3.2.8, browserslist@^4.0.0, browserslist@^4.1.0, browserslist@^4.3.4, browserslist@^4.6.0, browserslist@^4.6.2, browserslist@^4.6.4, browserslist@^4.7.3:
   version "3.2.8"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-3.2.8.tgz#b0005361d6471f0f5952797a76fc985f1f978fc6"
   integrity sha512-WHVocJYavUwVgVViC0ORikPHQquXwVh939TaelZ4WDqpWgTX/FsGhl/+P4qBUAGcRvtOgDgC+xftNWWp2RUTAQ==
@@ -5144,41 +5149,6 @@ browserslist@3.2.8:
     caniuse-lite "^1.0.30000844"
     electron-to-chromium "^1.3.47"
 
-browserslist@4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.1.1.tgz#328eb4ff1215b12df6589e9ab82f8adaa4fc8cd6"
-  integrity sha512-VBorw+tgpOtZ1BYhrVSVTzTt/3+vSE3eFUh0N2GCFK1HffceOaf32YS/bs6WiFhjDAblAFrx85jMy3BG9fBK2Q==
-  dependencies:
-    caniuse-lite "^1.0.30000884"
-    electron-to-chromium "^1.3.62"
-    node-releases "^1.0.0-alpha.11"
-
-browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
-  version "1.7.7"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.7.tgz#0bd76704258be829b2398bb50e4b62d1a166b0b9"
-  integrity sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=
-  dependencies:
-    caniuse-db "^1.0.30000639"
-    electron-to-chromium "^1.2.7"
-
-browserslist@^2.1.2, browserslist@^2.5.1:
-  version "2.11.3"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-2.11.3.tgz#fe36167aed1bbcde4827ebfe71347a2cc70b99b2"
-  integrity sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==
-  dependencies:
-    caniuse-lite "^1.0.30000792"
-    electron-to-chromium "^1.3.30"
-
-browserslist@^4.0.0, browserslist@^4.1.0, browserslist@^4.3.4, browserslist@^4.6.0, browserslist@^4.6.2, browserslist@^4.6.4, browserslist@^4.7.3:
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.12.0.tgz#06c6d5715a1ede6c51fc39ff67fd647f740b656d"
-  integrity sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg==
-  dependencies:
-    caniuse-lite "^1.0.30001043"
-    electron-to-chromium "^1.3.413"
-    node-releases "^1.1.53"
-    pkg-up "^2.0.0"
-
 bser@1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/bser/-/bser-1.0.2.tgz#381116970b2a6deea5646dd15dd7278444b56169"
@@ -5553,21 +5523,11 @@ caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634:
   resolved "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000988.tgz#6a761a0204c4c41977b0379fb14f51d367c5e4ee"
   integrity sha512-P0JCbGJhL1tTTeF+ehckvXwtckRursLDbA/ETdAd8Yg1ROAGJ5OgYgMONW1zWW1+ZTB79d7ZeJiOHGreEGG1ew==
 
-caniuse-db@^1.0.30000639:
-  version "1.0.30001085"
-  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30001085.tgz#4f6fcf0c10e69fabad8cf237b5990ee09718d7d8"
-  integrity sha512-+w8XO3jUi79lgiBANacwq/ZY8EnkOcatTyT7z03z/YxL2kysI9h3jUGKafkCkP69F4jpKXSjhJ9BUvsgQrGFpA==
-
 caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000748, caniuse-lite@^1.0.30000844, caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001010:
   version "1.0.30001012"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001012.tgz#653ec635e815b9e0fb801890923b0c2079eb34ec"
   integrity sha512-7RR4Uh04t9K1uYRWzOJmzplgEOAXbfK72oVNokCdMzA67trrhPzy93ahKk1AWHiA0c58tD2P+NHqxrA8FZ+Trg==
 
-caniuse-lite@^1.0.30000792, caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30001043:
-  version "1.0.30001085"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001085.tgz#bed28bd51ff7425d33ee23e730c7f3b703711db6"
-  integrity sha512-x0YRFRE0pmOD90z+9Xk7jwO58p4feVNXP+U8kWV+Uo/HADyrgESlepzIkUqPgaXkpyceZU6siM1gsK7sHgplqA==
-
 capture-exit@^1.2.0:
   version "1.2.0"
   resolved "https://registry.npmjs.org/capture-exit/-/capture-exit-1.2.0.tgz#1c5fcc489fd0ab00d4f1ac7ae1072e3173fbab6f"
@@ -7956,11 +7916,6 @@ ejs@^2.6.1:
   resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.7.1.tgz#5b5ab57f718b79d4aca9254457afecd36fa80228"
   integrity sha512-kS/gEPzZs3Y1rRsbGX4UOSjtP/CeJP0CxSNZHYxGfVM/VgLcv0ZqM7C45YyTj2DI2g7+P9Dd24C+IMIg6D0nYQ==
 
-electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30, electron-to-chromium@^1.3.413, electron-to-chromium@^1.3.62:
-  version "1.3.480"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.480.tgz#190ae45074578349a4c4f336fba29e76b20e9ef5"
-  integrity sha512-wnuUfQCBMAdzu5Xe+F4FjaRK+6ToG6WvwG72s8k/3E6b+hoGVYGiQE7JD1NhiCMcqF3+wV+c2vAnaLGRSSWVqA==
-
 electron-to-chromium@^1.3.47:
   version "1.3.212"
   resolved "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.212.tgz#15d81ba96edb8ae6f937cde0fdb18c1c3c2bfec5"
@@ -11105,7 +11060,7 @@ graphql-request@^1.5.0:
   dependencies:
     cross-fetch "2.2.2"
 
-graphql-type-json@^0.2.4:
+graphql-type-json@0.2.4, graphql-type-json@^0.2.4:
   version "0.2.4"
   resolved "https://registry.yarnpkg.com/graphql-type-json/-/graphql-type-json-0.2.4.tgz#545af27903e40c061edd30840a272ea0a49992f9"
   integrity sha512-/tq02ayMQjrG4oDFDRLLrPk0KvJXue0nVXoItBe7uAdbNXjQUu+HYCBdAmPLQoseVzUKKMzrhq2P/sfI76ON6w==
@@ -16593,11 +16548,6 @@ node-pre-gyp@^0.12.0:
     semver "^5.3.0"
     tar "^4"
 
-node-releases@^1.0.0-alpha.11, node-releases@^1.1.53:
-  version "1.1.58"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.58.tgz#8ee20eef30fa60e52755fcc0942def5a734fe935"
-  integrity sha512-NxBudgVKiRh/2aPWMgPR7bPTX0VPmGx5QBwCtdHitnqFE5/O8DeBXuIMH1nwNnw/aMo6AjOrpsHzfY3UbUJ7yg==
-
 node-rest-client@^1.5.1:
   version "1.8.0"
   resolved "https://registry.npmjs.org/node-rest-client/-/node-rest-client-1.8.0.tgz#8d3c566b817e27394cb7273783a41caefe3e5955"
@@ -18154,7 +18104,7 @@ pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
-pkg-up@2.0.0, pkg-up@^2.0.0:
+pkg-up@2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f"
   integrity sha1-yBmscoBZpGHKscOImivjxJoATX8=
@@ -19949,7 +19899,7 @@ react-devtools-core@^3.6.3:
     shell-quote "^1.6.1"
     ws "^3.3.1"
 
-react-dom@^16.11.0:
+react-dom@16.11.0, react-dom@^16.11.0:
   version "16.11.0"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.11.0.tgz#7e7c4a5a85a569d565c2462f5d345da2dd849af5"
   integrity sha512-nrRyIUE1e7j8PaXSPtyRKtz+2y9ubW/ghNgqKFHHAHaeP0fpF5uXR+sq8IMRHC+ZUxw7W9NyCDTBtwWxvkb0iA==
@@ -20213,7 +20163,7 @@ react-timer-mixin@^0.13.3:
   resolved "https://registry.npmjs.org/react-timer-mixin/-/react-timer-mixin-0.13.4.tgz#75a00c3c94c13abe29b43d63b4c65a88fc8264d3"
   integrity sha512-4+ow23tp/Tv7hBM5Az5/Be/eKKF7DIvJ09voz5LyHGQaqqz9WV8YMs31eFvcYQs7d451LSg7kDJV70XYN/Ug/Q==
 
-react@^16.11.0, react@^16.8.4:
+react@16.11.0, react@^16.11.0, react@^16.8.4:
   version "16.11.0"
   resolved "https://registry.yarnpkg.com/react/-/react-16.11.0.tgz#d294545fe62299ccee83363599bf904e4a07fdbb"
   integrity sha512-M5Y8yITaLmU0ynd0r1Yvfq98Rmll6q8AxaEe88c8e7LxO8fZ2cNgmFt0aGAS9wzf1Ao32NKXtCl+/tVVtkxq6g==