├── test ├── fixture │ ├── .env │ ├── pages │ │ ├── index.css │ │ ├── .eslintrc │ │ └── index.js │ ├── data │ │ ├── hubname.json │ │ └── hubname │ │ │ ├── hubname_ALL_api#test1.json │ │ │ └── hubname_ALL_api#test1 │ │ │ └── scene │ │ │ └── default.json │ ├── package.json │ └── .umirc.js ├── mocha.opts └── launch.test.js ├── .eslintignore ├── .gitignore ├── screenshots ├── 1.png └── 2.png ├── ui ├── dataHub.module.less ├── index.jsx └── dataHub.jsx ├── .travis.yml ├── .fatherrc.js ├── .eslintrc ├── README.zh.md ├── package.json ├── index.js └── README.md /test/fixture/.env: -------------------------------------------------------------------------------- 1 | CLEAR_CONSOLE=none 2 | -------------------------------------------------------------------------------- /test/mocha.opts: -------------------------------------------------------------------------------- 1 | --reporter spec 2 | --timeout 60000 -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | coverage 3 | test 4 | dist 5 | -------------------------------------------------------------------------------- /test/fixture/pages/index.css: -------------------------------------------------------------------------------- 1 | .normal { 2 | background: #9BF279; 3 | } 4 | -------------------------------------------------------------------------------- /test/fixture/pages/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true 4 | } 5 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | yarn.lock 3 | .umi 4 | .umi-production 5 | *.sw* 6 | dist 7 | -------------------------------------------------------------------------------- /screenshots/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/umijs/umi-plugin-datahub/HEAD/screenshots/1.png -------------------------------------------------------------------------------- /screenshots/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/umijs/umi-plugin-datahub/HEAD/screenshots/2.png -------------------------------------------------------------------------------- /ui/dataHub.module.less: -------------------------------------------------------------------------------- 1 | .spin { 2 | :global { 3 | .ant-spin-nested-loading, .ant-spin-container { 4 | height: 100%; 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /test/fixture/data/hubname.json: -------------------------------------------------------------------------------- 1 | { 2 | "projectName": "hubname", 3 | "description": "示例", 4 | "globalProxy": null, 5 | "uniqId": "3b45d608-c481-43b5-8857-95313d23d2a5" 6 | } -------------------------------------------------------------------------------- /test/fixture/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "devDependencies": { 3 | "umi": "2" 4 | }, 5 | "scripts": { 6 | "dev": "umi dev", 7 | "dev:ui": "UMI_UI=1 umi dev" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | sudo: false 2 | language: node_js 3 | node_js: 4 | - '10' 5 | cache: 6 | npm: false 7 | install: 8 | - npm i npminstall && npminstall 9 | script: 10 | - npm run lint 11 | - npm run build 12 | - npm test 13 | -------------------------------------------------------------------------------- /.fatherrc.js: -------------------------------------------------------------------------------- 1 | export default [ 2 | { 3 | entry: 'ui/index.jsx', 4 | disableTypeCheck: true, 5 | typescriptOpts: { 6 | check: false, 7 | }, 8 | umd: { 9 | name: 'umi-plugin-datahub', 10 | minFile: false, 11 | }, 12 | }, 13 | ]; 14 | -------------------------------------------------------------------------------- /test/fixture/.umirc.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | plugins: ['../../'], 5 | datahub: { 6 | proxy: { 7 | '^/api': { 8 | hub: 'hubname', 9 | }, 10 | }, 11 | store: path.join(__dirname, 'data'), 12 | }, 13 | } 14 | -------------------------------------------------------------------------------- /test/fixture/data/hubname/hubname_ALL_api#test1.json: -------------------------------------------------------------------------------- 1 | { 2 | "protocol": "http", 3 | "pathname": "api/test1", 4 | "method": "ALL", 5 | "projectUniqId": "3b45d608-c481-43b5-8857-95313d23d2a5", 6 | "description": "测试接口", 7 | "currentScene": "default", 8 | "proxyConfig": { 9 | "enabled": false 10 | }, 11 | "uniqId": "e188a1e9-d189-4c57-b06a-533d1beebf8f" 12 | } -------------------------------------------------------------------------------- /test/fixture/data/hubname/hubname_ALL_api#test1/scene/default.json: -------------------------------------------------------------------------------- 1 | { 2 | "sceneName": "default", 3 | "data": { 4 | "foo": "bar" 5 | }, 6 | "interfaceUniqId": "e188a1e9-d189-4c57-b06a-533d1beebf8f", 7 | "contextConfig": { 8 | "responseDelay": 0, 9 | "responseStatus": 200, 10 | "responseHeaders": {} 11 | }, 12 | "uniqId": "166122d7-ae24-4422-9599-cd2f2312da0f" 13 | } -------------------------------------------------------------------------------- /ui/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import DataHub from './dataHub'; 3 | 4 | export default api => { 5 | api.addPanel({ 6 | title: 'DataHub', 7 | path: '/datahub', 8 | icon: , 9 | component: () => , 10 | headerTitle: null, 11 | }); 12 | }; 13 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "root": true, 3 | "extends": [ 4 | "eslint:recommended", 5 | "plugin:react/recommended", 6 | "prettier" 7 | ], 8 | "parser": "babel-eslint", 9 | "parserOptions": { 10 | "ecmaFeatures": { 11 | "jsx": true, 12 | "modules": true 13 | } 14 | }, 15 | "plugins": [ "react" ], 16 | "rules": { 17 | "prefer-const": "warn", 18 | "no-console": "off", 19 | "no-loop-func": "warn", 20 | "new-cap": "off", 21 | "no-param-reassign": "warn", 22 | "func-names": "off", 23 | "no-unused-expressions" : "error", 24 | "block-scoped-var": "error", 25 | "react/prop-types": "off", 26 | "react/react-in-jsx-scope": "off", 27 | "react/display-name": "off" 28 | }, 29 | "settings": { 30 | "react": { 31 | "pragma": "React", 32 | "version": "16.2" 33 | } 34 | }, 35 | "env": { 36 | "es6": true, 37 | "node": true 38 | } 39 | } -------------------------------------------------------------------------------- /test/fixture/pages/index.js: -------------------------------------------------------------------------------- 1 | import * as React from "react"; 2 | 3 | import styles from './index.css'; 4 | 5 | export default class extends React.Component { 6 | constructor(props) { 7 | super(props); 8 | this.state = { 9 | title: 'doing request...', 10 | loading: true, 11 | }; 12 | } 13 | 14 | componentWillMount() { 15 | fetch('/api/test1') 16 | .then(function(response) { 17 | if (response.status >= 400) { 18 | throw new Error('Bad response from server'); 19 | } 20 | return response.json(); 21 | }) 22 | .then(res => { 23 | this.setState({ 24 | title: `value from mock: ${res.foo}`, 25 | loading: false, 26 | }) 27 | }); 28 | } 29 | 30 | render() { 31 | return ( 32 |
33 | {!this.state.loading && ( 34 |

{this.state.title}

35 | )} 36 |
37 | ); 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /ui/dataHub.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Spin } from 'antd'; 3 | import styles from './dataHub.module.less'; 4 | 5 | 6 | const DataHub = props => { 7 | const { callRemote, getLocale } = props.api; 8 | const [port, setPort] = React.useState(); 9 | const [loading, setLoading] = React.useState(true); 10 | 11 | React.useEffect(() => { 12 | const getPort = async () => { 13 | const { port } = await callRemote({ 14 | type: 'org.umi.datahub.getPort', 15 | }) 16 | setPort(port); 17 | } 18 | getPort(); 19 | }, []); 20 | 21 | const onIframeReady = () => { 22 | setLoading(false); 23 | } 24 | 25 | const locale = getLocale(); 26 | 27 | return ( 28 |
29 | 30 | {port && 31 | 32 | } 33 | 34 |
35 | ); 36 | }; 37 | 38 | export default DataHub; 39 | -------------------------------------------------------------------------------- /README.zh.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | Macaca 8 | 9 |

