Skip to content

Commit 263efb1

Browse files
epetrowepetrow
committed
chore(html): reuse helper in tests
1 parent a36d639 commit 263efb1

33 files changed

+5006
-6673
lines changed

‎packages/html/src/grid/grid-header.spec.tsx

-4
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,6 @@ import { classNames } from '../misc';
22

33
const className = `k-grid-header`;
44

5-
export type KendoGridHeaderProps = {
6-
virtualScrolling?: boolean;
7-
};
8-
95
export const GridHeader = (
106
props: React.HTMLAttributes<HTMLDivElement>
117
) => (

‎packages/html/src/grid/tests/grid-adaptive-pager.tsx

+9-7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Pager } from '../../pager';
1+
import { Grid, GridPager } from '../../grid';
22

33

44
export default () =>(
@@ -11,9 +11,10 @@ export default () =>(
1111
<div className="k-pane">
1212
<div className="k-view k-widget">
1313
<div className="k-stretched-view k-content">
14-
<div className="k-grid k-grid-md k-grid-display-block k-grid-mobile k-editable">
15-
<Pager className="k-grid-pager" adaptive info={false} pageSizes={false} />
16-
</div>
14+
<Grid className="k-grid-display-block k-grid-mobile k-editable" pager={(
15+
<GridPager className="k-grid-pager" adaptive info={false} pageSizes={false} />
16+
)}>
17+
</Grid>
1718
</div>
1819
</div>
1920
</div>
@@ -26,9 +27,10 @@ export default () =>(
2627
<div className="k-pane">
2728
<div className="k-view k-widget">
2829
<div className="k-stretched-view k-content">
29-
<div className="k-grid k-grid-md k-grid-display-block k-grid-mobile k-editable">
30-
<Pager className="k-grid-pager" adaptive info={false} pageSizes={false} dir="rtl" />
31-
</div>
30+
<Grid className="k-grid-display-block k-grid-mobile k-editable" pager={(
31+
<GridPager className="k-grid-pager" adaptive info={false} pageSizes={false} dir="rtl" />
32+
)}>
33+
</Grid>
3234
</div>
3335
</div>
3436
</div>

‎packages/html/src/grid/tests/grid-adaptive-search.tsx

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { Button } from '../../button';
22
import { Searchbox } from '../../searchbox';
3-
import { Toolbar } from '../../toolbar';
3+
import { Grid, GridToolbar } from '../../grid';
44

55

66
export default () =>(
@@ -10,12 +10,13 @@ export default () =>(
1010
<div className="k-pane">
1111
<div className="k-view k-widget">
1212
<div className="k-stretched-view k-content">
13-
<div id="grid" className="k-grid k-grid-md k-grid-display-block k-grid-mobile">
14-
<Toolbar className="k-grid-toolbar">
13+
<Grid className="k-grid-display-block k-grid-mobile" toolbar={(
14+
<GridToolbar>
1515
<Button className="k-grid-pdf" icon="file-pdf">Export to PDF</Button>
1616
<Searchbox className="k-grid-search" placeholder="Search..." />
17-
</Toolbar>
18-
</div>
17+
</GridToolbar>
18+
)}>
19+
</Grid>
1920
</div>
2021
</div>
2122
</div>
@@ -26,12 +27,13 @@ export default () =>(
2627
<div className="k-pane">
2728
<div className="k-view k-widget">
2829
<div className="k-stretched-view k-content">
29-
<div id="grid" className="k-grid k-grid-md k-grid-display-block k-grid-mobile">
30-
<Toolbar className="k-grid-toolbar">
30+
<Grid className="k-grid-display-block k-grid-mobile" toolbar={(
31+
<GridToolbar>
3132
<Button className="k-grid-pdf" icon="file-pdf">Export to PDF</Button>
3233
<Searchbox className="k-grid-search" placeholder="Search..." />
33-
</Toolbar>
34-
</div>
34+
</GridToolbar>
35+
)}>
36+
</Grid>
3537
</div>
3638
</div>
3739
</div>

‎packages/html/src/grid/tests/grid-angular.tsx

+154-237
Large diffs are not rendered by default.

‎packages/html/src/grid/tests/grid-editing.tsx

+133-163
Large diffs are not rendered by default.

‎packages/html/src/grid/tests/grid-filter-row.tsx

+110-109
Large diffs are not rendered by default.

‎packages/html/src/grid/tests/grid-grouping-actions.tsx

+60-98
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
import { Chip, ChipAction, ChipList } from '../../chip';
22
import { Icon } from '../../icon';
3-
import { Pager } from '../../pager';
4-
import { Table, TableThead, TableTbody, TableRow, TableTh, TableTd } from '../../table';
5-
import { Toolbar } from '../../toolbar';
3+
import { TableThead, TableTbody, TableRow, TableTd } from '../../table';
64
import { Popup } from '../../popup';
7-
5+
import { Grid, GridHeader, GridHeaderTable, GridHeaderCell, GridContainer, GridContent, GridTable, GridToolbar, GridPager } from '../../grid';
86

97
const styles = `
108
.k-animation-container,
@@ -21,8 +19,8 @@ export default () => (
2119
<style>{styles}</style>
2220
<div id="test-area">
2321
<section>
24-
<div className="k-grid k-grid-md k-grid-no-scrollbar">
25-
<Toolbar className="k-grid-toolbar">
22+
<Grid className="k-grid-no-scrollbar" toolbar={(
23+
<GridToolbar className="k-grid-toolbar">
2624
<ChipList>
2725
<Chip text="Units in Stock" icon="sort-asc-small" actions={
2826
<>
@@ -37,109 +35,73 @@ export default () => (
3735
</>
3836
} />
3937
</ChipList>
40-
</Toolbar>
41-
<div className="k-grid-header">
38+
</GridToolbar>
39+
)} pager={(
40+
<GridPager refresh={false} />
41+
)}>
42+
<GridHeader>
4243
<div className="k-grid-header-wrap">
43-
<Table size="medium" className="k-grid-header-table" >
44+
<GridHeaderTable>
4445
<colgroup>
4546
<col />
4647
<col />
4748
<col />
4849
</colgroup>
4950
<TableThead>
5051
<TableRow>
51-
<TableTh className="k-header k-sorted">
52-
<span className="k-cell-inner">
53-
<span className="k-link">
54-
<span className="k-column-title">Product Id</span>
55-
<span className="k-sort-icon"><Icon icon="sort-asc-small" /></span>
56-
</span>
57-
<a href="#" className="k-grid-header-menu k-grid-column-menu">
58-
<Icon icon="more-vertical" />
59-
</a>
60-
</span>
61-
</TableTh>
62-
<TableTh className="k-header k-sorted">
63-
<span className="k-cell-inner">
64-
<span className="k-link">
65-
<span className="k-column-title">Unit Price</span>
66-
<span className="k-sort-icon"><Icon icon="sort-asc-small" /></span>
67-
</span>
68-
<a href="#" className="k-grid-header-menu k-grid-column-menu">
69-
<Icon icon="more-vertical" />
70-
</a>
71-
</span>
72-
</TableTh>
73-
<TableTh className="k-header k-sorted">
74-
<span className="k-cell-inner">
75-
<span className="k-link">
76-
<span className="k-column-title">Discontinued</span>
77-
<span className="k-sort-icon"><Icon icon="sort-asc-small" /></span>
78-
</span>
79-
<a href="#" className="k-grid-header-menu k-grid-column-menu">
80-
<Icon icon="more-vertical" />
81-
</a>
82-
</span>
83-
</TableTh>
84-
<TableTh className="k-header k-sorted">
85-
<span className="k-cell-inner">
86-
<span className="k-link">
87-
<span className="k-column-title">Category</span>
88-
<span className="k-sort-icon"><Icon icon="sort-asc-small" /></span>
89-
</span>
90-
<a href="#" className="k-grid-header-menu k-grid-column-menu">
91-
<Icon icon="more-vertical" />
92-
</a>
93-
</span>
94-
</TableTh>
52+
<GridHeaderCell sortable columnTitle="Product Id" menu="column"></GridHeaderCell>
53+
<GridHeaderCell sortable columnTitle="Unit Price" menu="column"></GridHeaderCell>
54+
<GridHeaderCell sortable columnTitle="Discontinued" menu="column"></GridHeaderCell>
55+
<GridHeaderCell sortable columnTitle="Category" menu="column"></GridHeaderCell>
9556
</TableRow>
9657
</TableThead>
97-
</Table>
58+
</GridHeaderTable>
9859
</div>
99-
</div>
100-
<div className="k-grid-content">
101-
<Table size="medium" className="k-grid-table">
102-
<colgroup>
103-
<col />
104-
<col />
105-
<col />
106-
</colgroup>
107-
<TableTbody>
108-
<TableRow className="k-master-row">
109-
<TableTd>Chef Anton's Gumbo</TableTd>
110-
<TableTd>21.35</TableTd>
111-
<TableTd>0</TableTd>
112-
<TableTd>Condiments</TableTd>
113-
</TableRow>
114-
<TableRow alt>
115-
<TableTd>Alice Mutton</TableTd>
116-
<TableTd>39</TableTd>
117-
<TableTd>0</TableTd>
118-
<TableTd>Meat/Poultry</TableTd>
119-
</TableRow>
120-
<TableRow className="k-master-row">
121-
<TableTd>Singaporean Hokkien Fried Mee</TableTd>
122-
<TableTd>123.79</TableTd>
123-
<TableTd>1</TableTd>
124-
<TableTd>Meat/Poultry</TableTd>
125-
</TableRow>
126-
<TableRow alt>
127-
<TableTd>Gorgonzola Telino</TableTd>
128-
<TableTd>12.5</TableTd>
129-
<TableTd>0</TableTd>
130-
<TableTd>Meat/Poultry</TableTd>
131-
</TableRow>
132-
<TableRow className="k-master-row">
133-
<TableTd>Perth Pasties</TableTd>
134-
<TableTd>32.8</TableTd>
135-
<TableTd>0</TableTd>
136-
<TableTd>Meat/Poultry</TableTd>
137-
</TableRow>
138-
</TableTbody>
139-
</Table>
140-
</div>
141-
<Pager refresh={false} className="k-grid-pager"/>
142-
</div>
60+
</GridHeader>
61+
<GridContainer>
62+
<GridContent>
63+
<GridTable>
64+
<colgroup>
65+
<col />
66+
<col />
67+
<col />
68+
</colgroup>
69+
<TableTbody>
70+
<TableRow className="k-master-row">
71+
<TableTd>Chef Anton's Gumbo</TableTd>
72+
<TableTd>21.35</TableTd>
73+
<TableTd>0</TableTd>
74+
<TableTd>Condiments</TableTd>
75+
</TableRow>
76+
<TableRow alt>
77+
<TableTd>Alice Mutton</TableTd>
78+
<TableTd>39</TableTd>
79+
<TableTd>0</TableTd>
80+
<TableTd>Meat/Poultry</TableTd>
81+
</TableRow>
82+
<TableRow className="k-master-row">
83+
<TableTd>Singaporean Hokkien Fried Mee</TableTd>
84+
<TableTd>123.79</TableTd>
85+
<TableTd>1</TableTd>
86+
<TableTd>Meat/Poultry</TableTd>
87+
</TableRow>
88+
<TableRow alt>
89+
<TableTd>Gorgonzola Telino</TableTd>
90+
<TableTd>12.5</TableTd>
91+
<TableTd>0</TableTd>
92+
<TableTd>Meat/Poultry</TableTd>
93+
</TableRow>
94+
<TableRow className="k-master-row">
95+
<TableTd>Perth Pasties</TableTd>
96+
<TableTd>32.8</TableTd>
97+
<TableTd>0</TableTd>
98+
<TableTd>Meat/Poultry</TableTd>
99+
</TableRow>
100+
</TableTbody>
101+
</GridTable>
102+
</GridContent>
103+
</GridContainer>
104+
</Grid>
143105
</section>
144106

145107
<Popup className="k-column-menu k-grid-columnmenu-popup">

0 commit comments

Comments
 (0)