xcatliu / react-ie8

Make your React app work in IE8
http://react-ie8.xcatliu.com/
998 stars 162 forks source link

MatchMedia error when run own tests #40

Open Danjavia opened 7 years ago

Danjavia commented 7 years ago

Pls, can you helpme?

Your project includes the enquirejs dependency. But I have issues when try to run tests into my project because

matchMedia not present, legacy browsers require a polyfill

I don't know how to solve this issue.

this is my code

import React from 'react';
import { shallow } from 'enzyme';
import { expect } from 'chai';

// Import components for testing here
import NavbarCrm from '../NavbarCrmComponent';

describe('<NavbarCrm />', function () {

  if (typeof window !== 'undefined') {
    var matchMediaPolyfill = function matchMediaPolyfill(mediaQuery) {
      return {
        media: mediaQuery,
        matches: false,
        addListener: function addListener() {},
        removeListener: function removeListener() {}
      };
    };
    window.matchMedia = window.matchMedia || matchMediaPolyfill;
  }

  it('should have props for heading and children', function (done) {
    const wrapper = shallow(<Menu />);
    expect(wrapper.props().classes).to.be.defined;
    expect(wrapper.props().children).to.be.defined;
    done();
  });
});

I tried in all methods. Above, below but the same error ever.

Can U help me?

I cant to solve the issue putting

if (typeof window !== 'undefined') {
    var matchMediaPolyfill = function matchMediaPolyfill(mediaQuery) {
      return {
        media: mediaQuery,
        matches: false,
        addListener: function addListener() {},
        removeListener: function removeListener() {}
      };
    };
    window.matchMedia = window.matchMedia || matchMediaPolyfill;
  }

I include the above code in the line 49826 located at andt.js file into my node_modules And the problem is over. but this is not a good solution.

into enquirejs/src/include/wrap.js into the dist file for npm installed module. But it isn't a pretty solution.

xcatliu commented 7 years ago

Have you tried to include

if (typeof window !== 'undefined') {
    var matchMediaPolyfill = function matchMediaPolyfill(mediaQuery) {
      return {
        media: mediaQuery,
        matches: false,
        addListener: function addListener() {},
        removeListener: function removeListener() {}
      };
    };
    window.matchMedia = window.matchMedia || matchMediaPolyfill;
  }
}

in the beginning of your entry JavaScript file?

Danjavia commented 7 years ago

Yes, I Do, but not work! :(