test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-11-29 18:39:05 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

breaking: 打印功能使用 id 而不是 testid Closes #10123 (#10126)

Browse Source 
* breaking: 打印功能使用 id 而不是 testid Closes #10123

* 修复文档错误

* 更新 snapshot
This commit is contained in:
吴多益 2024-05-06 16:31:34 +08:00 committed by GitHub
parent d6f8d77507
commit be099ea5aa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 37 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/zh-CN/concepts/event-action.md
View File

@ -1452,7 +1452,9 @@ run action ajax
> 6.2.0 及以后版本
打印页面中的某个组件，对应的组件需要配置 `testid`，如果要打印多个，可以使用 `"testids": ["x", "y"]` 来打印多个组件
打印页面中的某个组件，对应的组件需要配置 `id`，如果要打印多个，可以使用 `"ids": ["x", "y"]` 来打印多个组件，只支持主要是容器类组件 `crud`、`crud2`、`form`、`table`、`wrapper`、`container`、`flex`、`grid`、`grid2d`、`tableview`
> breaking：在 6.2.0 版本中配置是 testid，但这个配置会导致性能问题，所以新版使用 id 作为标识。
```schema
{
@ -1469,7 +1471,7 @@ run action ajax
{
actionType: 'print',
args: {
testid: 'mycrud'
id: 'mycrud'
}
}
]
@ -1479,7 +1481,7 @@ run action ajax
{
"type": "crud",
"api": "/api/mock2/sample",
"testid": "mycrud",
"id": "mycrud",
"syncLocation": false,
"columns": [
{

16
packages/amis-core/src/actions/PrintAction.ts
View File

@ -10,8 +10,8 @@ import {
export interface IPrintAction extends ListenerAction {
actionType: 'copy';
args: {
testid?: string;
testids?: string[];
id?: string;
ids?: string[];
};
}
@ -28,17 +28,15 @@ export class PrintAction implements RendererAction {
renderer: ListenerContext,
event: RendererEvent<any>
) {
if (action.args?.testid) {
const element = document.querySelector(
`[data-testid='${action.args.testid}']`
);
if (action.args?.id) {
const element = document.querySelector(`[data-id='${action.args.id}']`);
if (element) {
printElements([element]);
}
} else if (action.args?.testids) {
} else if (action.args?.ids) {
const elements: Element[] = [];
action.args.testids.forEach(testid => {
const element = document.querySelector(`[data-testid='${testid}']`);
action.args.ids.forEach(id => {
const element = document.querySelector(`[data-id='${id}']`);
if (element) {
elements.push(element);
}

3
packages/amis/__tests__/event-action/renderers/__snapshots__/crud.test.tsx.snap
View File

@ -25,6 +25,7 @@ exports[`doAction:crud reload 1`] = `
</button>
<div
class="cxd-Crud is-loading"
data-id="crud_reload"
>
<div
class="cxd-Table cxd-Crud-body"
@ -332,6 +333,7 @@ exports[`doAction:crud reload with data1 1`] = `
</button>
<div
class="cxd-Crud is-loading"
data-id="crud_reload"
>
<div
class="cxd-Table cxd-Crud-body"
@ -639,6 +641,7 @@ exports[`doAction:crud reload with data2 1`] = `
</button>
<div
class="cxd-Crud is-loading"
data-id="crud_reload"
>
<div
class="cxd-Table cxd-Crud-body"

2
packages/amis/src/renderers/CRUD.tsx
View File

@ -2665,6 +2665,7 @@ export default class CRUD extends React.Component<CRUDProps, any> {
headerToolbarRender,
footerToolbarRender,
testIdBuilder,
id,
...rest
} = this.props;
@ -2675,6 +2676,7 @@ export default class CRUD extends React.Component<CRUDProps, any> {
'is-mobile': isMobile()
})}
style={style}
data-id={id}
{...testIdBuilder?.getChild('wrapper').getTestId()}
>
{filter && (!store.filterTogggable || store.filterVisible)

2
packages/amis/src/renderers/CRUD2.tsx
View File

@ -1322,6 +1322,7 @@ export default class CRUD2 extends React.Component<CRUD2Props, any> {
columnsTogglable,
headerToolbarClassName,
footerToolbarClassName,
id,
...rest
} = this.props;
@ -1331,6 +1332,7 @@ export default class CRUD2 extends React.Component<CRUD2Props, any> {
'is-loading': store.loading
})}
style={style}
data-id={id}
>
<div className={cx('Crud2-filter')}>
{this.renderFilter(filterSchema)}

