sartography
/
spiff-arena
mirror of https://github.com/sartography/spiff-arena.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fixed pagination of log tables and broken cypress tests w/ burnettk (#382) 

* fixed pagination of log tables and broken cypress tests w/ burnettk

* wait before clicking the profile button instead of after w/ burnettk

---------

Co-authored-by: jasquat <jasquat@users.noreply.github.com>
This commit is contained in:
jasquat 2023-07-10 14:06:55 -04:00 committed by GitHub
parent 9285358e69
commit 800b61cf36
8 changed files with 83 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
spiffworkflow-frontend/cypress/e2e/process_instances.cy.js
View File

@ -159,20 +159,22 @@ describe('process-instances', () => {
cy.runPrimaryBpmnFile();
cy.getBySel('process-instance-list-link').click();
cy.getBySel('process-instance-show-link-id').first().click();
cy.getBySel('process-instance-log-list-link').click();
cy.getBySel('process-instance-log-events').click();
cy.contains('Events').click();
cy.contains('process_model_one');
cy.contains('task_completed');
cy.basicPaginationTest();
cy.basicPaginationTest(undefined, 'pagination-options-events');
});
it('can filter', () => {
cy.getBySel('process-instance-list-link').click();
cy.getBySel('process-instance-list-all').click();
cy.contains('All Process Instances');
cy.contains('My Process Instances');
cy.get('.process-instance-list-row-variant-for-me');
cy.assertAtLeastOneItemInPaginatedResults();
cy.getBySel('filter-section-expand-toggle').click();
cy.getBySel('process-instance-list-all').click();
cy.contains('All Process Instances');
cy.get('.process-instance-list-row-variant-all');
cy.assertAtLeastOneItemInPaginatedResults();
const statusSelect = '#process-instance-status-select';
PROCESS_STATUSES.forEach((processStatus) => {
@ -188,8 +190,9 @@ describe('process-instances', () => {
cy.assertAtLeastOneItemInPaginatedResults();
cy.getBySel(`process-instance-status-${processStatus}`);
// maybe waiting a bit before trying to click makes this work consistently?
// we tried 500 as well to try to make this work consistently
cy.wait(1000);
// there should really only be one, but in CI there are sometimes more
cy.get('div[aria-label="Clear all selected items"]:first').click();
cy.get('div[aria-label="Clear all selected items"]').should(

25
spiffworkflow-frontend/cypress/e2e/tasks.cy.js
View File

@ -96,18 +96,19 @@ describe('tasks', () => {
// This should get the first one which should be the one we just completed
cy.getBySel('process-instance-show-link-id').first().click();
cy.contains('Process Instance Id: ');
cy.contains('Status: complete');
cy.get('.process-instance-status').contains('complete');
});
it('can paginate items', () => {
// make sure we have some tasks
kickOffModelWithForm();
kickOffModelWithForm();
kickOffModelWithForm();
kickOffModelWithForm();
kickOffModelWithForm();
cy.navigateToHome();
cy.basicPaginationTest('process-instance-show-link-id');
});
// we no longer have a tasks table so these are actually covered in the process_instances test
// it('can paginate items', () => {
// // make sure we have some tasks
// kickOffModelWithForm();
// kickOffModelWithForm();
// kickOffModelWithForm();
// kickOffModelWithForm();
// kickOffModelWithForm();
//
// cy.navigateToHome();
// cy.basicPaginationTest('process-instance-show-link-id');
// });
});

35
spiffworkflow-frontend/cypress/support/commands.js
View File

@ -61,8 +61,10 @@ Cypress.Commands.add('login', (username, password) => {
});
Cypress.Commands.add('logout', (_selector, ..._args) => {
cy.get('#user-profile-toggletip').click();
cy.wait(2000);
// click the profile thingy in the top right
cy.get('.user-profile-toggletip-button').click();
cy.getBySel('logout-button').click();
if (Cypress.env('SPIFFWORKFLOW_FRONTEND_AUTH_WITH_KEYCLOAK') === true) {
// otherwise we can click logout, quickly load the next page, and the javascript
@ -142,9 +144,15 @@ Cypress.Commands.add(
Cypress.Commands.add(
'basicPaginationTest',
(dataQaTagToUseToEnsureTableHasLoaded = 'paginated-entity-id') => {
cy.getBySel('pagination-options').scrollIntoView();
cy.get('.cds--select__item-count').find('.cds--select-input').select('2');
(
dataQaTagToUseToEnsureTableHasLoaded = 'paginated-entity-id',
paginationOptionsDataQa = 'pagination-options'
) => {
cy.getBySel(paginationOptionsDataQa).scrollIntoView();
cy.getBySel(paginationOptionsDataQa)
.find('.cds--select__item-count')
.find('.cds--select-input')
.select('2');
// NOTE: this is a em dash instead of en dash
cy.contains(/\b1–2 of \d+/);
@ -159,14 +167,17 @@ Cypress.Commands.add(
.first()
.then(($element) => {
const oldId = $element.text().trim();
cy.get('.cds--pagination__button--forward').click();
cy.contains(
`[data-qa=${dataQaTagToUseToEnsureTableHasLoaded}]`,
oldId
).should('not.exist');
cy.contains(/\b3–4 of \d+/);
cy.get('.cds--pagination__button--backward').click();
cy.contains(/\b1–2 of \d+/);
cy.getBySel(paginationOptionsDataQa)
.find('.cds--pagination__button--forward')
.click();
cy.getBySel(paginationOptionsDataQa)
.contains(`[data-qa=${dataQaTagToUseToEnsureTableHasLoaded}]`, oldId)
.should('not.exist');
cy.getBySel(paginationOptionsDataQa).contains(/\b3–4 of \d+/);
cy.getBySel(paginationOptionsDataQa)
.find('.cds--pagination__button--backward')
.click();
cy.getBySel(paginationOptionsDataQa).contains(/\b1–2 of \d+/);
cy.contains(`[data-qa=${dataQaTagToUseToEnsureTableHasLoaded}]`, oldId);
});
}

1
spiffworkflow-frontend/src/components/MessageInstanceList.tsx
View File

@ -185,6 +185,7 @@ export default function MessageInstanceList({ processInstanceId }: OwnProps) {
perPage={perPage}
pagination={pagination}
tableToDisplay={buildTable()}
paginationQueryParamPrefix="message-list"
/>
</>
);

4
spiffworkflow-frontend/src/components/PaginationForTable.tsx
View File

@ -15,6 +15,7 @@ type OwnProps = {
tableToDisplay: any;
paginationQueryParamPrefix?: string;
paginationClassName?: string;
paginationDataQATag?: string;
};
export default function PaginationForTable({
@ -25,6 +26,7 @@ export default function PaginationForTable({
tableToDisplay,
paginationQueryParamPrefix,
paginationClassName,
paginationDataQATag = 'pagination-options',
}: OwnProps) {
const PER_PAGE_OPTIONS = [2, 10, 50, 100];
const [searchParams, setSearchParams] = useSearchParams();
@ -47,7 +49,7 @@ export default function PaginationForTable({
{tableToDisplay}
<Pagination
className={paginationClassName}
data-qa="pagination-options"
data-qa={paginationDataQATag}
backwardText="Previous page"
forwardText="Next page"
itemsPerPageText="Items per page:"

13
spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
View File

@ -1648,6 +1648,18 @@ export default function ProcessInstanceListTable({
`${processInstanceShowPathPrefix}/${modifiedModelId}/${processInstance.id}`
);
};
let variantFromMetadata = 'all';
if (reportMetadata) {
reportMetadata.filter_by.forEach((filter: any) => {
if (
filter.field_name === 'with_relation_to_me' &&
filter.field_value
) {
variantFromMetadata = 'for-me';
}
});
}
return (
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
<tr
@ -1655,6 +1667,7 @@ export default function ProcessInstanceListTable({
key={processInstance.id}
onClick={navigateToProcessInstance}
onKeyDown={navigateToProcessInstance}
className={`process-instance-list-row-variant-${variantFromMetadata}`}
>
{currentRow}
</tr>

19
spiffworkflow-frontend/src/components/ProcessInstanceLogList.tsx
View File

@ -82,6 +82,8 @@ export default function ProcessInstanceLogList({
processInstanceShowPageBaseUrl = `/admin/process-instances/${processModelId}`;
}
const taskNameHeader = isEventsView ? 'Task Name' : 'Milestone';
const tableType = isEventsView ? 'events' : 'milestones';
const paginationQueryParamPrefix = `log-list-${tableType}`;
const updateSearchParams = (value: string, key: string) => {
if (value) {
@ -96,7 +98,7 @@ export default function ProcessInstanceLogList({
// Clear out any previous results to avoid a "flicker" effect where columns
// are updated above the incorrect data.
setProcessInstanceLogs([]);
setPagination(null);
// setPagination(null);
const setProcessInstanceLogListFromResult = (result: any) => {
setProcessInstanceLogs(result.results);
@ -105,8 +107,6 @@ export default function ProcessInstanceLogList({
const searchParamsToInclude = [
'events',
'page',
'per_page',
'bpmn_name',
'bpmn_identifier',
'task_type',
@ -117,10 +117,17 @@ export default function ProcessInstanceLogList({
searchParamsToInclude
);
const { page, perPage } = getPageInfoFromSearchParams(
searchParams,
undefined,
undefined,
paginationQueryParamPrefix
);
HttpService.makeCallToBackend({
path: `${targetUris.processInstanceLogListPath}?${createSearchParams(
pickedSearchParams
)}`,
)}&page=${page}&per_page=${perPage}`,
successCallback: setProcessInstanceLogListFromResult,
});
@ -143,6 +150,7 @@ export default function ProcessInstanceLogList({
processModelId,
targetUris.processInstanceLogListPath,
isEventsView,
paginationQueryParamPrefix,
]);
const handleErrorEventModalClose = () => {
@ -492,6 +500,7 @@ export default function ProcessInstanceLogList({
if (clearAll) {
return <p>Page cleared 👍</p>;
}
return (
<>
{errorEventModal()}
@ -507,6 +516,8 @@ export default function ProcessInstanceLogList({
perPage={perPage}
pagination={pagination}
tableToDisplay={buildTable()}
paginationQueryParamPrefix={paginationQueryParamPrefix}
paginationDataQATag={`pagination-options-${tableType}`}
/>
</>
);

6
spiffworkflow-frontend/src/routes/ProcessInstanceShow.tsx
View File

@ -340,7 +340,11 @@ export default function ProcessInstanceShow({ variant }: OwnProps) {
<dl>
<dt>Status:</dt>
<dd>
<Tag type={statusColor} size="sm" className="span-tag">
<Tag
type={statusColor}
size="sm"
className="span-tag process-instance-status"
>
{processInstance.status} {statusIcon}
</Tag>
</dd>