Fix matchMedia not present in jest test (ant-design#7344)

close ant-design#6560 close ant-design#3308 close ant-design#7341
nanqiu · Aug 27, 2017 · 742999f · 742999f
1 parent d84452e
commit 742999f
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 17 deletions.
diff --git a/components/carousel/index.tsx b/components/carousel/index.tsx
@@ -1,7 +1,8 @@
-// matchMedia polyfill for
-// https://github.com/WickyNilliams/enquire.js/issues/82
+import React from 'react';
 import debounce from 'lodash.debounce';
 
+// matchMedia polyfill for
+// https://github.com/WickyNilliams/enquire.js/issues/82
 if (typeof window !== 'undefined') {
   const matchMediaPolyfill = (mediaQuery: string): MediaQueryList => {
     return {
@@ -15,9 +16,11 @@ if (typeof window !== 'undefined') {
   };
   window.matchMedia = window.matchMedia || matchMediaPolyfill;
 }
-
-import SlickCarousel from 'react-slick';
-import React from 'react';
+// Use require over import (will be lifted up)
+// make sure matchMedia polyfill run before require('react-slick')
+// Fix https://github.com/ant-design/ant-design/issues/6560
+// Fix https://github.com/ant-design/ant-design/issues/3308
+const SlickCarousel = require('react-slick').default;
 
 export type CarouselEffect = 'scrollx' | 'fade';
 // Carousel

diff --git a/tests/setup.js b/tests/setup.js
@@ -2,17 +2,6 @@ import { jsdom } from 'jsdom';
 
 // fixed jsdom miss
 if (typeof window !== 'undefined') {
-  const matchMediaPolyfill = function matchMediaPolyfill() {
-    return {
-      matches: false,
-      addListener() {
-      },
-      removeListener() {
-      },
-    };
-  };
-  window.matchMedia = window.matchMedia || matchMediaPolyfill;
-
   const documentHTML = '<!doctype html><html><body><div id="root"></div></body></html>';
   global.document = jsdom(documentHTML);
   global.window = document.parentWindow;

diff --git a/typings/custom-typings.d.ts b/typings/custom-typings.d.ts
@@ -90,4 +90,6 @@ declare module "*.json" {
   export default value;
 }
 
-declare module "prop-types"
+declare module "prop-types"
+
+declare function require(name: string): any;