4
packages/amis/src/renderers/Container.tsx
View File

@ -195,8 +195,7 @@ export default class Container<T> extends React.Component<
wrapperCustomStyle,
env,
themeCss,
baseControlClassName,
testid
baseControlClassName
} = this.props;
const finalDraggable: boolean = isPureVariable(draggable)
? resolveVariableAndFilter(draggable, data, '| raw')
@ -232,6 +231,7 @@ export default class Container<T> extends React.Component<
onMouseEnter={this.handleMouseEnter}
onMouseLeave={this.handleMouseLeave}
style={buildStyle(style, data)}
data-id={id}
>
{this.renderBody()}
<CustomStyle

4
packages/amis/src/renderers/Flex.tsx
View File

@ -111,8 +111,7 @@ export default class Flex extends React.Component<FlexProps, object> {
wrapperCustomStyle,
env,
themeCss,
classnames: cx,
testid
classnames: cx
} = this.props;
const styleVar = buildStyle(style, data);
const flexStyle = {
@ -151,6 +150,7 @@ export default class Flex extends React.Component<FlexProps, object> {
themeCss: wrapperCustomStyle
})
)}
data-id={id}
>
{(Array.isArray(items) ? items : items ? [items] : []).map(
(item, key) =>

4
packages/amis/src/renderers/Grid.tsx
View File

@ -212,8 +212,7 @@ export default class Grid<T> extends React.Component<GridProps & T, object> {
id,
wrapperCustomStyle,
env,
themeCss,
testid
themeCss
} = this.props;
const styleVar = buildStyle(style, data);
return (
@ -240,6 +239,7 @@ export default class Grid<T> extends React.Component<GridProps & T, object> {
})
)}
style={styleVar}
data-id={id}
>
{this.renderColumns(this.props.columns)}
<Spinner loadingConfig={loadingConfig} overlay show={loading} />

9
packages/amis/src/renderers/Grid2D.tsx
View File

@ -172,8 +172,7 @@ export default class Grid2D extends React.Component<Grid2DProps, object> {
}
render() {
const {grids, cols, gap, gapRow, width, rowHeight, style, testid} =
this.props;
const {grids, cols, gap, gapRow, width, rowHeight, style, id} = this.props;
const templateColumns = new Array(cols);
templateColumns.fill('1fr');
@ -215,7 +214,11 @@ export default class Grid2D extends React.Component<Grid2DProps, object> {
gridTemplateRows: templateRows.join(' ')
};
return <div style={curStyle}>{this.renderGrids()}</div>;
return (
<div style={curStyle} data-id={id}>
{this.renderGrids()}
</div>
);
}
}

4
packages/amis/src/renderers/Table/index.tsx
View File

@ -2796,7 +2796,8 @@ export default class Table extends React.Component<TableProps, object> {
autoFillHeight,
autoGenerateFilter,
mobileUI,
testIdBuilder
testIdBuilder,
id
} = this.props;
this.renderedToolbars = []; // 用来记录哪些 toolbar 已经渲染了，已经渲染了就不重复渲染了。
@ -2815,6 +2816,7 @@ export default class Table extends React.Component<TableProps, object> {
'Table--autoFillHeight': autoFillHeight
})}
style={store.buildStyles(style)}
data-id={id}
{...testIdBuilder?.getTestId()}
>
{autoGenerateFilter ? this.renderAutoFilterForm() : null}

2
packages/amis/src/renderers/TableView.tsx
View File

@ -276,7 +276,6 @@ export default class TableView extends React.Component<TableViewProps, object> {
wrapperCustomStyle,
env,
themeCss,
testid,
baseControlClassName
} = this.props;
@ -299,6 +298,7 @@ export default class TableView extends React.Component<TableViewProps, object> {
})
)}
style={{width: width, borderCollapse: 'collapse'}}
data-id={id}
>
{this.renderCaption()}
{this.renderCols()}

11
packages/amis/src/renderers/Wrapper.tsx
View File

@ -59,15 +59,7 @@ export default class Wrapper extends React.Component<WrapperProps, object> {
}
render() {
const {
className,
size,
classnames: cx,
style,
data,
wrap,
testid
} = this.props;
const {className, size, classnames: cx, style, data, wrap, id} = this.props;
// 期望不要使用，给 form controls 用法自动转换时使用的。
if (wrap === false) {
@ -82,6 +74,7 @@ export default class Wrapper extends React.Component<WrapperProps, object> {
className
)}
style={buildStyle(style, data)}
data-id={id}
>
{this.renderBody()}
</div>