10 | 11 | # umi-plugin-datahub 12 | 13 | [English Edition](./README.md) | [项目主页](//macacajs.github.io/macaca-datahub/zh) 14 | 15 | --- 16 | 17 | [macaca-datahub](//github.com/macacajs/macaca-datahub) 的 umi 插件，解决从本地开发阶段，到集成测试阶段，以及上线前验证阶段的一系列数据环境需求，研发与测试工程师只需面向 DataHub 管理数据即可。 18 | 19 |
20 | 21 |
22 | 23 | ## 安装 24 | 25 | ```bash 26 | $ npm i umi-plugin-datahub -D 27 | ``` 28 | 29 | 在 `.umirc.js` 中增加如下配置： 30 | 31 | ```js 32 | export default { 33 | plugins: [ 34 | 'umi-plugin-datahub', 35 | ], 36 | }; 37 | ``` 38 | 39 | ## 配置项 40 | 41 | 42 | ```javascript 43 | export default { 44 | plugins: [ 45 | ['umi-plugin-datahub', { 46 | proxy: { 47 | '^/api': { 48 | hub: 'hubname', 49 | }, 50 | }, 51 | store: path.join(__dirname, 'data'), 52 | }], 53 | ], 54 | }; 55 | ``` 56 | 57 | 更多配置见：[macaca-datahub](//macacajs.github.io/macaca-datahub/zh/guide/) 58 | 59 | ## 开发 60 | 61 | 调试插件 62 | 63 | ```bash 64 | $ cd test/fixture 65 | $ npm run dev 66 | ``` 67 | 68 | 调试 UI 69 | 70 | ```bash 71 | # watch build 72 | $ npm run build -- -w 73 | $ cd test/fixture 74 | $ npm run dev:ui 75 | ``` 76 | 77 | 78 | ## 工程示例 79 | 80 | - [umi-examples](//github.com/umijs/umi-examples/tree/master/eleme-demo) 81 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "umi-plugin-datahub", 3 | "version": "5.3.0", 4 | "repository": { 5 | "type": "git", 6 | "url": "https://github.com/umijs/umi-plugin-datahub" 7 | }, 8 | "homepage": "https://github.com/umijs/umi-plugin-datahub", 9 | "authors": [ 10 | "chencheng (https://github.com/sorrycc)", 11 | "xudafeng (https://github.com/xudafeng)" 12 | ], 13 | "main": "index.js", 14 | "bugs": { 15 | "url": "https://github.com/umijs/umi-plugin-datahub/issues" 16 | }, 17 | "scripts": { 18 | "build": "father-build", 19 | "prepublishOnly": "npm run build && np --no-cleanup --yolo --no-publish", 20 | "lint": "eslint . --fix", 21 | "test": "mocha", 22 | "contributor": "git-contributor" 23 | }, 24 | "peerDependencies": { 25 | "antd": "4.x", 26 | "react": "^16.8.6", 27 | "react-dom": "^16.8.6", 28 | "umi": "3.x" 29 | }, 30 | "dependencies": { 31 | "datahub-proxy-middleware": "4.x", 32 | "macaca-datahub": "^4.1.0", 33 | "yargs-parser": "^16.1.0" 34 | }, 35 | "devDependencies": { 36 | "@ant-design/icons": "^4.0.0-alpha.11", 37 | "@types/react": "^16.9.16", 38 | "@types/react-dom": "^16.9.4", 39 | "@umijs/fabric": "^1.2.12", 40 | "antd": "^4.0.0-beta.0", 41 | "babel-eslint": "^10.0.3", 42 | "datahub-nodejs-sdk": "^2.2.1", 43 | "eslint": "^6.4.0", 44 | "eslint-config-prettier": "^6.3.0", 45 | "eslint-plugin-react": "^7.14.3", 46 | "father-build": "^1.17.1", 47 | "git-contributor": "1", 48 | "mocha": "^6.2.2", 49 | "np": "^5.2.1", 50 | "puppeteer": "^2.0.0", 51 | "umi": "3.x" 52 | }, 53 | "files": [ 54 | "index.js", 55 | "dist" 56 | ] 57 | } 58 | -------------------------------------------------------------------------------- /test/launch.test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const path = require('path'); 4 | const assert = require('assert'); 5 | const { fork } = require('child_process'); 6 | const puppeteer = require('puppeteer'); 7 | const DataHubSDK = require('datahub-nodejs-sdk'); 8 | 9 | const sdkClient = new DataHubSDK(); 10 | const port = 7788; 11 | let browser, page, child; 12 | 13 | describe('./test/launch.test.js', () => { 14 | before(async () => { 15 | // start umi dev server 16 | child = fork( 17 | path.join(__dirname, '../node_modules/umi/bin/umi.js'), 18 | [ 19 | 'dev', 20 | '--port', 21 | port, 22 | ], 23 | { 24 | cwd: path.join(__dirname, './fixture'), 25 | env: { 26 | ...process.env, 27 | BROWSER: 'none', 28 | PROGRESS: 'none', 29 | UMI_UI: 'none', 30 | UMI_UI_SERVER: 'none', 31 | }, 32 | silent: true, 33 | }, 34 | ); 35 | 36 | // create browser 37 | browser = await puppeteer.launch({ args: ['--no-sandbox'] }); 38 | 39 | // wait for dev server ready 40 | await new Promise((resolve) => { 41 | child.on('message', (arg) => { 42 | if (arg.type === 'DONE') { 43 | resolve(); 44 | } 45 | }); 46 | }); 47 | }); 48 | 49 | beforeEach(async () => { 50 | page = await browser.newPage(); 51 | }); 52 | 53 | after(() => { 54 | browser.close(); 55 | child.kill('SIGINT'); 56 | }); 57 | 58 | it('page should fetch data successfully from datahub', async () => { 59 | await page.goto(`http://localhost:${port}`); 60 | await page.waitForSelector('p'); 61 | 62 | const text = await page.evaluate( 63 | () => document.querySelector('p').innerHTML, 64 | ); 65 | const { data } = await sdkClient.getSceneData({ 66 | hub: 'hubname', 67 | pathname: 'api/test1', 68 | scene: 'default', 69 | }); 70 | 71 | assert(new RegExp(`${data.foo}$`).test(text)); 72 | }); 73 | }); 74 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const path = require('path'); 4 | const DataHub = require('macaca-datahub'); 5 | const { getProxyMiddlewares } = require('datahub-proxy-middleware'); 6 | const yargs = require('yargs-parser'); 7 | 8 | module.exports = (api) => { 9 | const { logger: { debug } } = api; 10 | const datahubConfig = { 11 | port: 5678, 12 | hostname: '127.0.0.1', 13 | store: path.join(__dirname, 'data'), 14 | proxy: {}, 15 | showBoard: false, 16 | ...api.userConfig.datahub, 17 | }; 18 | const isBigfish = Boolean(process.env.BIGFISH_VERSION); 19 | const args = yargs(process.argv.slice(2)); 20 | 21 | const defaultDatahub = new DataHub({ 22 | port: datahubConfig.port, 23 | }); 24 | 25 | debug('datahubConfig'); 26 | debug(datahubConfig); 27 | 28 | // add datahub config field 29 | api.describe({ 30 | key: 'datahub', 31 | config: { 32 | default: {}, 33 | schema(joi) { 34 | return joi.object(); 35 | }, 36 | }, 37 | }); 38 | 39 | if ((!isBigfish || args.datahub) && process.env.NODE_ENV === 'development') { 40 | // push datahub middlewares 41 | api.addMiddewares(() => getProxyMiddlewares(datahubConfig)); 42 | 43 | // start datahub server 44 | api.onStart(() => { 45 | defaultDatahub.startServer(datahubConfig).then(() => { 46 | debug('datahub ready'); 47 | console.log('datahub ready'); 48 | }); 49 | }); 50 | 51 | // add debugger-board.js into template 52 | if (datahubConfig.showBoard) { 53 | api.addHTMLScripts(() => ([ 54 | { src: '/debugger-board.js' }, 55 | { 56 | content: ` 57 | window._debugger_board_datahub_options = ${JSON.stringify(datahubConfig)}; 58 | window._debugger_board.append(document.body);` 59 | } 60 | ])); 61 | } 62 | 63 | // TODO: add UI 64 | // api.onUISocket(({ action, success }) => { 65 | // const { type } = action; 66 | // switch (type) { 67 | // case 'org.umi.datahub.getPort': { 68 | // success({ port: datahubConfig.port }); 69 | // break; 70 | // } 71 | // default: 72 | // break; 73 | // } 74 | // }); 75 | 76 | // api.addUIPlugin(require.resolve('./dist/index.umd')); 77 | } 78 | }; 79 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | Macaca 8 | 9 |

