mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-05 05:18:34 +08:00
1302 lines
35 KiB
TypeScript
1302 lines
35 KiB
TypeScript
import React = require('react');
|
|
import * as renderer from 'react-test-renderer';
|
|
import {render, fireEvent, cleanup} from 'react-testing-library';
|
|
import '../../src/themes/default';
|
|
import {
|
|
render as amisRender
|
|
} from '../../src/index';
|
|
import { wait, makeEnv } from '../helper';
|
|
import { clearStoresCache } from '../../src/factory';
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
clearStoresCache();
|
|
});
|
|
|
|
test('Renderer:Wizard', () => {
|
|
const component = renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv()));
|
|
let tree = component.toJSON();
|
|
|
|
expect(tree).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard readOnly', () => {
|
|
const component = renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
readOnly: true,
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
value: "xxx@xxx.com"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv()));
|
|
let tree = component.toJSON();
|
|
|
|
expect(tree).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi', async () => {
|
|
const fetcher = jest.fn().mockImplementationOnce(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: 'fex',
|
|
date: 1555382395,
|
|
info: '',
|
|
name: 'Amis renderer'
|
|
}
|
|
}
|
|
}));
|
|
|
|
const component = renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/initData?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(component.toJSON()).toMatchSnapshot();
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi show loading', async () => {
|
|
let done:Function;
|
|
let wating = new Promise((resolve) => {
|
|
done = resolve;
|
|
});
|
|
|
|
const fetcher = jest.fn().mockImplementationOnce(() => {
|
|
return new Promise(async (resolve) => {
|
|
await wait(100, () => expect(component.toJSON()).toMatchSnapshot());
|
|
await wait(100, () => resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
a: 3
|
|
}
|
|
}
|
|
}));
|
|
await wait(100, done);
|
|
});
|
|
});
|
|
const component = renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wating;
|
|
let tree = component.toJSON();
|
|
|
|
expect(tree).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi initFetch:false', async () => {
|
|
const fetcher = jest.fn().mockImplementationOnce(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: 'fex',
|
|
date: 1555382395,
|
|
info: '',
|
|
name: 'Amis renderer'
|
|
}
|
|
}
|
|
}));
|
|
|
|
renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/initData?waitSeconds=2",
|
|
initFetch: false,
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi initFetch:true', async () => {
|
|
const fetcher = jest.fn().mockImplementationOnce(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: 'fex',
|
|
date: 1555382395,
|
|
info: '',
|
|
name: 'Amis renderer'
|
|
}
|
|
}
|
|
}));
|
|
|
|
renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/initData?waitSeconds=2",
|
|
initFetch: true,
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi initFetchOn:false', async () => {
|
|
const fetcher = jest.fn().mockImplementationOnce(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: 'fex',
|
|
date: 1555382395,
|
|
info: '',
|
|
name: 'Amis renderer'
|
|
}
|
|
}
|
|
}));
|
|
|
|
renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/initData?waitSeconds=2",
|
|
initFetchOn: 'this.goFetch',
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {
|
|
data: {
|
|
goFetch: false
|
|
}
|
|
}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi initFetchOn:true', async () => {
|
|
const fetcher = jest.fn().mockImplementationOnce(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: 'fex',
|
|
date: 1555382395,
|
|
info: '',
|
|
name: 'Amis renderer'
|
|
}
|
|
}
|
|
}));
|
|
|
|
renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initApi: "/api/mock2/form/initData?waitSeconds=2",
|
|
initFetchOn: 'this.goFetch',
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {
|
|
data: {
|
|
goFetch: true
|
|
}
|
|
}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard actionPrevLabel actionNextLabel actionFinishLabel className actionClassName', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
className: "wizard-class-name",
|
|
actionClassName: "btn-lg btn-primary",
|
|
actionPrevLabel: 'PrevStep',
|
|
actionNextLabel: 'NextStep',
|
|
actionFinishLabel: 'Submit',
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/NextStep/));
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/Submit/));
|
|
await wait(1000);
|
|
expect(container).toMatchSnapshot();
|
|
expect(fetcher).toHaveBeenCalled();
|
|
|
|
fireEvent.click(getByText(/PrevStep/));
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard actionNextSaveLabel', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
actionNextSaveLabel: 'saveAndNext',
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/saveAndNext/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard send data', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/完成/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
expect(fetcher.mock.calls[0][0]).toMatchObject({
|
|
data: {
|
|
name: "Amis",
|
|
website: "http://amis.baidu.com"
|
|
}
|
|
});
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard step api', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard step initApi', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {
|
|
author: "fex",
|
|
date: 1555382395,
|
|
email: "xxx@xxx.com"
|
|
}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
controls: [
|
|
{
|
|
name: "email",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard step initFetch:false', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initFetch: false,
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard step initFetch:true', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initFetch: true,
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard step initFetchOn:false', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initFetchOn: 'this.goFetch',
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {
|
|
data: {
|
|
goFetch: false
|
|
}
|
|
}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard step initFetchOn:true', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: '保存成功',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
initApi: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
initFetchOn: 'this.goFetch',
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {
|
|
data: {
|
|
goFetch: true
|
|
}
|
|
}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
expect(fetcher).not.toHaveBeenCalled();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalled();
|
|
});
|
|
|
|
test('Renderer:Wizard validate', async () => {
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http",
|
|
required: true
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
{
|
|
name: "email2",
|
|
label: "邮箱",
|
|
type: "email",
|
|
required: true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 3",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv()));
|
|
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard initApi reload', async () => {
|
|
const fetcher = jest.fn().mockImplementation(() => Promise.resolve({
|
|
data: {
|
|
status: 0,
|
|
msg: 'ok',
|
|
data: {}
|
|
}
|
|
}));
|
|
|
|
const {
|
|
container,
|
|
getByText
|
|
} = render(amisRender({
|
|
type: "page",
|
|
name: "thePage",
|
|
initApi: "/api/xxx",
|
|
body: {
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
reload: "thePage",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}}, {}, makeEnv({
|
|
fetcher
|
|
})));
|
|
|
|
await wait(500);
|
|
expect(container).toMatchSnapshot();
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(500);
|
|
expect(container).toMatchSnapshot();
|
|
fireEvent.click(getByText(/完成/));
|
|
await wait(1000);
|
|
expect(fetcher).toHaveBeenCalledTimes(3);
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard steps not array', () => {
|
|
const component = renderer.create(amisRender({
|
|
type: "wizard",
|
|
api: "/api/mock2/form/saveForm?waitSeconds=2",
|
|
steps: ''
|
|
}));
|
|
let tree = component.toJSON();
|
|
|
|
expect(tree).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard target', async () => {
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "page",
|
|
body: [
|
|
{
|
|
type: "wizard",
|
|
target: "theForm",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
type: "form",
|
|
name: "theForm",
|
|
controls: [
|
|
{
|
|
type: "text",
|
|
name: "website",
|
|
label: "Website"
|
|
},
|
|
{
|
|
type: "text",
|
|
name: "name",
|
|
label: "Name"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}, {}));
|
|
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/下一步/));
|
|
await wait(1000);
|
|
fireEvent.click(getByText(/完成/));
|
|
await wait(1000);
|
|
expect(container).toMatchSnapshot();
|
|
});
|
|
|
|
test('Renderer:Wizard dialog', async () => {
|
|
const {
|
|
getByText,
|
|
container
|
|
} = render(amisRender({
|
|
type: "page",
|
|
body: [
|
|
{
|
|
type: "wizard",
|
|
steps: [
|
|
{
|
|
title: "Step 1",
|
|
controls: [
|
|
{
|
|
name: "website",
|
|
label: "网址",
|
|
type: "url",
|
|
value: "http://amis.baidu.com"
|
|
},
|
|
{
|
|
name: "name",
|
|
label: "名称",
|
|
type: "text",
|
|
value: "Amis"
|
|
},
|
|
{
|
|
type: "button",
|
|
label: "OpenDialog",
|
|
actionType: "dialog",
|
|
dialog: {
|
|
title: "添加",
|
|
body: {
|
|
type: "form",
|
|
controls: [
|
|
{
|
|
"type": "text",
|
|
"name": "name",
|
|
"label": "Name"
|
|
}
|
|
]
|
|
}
|
|
}
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Step 2",
|
|
controls: [
|
|
"这是最后一步了"
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}, {}, makeEnv({
|
|
getModalContainer: () => container
|
|
})));
|
|
|
|
fireEvent.click(getByText(/OpenDialog/));
|
|
expect(container).toMatchSnapshot();
|
|
|
|
fireEvent.click(getByText(/取消/));
|
|
await wait(1000);
|
|
expect(container).toMatchSnapshot();
|
|
}); |