From 9747afd930211ea0af0a0b5dff6abedfe279ae80 Mon Sep 17 00:00:00 2001
From: pkupczyk <piotr.kupczyk@id.ethz.ch>
Date: Mon, 17 Aug 2020 16:18:07 +0200
Subject: [PATCH] NG_UI : vocabulary form : SSDM-10060 - extend tests with
adding a term
---
.../src/js/components/common/grid/Grid.jsx | 4 +-
.../grid/{PageConfig.jsx => GridPaging.jsx} | 8 +-
.../common/grid/wrapper/GridPagingWrapper.js | 30 +++++
.../common/grid/wrapper/GridWrapper.js | 9 +-
.../form/VocabularyFormComponent.test.js | 103 ++++++++++++++++++
5 files changed, 147 insertions(+), 7 deletions(-)
rename openbis_ng_ui/src/js/components/common/grid/{PageConfig.jsx => GridPaging.jsx} (95%)
create mode 100644 openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridPagingWrapper.js
diff --git a/openbis_ng_ui/src/js/components/common/grid/Grid.jsx b/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
index 5082d8acf59..5bd46ee5e53 100644
--- a/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
+++ b/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
@@ -12,8 +12,8 @@ import logger from '@src/js/common/logger.js'
import GridController from './GridController.js'
import GridHeader from './GridHeader.jsx'
import GridRow from './GridRow.jsx'
+import GridPaging from './GridPaging.jsx'
import ColumnConfig from './ColumnConfig.jsx'
-import PageConfig from './PageConfig.jsx'
const styles = theme => ({
table: {
@@ -122,7 +122,7 @@ class Grid extends React.PureComponent {
</TableBody>
</Table>
<div className={classes.tableFooter}>
- <PageConfig
+ <GridPaging
count={sortedRows.length}
page={page}
pageSize={pageSize}
diff --git a/openbis_ng_ui/src/js/components/common/grid/PageConfig.jsx b/openbis_ng_ui/src/js/components/common/grid/GridPaging.jsx
similarity index 95%
rename from openbis_ng_ui/src/js/components/common/grid/PageConfig.jsx
rename to openbis_ng_ui/src/js/components/common/grid/GridPaging.jsx
index 6394c3885b3..ef64775218e 100644
--- a/openbis_ng_ui/src/js/components/common/grid/PageConfig.jsx
+++ b/openbis_ng_ui/src/js/components/common/grid/GridPaging.jsx
@@ -35,7 +35,7 @@ const styles = theme => ({
}
})
-class PageConfig extends React.PureComponent {
+class GridPaging extends React.PureComponent {
constructor(props) {
super(props)
this.handlePageSizeChange = this.handlePageSizeChange.bind(this)
@@ -68,7 +68,7 @@ class PageConfig extends React.PureComponent {
}
render() {
- logger.log(logger.DEBUG, 'PageConfig.render')
+ logger.log(logger.DEBUG, 'GridPaging.render')
const { classes, count, page, pageSize } = this.props
@@ -96,7 +96,7 @@ class PageConfig extends React.PureComponent {
/>
</div>
<div className={classes.pageRange}>
- <Typography variant='body2'>
+ <Typography variant='body2' data-part='range'>
{Math.min(count, page * pageSize + 1)}-
{Math.min(count, (page + 1) * pageSize)} of {count}
</Typography>
@@ -136,4 +136,4 @@ class PageConfig extends React.PureComponent {
}
}
-export default _.flow(withStyles(styles))(PageConfig)
+export default _.flow(withStyles(styles))(GridPaging)
diff --git a/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridPagingWrapper.js b/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridPagingWrapper.js
new file mode 100644
index 00000000000..7877a738b58
--- /dev/null
+++ b/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridPagingWrapper.js
@@ -0,0 +1,30 @@
+import BaseWrapper from '@srcTest/js/components/common/wrapper/BaseWrapper.js'
+import SelectField from '@src/js/components/common/form/SelectField.jsx'
+import SelectFieldWrapper from '@srcTest/js/components/common/form/wrapper/SelectFieldWrapper.js'
+import Typography from '@material-ui/core/Typography'
+
+export default class GridPagingWrapper extends BaseWrapper {
+ getPageSize() {
+ return new SelectFieldWrapper(this.findComponent(SelectField))
+ }
+
+ getRange() {
+ return this.getStringValue(
+ this.findComponent(Typography)
+ .filter({ 'data-part': 'range' })
+ .text()
+ .trim()
+ )
+ }
+
+ toJSON() {
+ if (this.wrapper.exists()) {
+ return {
+ pageSize: this.getPageSize().toJSON(),
+ range: this.getRange()
+ }
+ } else {
+ return null
+ }
+ }
+}
diff --git a/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridWrapper.js b/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridWrapper.js
index 792633f1b8f..0f1bed9e13b 100644
--- a/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridWrapper.js
+++ b/openbis_ng_ui/srcTest/js/components/common/grid/wrapper/GridWrapper.js
@@ -1,6 +1,8 @@
import BaseWrapper from '@srcTest/js/components/common/wrapper/BaseWrapper.js'
import TableSortLabel from '@material-ui/core/TableSortLabel'
import FilterField from '@src/js/components/common/form/FilterField.jsx'
+import GridPaging from '@src/js/components/common/grid/GridPaging.jsx'
+import GridPagingWrapper from '@srcTest/js/components/common/grid/wrapper/GridPagingWrapper.js'
import GridHeaderLabel from '@src/js/components/common/grid/GridHeaderLabel.jsx'
import GridRow from '@src/js/components/common/grid/GridRow.jsx'
import GridRowWrapper from '@srcTest/js/components/common/grid/wrapper/GridRowWrapper.js'
@@ -31,11 +33,16 @@ export default class GridWrapper extends BaseWrapper {
return rows
}
+ getPaging() {
+ return new GridPagingWrapper(this.findComponent(GridPaging))
+ }
+
toJSON() {
if (this.wrapper.exists()) {
return {
columns: this.getColumns().map(row => row.toJSON()),
- rows: this.getRows().map(row => row.toJSON())
+ rows: this.getRows().map(row => row.toJSON()),
+ paging: this.getPaging().toJSON()
}
} else {
return null
diff --git a/openbis_ng_ui/srcTest/js/components/types/form/VocabularyFormComponent.test.js b/openbis_ng_ui/srcTest/js/components/types/form/VocabularyFormComponent.test.js
index b7feb913e2f..68d5c03ae0f 100644
--- a/openbis_ng_ui/srcTest/js/components/types/form/VocabularyFormComponent.test.js
+++ b/openbis_ng_ui/srcTest/js/components/types/form/VocabularyFormComponent.test.js
@@ -28,6 +28,7 @@ describe('VocabularyFormComponent', () => {
test('load new', testLoadNew)
test('load existing', testLoadExisting)
test('select term', testSelectTerm)
+ test('add term', testAddTerm)
})
async function testLoadNew() {
@@ -274,6 +275,108 @@ async function testSelectTerm() {
})
}
+async function testAddTerm() {
+ const form = await mountExisting()
+
+ form.expectJSON({
+ grid: {
+ rows: fixture.TEST_VOCABULARY_DTO.terms.map(term => ({
+ values: {
+ 'code.value': term.getCode(),
+ 'label.value': term.getLabel(),
+ 'description.value': term.getDescription(),
+ 'official.value': String(term.isOfficial())
+ },
+ selected: false
+ })),
+ paging: {
+ pageSize: {
+ value: 10
+ },
+ range: '1-6 of 6'
+ }
+ }
+ })
+
+ form.getGrid().getPaging().getPageSize().change(5)
+ await form.update()
+
+ form.getButtons().getEdit().click()
+ await form.update()
+
+ form.getButtons().getAddTerm().click()
+ await form.update()
+
+ form.expectJSON({
+ grid: {
+ rows: [
+ {
+ values: { 'code.value': fixture.TEST_TERM_6_DTO.getCode() },
+ selected: false
+ },
+ {
+ values: { 'code.value': null },
+ selected: true
+ }
+ ],
+ paging: {
+ pageSize: {
+ value: 5
+ },
+ range: '6-7 of 7'
+ }
+ },
+ parameters: {
+ term: {
+ title: 'Term',
+ code: {
+ label: 'Code',
+ value: null,
+ enabled: true,
+ mode: 'edit'
+ },
+ label: {
+ label: 'Label',
+ value: null,
+ enabled: true,
+ mode: 'edit'
+ },
+ description: {
+ label: 'Description',
+ value: null,
+ enabled: true,
+ mode: 'edit'
+ },
+ official: {
+ label: 'Official',
+ value: true,
+ enabled: true,
+ mode: 'edit'
+ }
+ }
+ },
+ buttons: {
+ addTerm: {
+ enabled: true
+ },
+ removeTerm: {
+ enabled: true
+ },
+ save: {
+ enabled: true
+ },
+ cancel: {
+ enabled: true
+ },
+ edit: null,
+ message: {
+ text: 'You have unsaved changes.',
+ type: 'warning'
+ }
+ }
+ })
+}
+
async function mountNew() {
return await common.mount({
type: objectTypes.NEW_VOCABULARY_TYPE
--
GitLab