joetidee / enzyme-react-intl

A complimentary wrapper function for use with Enzyme, when testing React components that rely on react-intl
MIT License
45 stars 15 forks source link

Difficulty running tests #23

Open SpencerWhitehead7 opened 5 years ago

SpencerWhitehead7 commented 5 years ago

I'm having difficulty getting the tests to run. I forked and downloaded the repo and I haven't modified anything. When I run npm test , mocha-webpack appears to run and compile everything, but no tests are actually performed. How can I run the tests for this repo? enzyme-react-intl-tests

thefossedog commented 5 years ago

Hey Spencer, ran into the same problem as you, it looks like mocha-webpack isnt supported by newer versions of webpack. I did a fair bit of hacking at the code and got all but one test to work, you can check the mods in this branch https://github.com/thefossedog/enzyme-react-intl/tree/hackityhack its not pretty and possibly some of the changes I have made aren't required but I'm quite new to js and this pushed my boundaries a bit

SpencerWhitehead7 commented 5 years ago

Everything about this project is super out of date. I have all the tests passing with your set of dependency changes and webpack config and this test code

import React from "react";
import { JSDOM } from "jsdom";
import chai, { expect } from "chai";
import chaiSubset from "chai-subset";
import chaiEnzyme from "chai-enzyme";
import jsonfile from "jsonfile";

const window = new JSDOM("").window;
global.document = window.document;
global.window = window;

chai.use(chaiSubset);
chai.use(chaiEnzyme());

import {
  loadTranslation,
  loadTranslationObject,
  shallowWithIntl,
  mountWithIntl,
  renderWithIntl,
  setLocale,
  getLocale
} from "../src/index.js";
import Test from "./testComponent.jsx";

const testLanguageFile = "./test/testLanguageFile.json";
const testLanguageFileMessages = jsonfile.readFileSync(testLanguageFile);

describe("enzymeReactIntl", function() {
  it("locale should not be empty", function() {
    const localeGet = getLocale();

    expect(localeGet).to.not.equal("");
  });

  describe("setLocale", function() {
    it("should set the locale", function() {
      const localeSet = "en-GB";

      expect(getLocale()).not.to.equal(localeSet);

      setLocale(localeSet);

      expect(getLocale()).to.equal(localeSet);
    });
  });

  describe("loadTranslation", function() {
    it("should load messages from the language file", function() {
      const messages = loadTranslation("/test/testLanguageFile.json");

      expect(messages).to.deep.equal(testLanguageFileMessages);
    });
  });

  describe("loadTranslationObject", function() {
    const translations = { test: "I'm a test translation" };

    it("should load messages from the translations object", function() {
      const messages = loadTranslationObject(translations);

      expect(messages).to.deep.equal(translations);
    });
  });

  describe("shallowWithIntl", function() {
    it("should have intl prop passed to the component", function() {
      loadTranslation("/test/testLanguageFile.json");
      const wrapper = shallowWithIntl(<Test />);
      const p = wrapper.instance().props;

      expect(p).to.contain.key("intl");
    });
  });

  describe("mountWithIntl", function() {
    it("should have intl prop passed to the component", function() {
      loadTranslation("/test/testLanguageFile.json");
      const wrapper = mountWithIntl(<Test />);
      const p = wrapper.instance().props;

      expect(p).to.contain.key("intl");
    });
  });

  describe("renderWithIntl", function() {
    it("should render the appropriate translation", function() {
      loadTranslation("/test/testLanguageFile.json");
      const wrapper = renderWithIntl(<Test />);

      expect(wrapper.text()).to.match(/Message 1/);
    });
    it("should render using the default translations", function() {
      loadTranslation(undefined);
      const wrapper = renderWithIntl(<Test />);

      expect(wrapper.text()).to.equal("first_msg");
    });
    it("should render using the default translations 2", function() {
      loadTranslationObject(undefined);
      const wrapper = renderWithIntl(<Test />);

      expect(wrapper.text()).to.equal("first_msg");
    });
  });
});

The JSDOM setup is different from yours, but the tests are untouched; exactly the same as in the original repo.

I'd sort of like to get everything about this repo up to date and written like modern JS, but I don't think it's being maintained at all anymore and it still works OK for my uses, so there might not be a reason to.

Maybe if your PR gets merged in/responded to I'll give it a shot.