From dc6e8a86958120419526189ca29a1cc6496d0e63 Mon Sep 17 00:00:00 2001 From: jasquat Date: Fri, 24 Jun 2022 15:18:25 -0400 Subject: [PATCH] finished adding at test for date ranges and moved some common stuff to configs for use in tests as well w/ burnettk --- cypress.config.js | 2 +- cypress/e2e/process_instances.cy.js | 45 +++++++++++++++++++++++++++-- package-lock.json | 1 + package.json | 1 + src/config.js | 12 ++++++++ src/helpers.js | 4 +++ src/routes/ProcessInstanceList.js | 28 +++++++----------- 7 files changed, 72 insertions(+), 21 deletions(-) diff --git a/cypress.config.js b/cypress.config.js index ab9c647..2dacb85 100644 --- a/cypress.config.js +++ b/cypress.config.js @@ -4,7 +4,7 @@ module.exports = defineConfig({ projectId: "crax1q", e2e: { baseUrl: "http://localhost:7001", - setupNodeEvents(on, config) { + setupNodeEvents(_on, _config) { // implement node event listeners here }, }, diff --git a/cypress/e2e/process_instances.cy.js b/cypress/e2e/process_instances.cy.js index 2ae657a..b877223 100644 --- a/cypress/e2e/process_instances.cy.js +++ b/cypress/e2e/process_instances.cy.js @@ -1,3 +1,6 @@ +import { DATE_FORMAT, PROCESS_STATUSES } from '../../src/config'; +import { format } from 'date-fns'; + describe('process-instances', () => { beforeEach(() => { cy.visit('/'); @@ -83,22 +86,58 @@ describe('process-instances', () => { it.only('can filter', () => { cy.contains('Process Instances').click(); assertAtLeastOneItemInPaginatedResults(); + + for (const processStatus of PROCESS_STATUSES) { + if (processStatus === "all"){ + continue; + } + cy.getBySel("process-status-dropdown") + .type("typing_to_open_dropdown_box....FIXME") + .find('.dropdown-item') + .contains(new RegExp(`^${processStatus}$`)) + .click(); + cy.contains('Filter').click(); + assertAtLeastOneItemInPaginatedResults(); + cy.getBySel("process-instance-status").first().contains(processStatus); + } cy.getBySel("process-status-dropdown") .type("typing_to_open_dropdown_box....FIXME") .find('.dropdown-item') - .contains(/^waiting$/) + .contains("all") .click(); - cy.contains('Filter').click(); + + let date = new Date(); + date.setHours(date.getHours() - 1); + filterByDate(date); + assertAtLeastOneItemInPaginatedResults(); + cy.getBySel("process-instance-status").contains("not_started"); + + date.setHours(date.getHours() + 2); + filterByDate(date); + assertNoItemInPaginatedResults(); + cy.getBySel("process-instance-status").should('not.exist'); }); }) +const filterByDate = ((fromDate) => { + cy.get("#date-picker-start-from").clear().type(format(fromDate, DATE_FORMAT)); + cy.contains('Start Range').click(); + cy.get("#date-picker-end-from").clear().type(format(fromDate, DATE_FORMAT)); + cy.contains('Start Range').click(); + cy.contains('Filter').click(); +}); + const assertAtLeastOneItemInPaginatedResults = (() => { - cy.get('[data-qa="total-paginated-items"') + cy.getBySel('total-paginated-items') .invoke('text') .then(parseFloat) .should('be.gt', 0) }); +const assertNoItemInPaginatedResults = (() => { + cy.getBySel('total-paginated-items').contains('0') +}); + const updateDmnText = ((oldText, newText, elementId="wonderful_process") => { // this will break if there are more elements added to the drd cy.get(`g[data-element-id=${elementId}]`).click().should('exist'); diff --git a/package-lock.json b/package-lock.json index 3bd4587..d4cc712 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,6 +21,7 @@ "bpmn-js-properties-panel": "^1.1.1", "bpmn-js-spiffworkflow": "^0.0.3", "craco": "^0.0.3", + "date-fns": "^2.28.0", "dmn-js": "^12.1.1", "dmn-js-properties-panel": "^1.0.0", "dmn-js-shared": "^12.1.1", diff --git a/package.json b/package.json index c9e39af..0c14e63 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "bpmn-js-properties-panel": "^1.1.1", "bpmn-js-spiffworkflow": "^0.0.3", "craco": "^0.0.3", + "date-fns": "^2.28.0", "dmn-js": "^12.1.1", "dmn-js-properties-panel": "^1.0.0", "dmn-js-shared": "^12.1.1", diff --git a/src/config.js b/src/config.js index 5fbf6af..929017c 100644 --- a/src/config.js +++ b/src/config.js @@ -9,3 +9,15 @@ export const STANDARD_HEADERS = { 'Authorization': `Bearer ${HOT_AUTH_TOKEN}` }) } + +export const PROCESS_STATUSES = [ + "all", + "not_started", + "user_input_required", + "waiting", + "complete", + "faulted", + "suspended", +] + +export const DATE_FORMAT = "yyyy-MM-dd HH:mm:ss" diff --git a/src/helpers.js b/src/helpers.js index afdc747..a61200c 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -9,6 +9,10 @@ export const slugifyString = ((str) => { }); export const convertDateToSeconds = ((date, onChangeFunction) => { + if (date === null) { + return; + } + let dateInMilliseconds = date; if (typeof(date.getTime) === "function") { dateInMilliseconds = date.getTime(); diff --git a/src/routes/ProcessInstanceList.js b/src/routes/ProcessInstanceList.js index d52b40f..12018e2 100644 --- a/src/routes/ProcessInstanceList.js +++ b/src/routes/ProcessInstanceList.js @@ -1,7 +1,7 @@ import React, { useEffect, useMemo, useState } from "react"; import { Link, useNavigate, useParams, useSearchParams } from "react-router-dom"; -import { BACKEND_BASE_URL } from '../config'; +import { BACKEND_BASE_URL, PROCESS_STATUSES, DATE_FORMAT } from '../config'; import { HOT_AUTH_TOKEN } from '../config'; import ProcessBreadcrumb from '../components/ProcessBreadcrumb'; import { Button, Table, Stack, Dropdown } from 'react-bootstrap'; @@ -10,6 +10,7 @@ import { convertDateToSeconds } from "../helpers"; import PaginationForTable, { DEFAULT_PER_PAGE, DEFAULT_PAGE } from '../components/PaginationForTable' import "react-datepicker/dist/react-datepicker.css"; +import { format } from "date-fns"; export default function ProcessInstanceList() { const params = useParams(); @@ -26,14 +27,6 @@ export default function ProcessInstanceList() { const [endFrom, setEndFrom] = useState(convertDateToSeconds(new Date()) - oneMonthInSeconds); const [endTill, setEndTill] = useState(convertDateToSeconds(new Date()) + oneHourInSeconds); - const PROCESS_STATUSES = [ - "all", - "not_started", - "user_input_required", - "waiting", - "complete", - "erroring", - ] const [processStatus, setProcessStatus] = useState(PROCESS_STATUSES[0]); const parametersToAlwaysFilterBy = useMemo(() => { return { @@ -117,15 +110,16 @@ export default function ProcessInstanceList() { navigate(`/process-models/${params.process_group_id}/${params.process_model_id}/process-instances?${queryParamString}`) }); - const dateComponent = ((labelString, initialDate, onChangeFunction) => { + const dateComponent = ((labelString, name, initialDate, onChangeFunction) => { return ( convertDateToSeconds(date, onChangeFunction)} showTimeSelect - dateFormat="MMMM d, yyyy h:mm aa" + dateFormat={DATE_FORMAT} /> ) @@ -157,13 +151,13 @@ export default function ProcessInstanceList() {
- {dateComponent("Start Range: ", startFrom, setStartFrom)} - {dateComponent("-", startTill, setStartTill)} + {dateComponent("Start Range: ", "start-from", startFrom, setStartFrom)} + {dateComponent("-", "start-till", startTill, setStartTill)}
- {dateComponent("End Range: ", endFrom, setEndFrom)} - {dateComponent("-", endTill, setEndTill)} + {dateComponent("End Range: ", "end-from", endFrom, setEndFrom)} + {dateComponent("-", "end-till", endTill, setEndTill)}
@@ -204,8 +198,8 @@ export default function ProcessInstanceList() { {row.process_model_identifier} {row.process_group_id} - {start_date.toString()} - {end_date.toString()} + {format(start_date, DATE_FORMAT)} + {format(end_date, DATE_FORMAT)} {row.status} )