[WIP] feat(locale): createMockWrapper

[imhele]

Checklist

• npm test passes
• tests are included
• documentation is changed or added
• commit message follows commit guidelines
• types definition

Description of change

• any feature?

import { mount } from 'enzyme';
import { createMockWrapper, getLocaleFileList } from 'umi-plugin-locale'; // or 'umi-plugin-react/locale'
const MockWrapper = createMockWrapper(getLocaleFileList(absSrcPath, absPagesPath, singular));
const enzymeWrapper = mount(<MockWrapper><MyComponent /></MockWrapper>);

• close 测试时提示：formatMessage not initialized yet, you should use it after react app mounted #2156

[afc163]

👍 We may need a import { createMockWrapper } from 'umi'; to deal with react-router and dva stuffs too.

[coveralls]

Pull Request Test Coverage Report for Build 3672

• 104 of 112 (92.86%) changed or added relevant lines in 2 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage increased (+1.4%) to 37.426%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
packages/umi-plugin-locale/src/mock.js	103	111	92.79%

Totals
Change from base Build 3670:	1.4%
Covered Lines:	1508
Relevant Lines:	4044

---

💛 - Coveralls

[imhele]

@yutingzhao1991 基本 ok 了，抽空帮忙 review 一下 🤓

[imhele]

👍 We may need a import { createMockWrapper } from 'umi'; to deal with react-router and dva stuffs too.

It's a good idea, I'll take some time to try 🧐

[yutingzhao1991]

some conflicts.

[yutingzhao1991]

应该不能这样，locale.js 这个文件是在浏览器端执行的，index.js 是在 node 端执行的，这样会导致一些 node 的模块被引用到浏览器中。

[yutingzhao1991]

createMockWrapper 和 getLocaleFileList 怎么用？

import { createMockWrapper, getLocaleFileList } from 'umi-plugin-locale' ？

在 jest 中执行的时候会去读 package.json 里面的 browser 吗？

感觉似乎下面这样会更好一点：

import { createMockWrapper, getLocaleFileList } from 'umi-plugin-locale/test';

用于测试的单独暴露出来，避免打包到最终的构建产物中。

cc @sorrycc 这个你也看看，未来可能别的插件也有类似的需求，不知道社区流行的做法是什么样的？

[imhele]

对，那我把这个函数移到 mock.js 里

[imhele]

可不可以把功能继承在 umi-test ，类似：

// config file
export default {
  plugins: [
    'umi-plugin-dva', { enableTestWrapper: true },
    'umi-plugin-locale', { enableTestWrapper: { configHere: 'xxx' } },
  ],
}

// test file
import { createWrapper } from 'umi-test';
// createWrapper 默认使用 config 中各个 plugin 的 enableTestWrapper 配置项，也可以在测试文件中修改
const Wrapper = createWrapper({ dva: false, locale: { configHere: 'xxx' } });

umi-test 中的 createWrapper 创建 Wrapper ，按配置文件中 plugins 的顺序包裹测试组件，插件开发时可以通过 umi 的 api 挂载自己的 createWrapper 供 umi-test 调用

[yutingzhao1991]

有冲突了。

[yutingzhao1991]

@sorrycc 测试这个方案看看，有没有什么想法。感觉这个要统一考虑。

[yutingzhao1991]

mock 这个可以在 https://github.com/umijs/rfcs 这里起一个 RFC 来设计个通用的方案。