10 | 11 | # umi-plugin-datahub 12 | 13 | --- 14 | 15 | [中文版](./README.zh.md) | [Offical Site](//macacajs.github.io/macaca-datahub) 16 | 17 | [![NPM version][npm-image]][npm-url] 18 | [![build status][travis-image]][travis-url] 19 | [![node version][node-image]][node-url] 20 | [![umi version][umi-image]][umi-url] 21 | [![npm download][download-image]][download-url] 22 | 23 | [npm-image]: https://img.shields.io/npm/v/umi-plugin-datahub.svg?logo=npm 24 | [npm-url]: https://npmjs.org/package/umi-plugin-datahub 25 | [travis-image]: https://img.shields.io/travis/umijs/umi-plugin-datahub.svg?logo=travis 26 | [travis-url]: https://travis-ci.org/umijs/umi-plugin-datahub 27 | [node-image]: https://img.shields.io/badge/node.js-%3E=_8-green.svg?logo=node.js 28 | [node-url]: http://nodejs.org/download/ 29 | [umi-image]: https://img.shields.io/badge/umi-%3E=_3-green.svg 30 | [umi-url]: https://github.com/umijs/umi 31 | [download-image]: https://img.shields.io/npm/dm/umi-plugin-datahub.svg?logo=npm 32 | [download-url]: https://npmjs.org/package/umi-plugin-datahub 33 | 34 | umi plugin for integrating [macaca-datahub](//github.com/macacajs/macaca-datahub), which is a GUI-style mock tool that can be used to replace umi's built-in mock solution. 35 | 36 |
37 | 38 |
39 | 40 | 41 | 42 | ## Contributors 43 | 44 | |[
xudafeng](https://github.com/xudafeng)
|[
sorrycc](https://github.com/sorrycc)
|[
PeachScript](https://github.com/PeachScript)
|[
snapre](https://github.com/snapre)
|[
tudou527](https://github.com/tudou527)
|[
ycjcl868](https://github.com/ycjcl868)
| 45 | | :---: | :---: | :---: | :---: | :---: | :---: | 46 | 47 | 48 | This project follows the git-contributor [spec](https://github.com/xudafeng/git-contributor), auto updated at `Wed Nov 03 2021 00:03:37 GMT+0800`. 49 | 50 | 51 | 52 | ## Setup 53 | 54 | Install it via npm or yarn, 55 | 56 | ```bash 57 | $ npm i umi-plugin-datahub -D 58 | ``` 59 | Umi will load this plugin automatically from `package.json`. 60 | 61 | ## Options 62 | 63 | We can specify options for macaca-datahub, such as proxy and store. 64 | 65 | ```javascript 66 | export default { 67 | datahub: { 68 | proxy: { 69 | '^/api': { 70 | hub: 'hubname', 71 | }, 72 | }, 73 | store: path.join(__dirname, 'data'), 74 | }, 75 | }; 76 | ``` 77 | 78 | Checkout [macaca-datahub](//macacajs.github.io/macaca-datahub/guide/) for more options. 79 | 80 | ## Development 81 | 82 | Debug Plugin 83 | 84 | ```bash 85 | $ cd test/fixture 86 | $ npm run dev 87 | ``` 88 | 89 | Debug UI 90 | 91 | ```bash 92 | # watch build 93 | $ npm run build -- -w 94 | $ cd test/fixture 95 | $ npm run dev:ui 96 | ``` 97 | 98 |
99 | 100 |
101 | 102 |
103 | 104 |
105 | 106 | ## Example 107 | 108 | - [umi-examples](//github.com/umijs/umi-examples/tree/master/eleme-demo) 109 | 110 | ## LICENSE 111 | 112 | MIT 113 | --------------------------------------------------------------------------------