Skip to content

Commit

Permalink
Merge pull request #100 from CSCfi/develop
Browse files Browse the repository at this point in the history
bump to version 0.5.0
  • Loading branch information
blankdots authored Nov 23, 2020
2 parents 8df9f68 + 6ba7f5f commit db65f5e
Show file tree
Hide file tree
Showing 34 changed files with 13,746 additions and 9,513 deletions.
2 changes: 1 addition & 1 deletion architecture.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ React Router is used to render different views in App-component. All components

Form components are crucial part of the application:

- Forms for XML upload and folder creation are made with `Formik` and customized fields for material-UI.
- All submissions and folder creation are made with `react-hook-form`. Latter uses form as a reference so submission can be triggered outside the form.
- Form for json schema based forms are created with custom json schema parser, which builds `react-hook-form` based forms from given json schema. Json schema-based forms are validated against json schema with `Ajv`. React-hook-form is used for performance reasons: it uses uncontrolled components so adding a lot of fields to array doesn't slow rendering of the application.

## Redux store
Expand Down
6 changes: 0 additions & 6 deletions enzyme.js

This file was deleted.

21,953 changes: 12,773 additions & 9,180 deletions package-lock.json

Large diffs are not rendered by default.

46 changes: 23 additions & 23 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,32 +1,31 @@
{
"name": "metadata-submitter-frontend",
"version": "0.4.0",
"version": "0.5.0",
"private": true,
"dependencies": {
"@apidevtools/json-schema-ref-parser": "^9.0.6",
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.56",
"@reduxjs/toolkit": "^1.4.0",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"ajv": "^6.12.3",
"@testing-library/jest-dom": "^5.11.5",
"@testing-library/react": "^11.1.1",
"ajv": "^6.12.6",
"apisauce": "^1.1.2",
"formik": "^2.1.5",
"lodash": "^4.17.19",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-hook-form": "^6.3.1",
"react-redux": "^7.2.1",
"jest-environment-jsdom-sixteen": "^1.0.3",
"lodash": "^4.17.20",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react-hook-form": "^6.10.1",
"react-redux": "^7.2.2",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.3"
"react-scripts": "^4.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"test:noninteractive": "react-scripts test --watchAll=false",
"test": "react-scripts test --env=jest-environment-jsdom-sixteen",
"test:noninteractive": "react-scripts test --watchAll=false --env=jest-environment-jsdom-sixteen",
"lint": "eslint --fix .",
"lint:check": "eslint .",
"format": "prettier --write \"**/*.+(json|yml|yaml|css|md)\"",
Expand Down Expand Up @@ -55,19 +54,20 @@
]
},
"devDependencies": {
"@testing-library/user-event": "^12.2.0",
"concurrently": "^5.3.0",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.5",
"eslint-config-prettier": "^6.11.0",
"eslint-config-prettier": "^6.15.0",
"eslint-plugin-flowtype": "^5.2.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jest": "^23.20.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jest": "^24.1.3",
"eslint-plugin-prettier": "^3.1.4",
"flow-bin": "^0.126.1",
"http-proxy-middleware": "^1.0.5",
"husky": "^4.2.5",
"prettier": "^2.0.5",
"redux-mock-store": "^1.5.4"
"http-proxy-middleware": "^1.0.6",
"husky": "^4.3.0",
"jest-environment-jsdom-sixteen": "^1.0.3",
"prettier": "^2.2.0",
"redux-mock-store": "^1.5.4",
"snapshot-diff": "^0.8.1"
},
"husky": {
"hooks": {
Expand Down
2 changes: 1 addition & 1 deletion src/components/Nav.test.js → src/__tests__/Nav.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import "@testing-library/jest-dom/extend-expect"
import { render } from "@testing-library/react"
import { MemoryRouter } from "react-router-dom"

import Nav from "./Nav"
import Nav from "../components/Nav"

describe("NavBar", () => {
let component
Expand Down
59 changes: 59 additions & 0 deletions src/__tests__/WizardAddObjectStep.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import React from "react"

import "@testing-library/jest-dom/extend-expect"
import { render, screen, act } from "@testing-library/react"
import { Provider } from "react-redux"
import configureStore from "redux-mock-store"
import { toMatchDiffSnapshot } from "snapshot-diff"

import WizardAddObjectStep from "../components/NewDraftWizard/WizardSteps/WizardAddObjectStep"

const mockStore = configureStore([])

expect.extend({ toMatchDiffSnapshot })

describe("WizardAddObjectStep", () => {
it("should not render any cards if no selected object type", () => {
const store = mockStore({
objectType: "",
submissionType: "xml",
submissionFolder: {
name: "folder name",
description: "folder description",
published: false,
metadataObjects: [],
id: "FOL12341234",
},
})
render(
<Provider store={store}>
<WizardAddObjectStep />
</Provider>
)
expect(screen.getByText("Add objects by clicking the name, then fill form or upload XML File.")).toBeInTheDocument()
})

it("should render appropriate card", async () => {
const typeList = ["form", "xml", "existing"]
await act(async () => {
typeList.forEach(typeName => {
const store = mockStore({
objectType: "study",
submissionType: typeName,
submissionFolder: {
description: "Test",
id: "FOL12341234",
name: "Testname",
published: false,
},
})
render(
<Provider store={store}>
<WizardAddObjectStep />
</Provider>
)
expect(screen.getByTestId(typeName)).toBeInTheDocument()
})
})
})
})
36 changes: 36 additions & 0 deletions src/__tests__/WizardAlert.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import React from "react"

import { render, screen } from "@testing-library/react"
import { Provider } from "react-redux"
import { BrowserRouter } from "react-router-dom"
import configureStore from "redux-mock-store"

import WizardAlert from "../components/NewDraftWizard/WizardComponents/WizardAlert"

const mockStore = configureStore([])

describe("WizardAlert", () => {
const store = mockStore({
submissionType: "",
})

it("should render appropriate dialogs", () => {
const alerts = [
{ submission: { types: ["form", "xml", "existing"] } },
{ footer: { types: ["cancel", "save"] } },
{ stepper: { types: ["form", "xml", "existing"] } },
]
alerts.forEach(item => {
item[Object.keys(item)].types.forEach(type => {
render(
<BrowserRouter>
<Provider store={store}>
<WizardAlert alertType={type} parentLocation={Object.keys(item)[0]} onAlert="true" />
</Provider>
</BrowserRouter>
)
expect(screen.getByRole("dialog")).toBeDefined()
})
})
})
})
69 changes: 69 additions & 0 deletions src/__tests__/WizardFillObjectDetailsForm.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import React from "react"

import "@testing-library/jest-dom/extend-expect"
import { render, screen, waitFor } from "@testing-library/react"
import { Provider } from "react-redux"
import configureStore from "redux-mock-store"

import WizardFillObjectDetailsForm from "../components/NewDraftWizard/WizardForms/WizardFillObjectDetailsForm"

const mockStore = configureStore([])

describe("WizardFillObjectDetailsForm", () => {
const schema = {
title: "Study",
type: "object",
required: ["descriptor"],
properties: {
descriptor: {
type: "object",
title: "Study Description",
required: ["studyTitle"],
properties: {
studyTitle: {
title: "Study Title",
description: "Title of the study as would be used in a publication.",
type: "string",
},
},
},
},
}

const store = mockStore({
objectType: "study",
submissionType: "form",
submissionFolder: {
description: "AWD",
id: "FOL90524783",
name: "Testname",
published: false,
},
})

localStorage.setItem(`cached_study_schema`, JSON.stringify(schema))

it("should create study form from schema in localstorage", async () => {
render(
<Provider store={store}>
<WizardFillObjectDetailsForm />
</Provider>
)
await waitFor(() => screen.getByText("Study Description"))
expect(screen.getByText("Study Description")).toBeDefined()
})

// Note: If this test runs before form creation, form creation fails because getItem spy messes localstorage init somehow
it("should call localstorage", async () => {
const spy = jest.spyOn(Storage.prototype, "getItem")
render(
<Provider store={store}>
<WizardFillObjectDetailsForm />
</Provider>
)
expect(spy).toBeCalledWith("cached_study_schema")
await waitFor(() => {
expect(spy.mock.calls.length).toBe(1)
})
})
})
37 changes: 37 additions & 0 deletions src/__tests__/WizardFooter.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React from "react"

import "@testing-library/jest-dom/extend-expect"
import { render, screen, fireEvent } from "@testing-library/react"
import { Provider } from "react-redux"
import { BrowserRouter } from "react-router-dom"
import configureStore from "redux-mock-store"

import WizardFooter from "../components/NewDraftWizard/WizardComponents/WizardFooter"

const mockStore = configureStore([])

describe("WizardStepper", () => {
let store
let wrapper

beforeEach(() => {
store = mockStore({
submissionType: "form",
wizardStep: 1,
})
wrapper = (
<BrowserRouter>
<Provider store={store}>
<WizardFooter />
</Provider>
</BrowserRouter>
)
})

it("should open dialog on click of cancel", () => {
render(wrapper)
const button = screen.getByRole("button", { name: /Cancel/i })
fireEvent.click(button)
expect(screen.getByRole("dialog")).toBeDefined()
})
})
33 changes: 33 additions & 0 deletions src/__tests__/WizardSavedObjectsList.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React from "react"

import "@testing-library/jest-dom/extend-expect"
import { render, screen } from "@testing-library/react"
import { Provider } from "react-redux"
import configureStore from "redux-mock-store"

import WizardSavedObjectsList from "../components/NewDraftWizard/WizardComponents/WizardSavedObjectsList"

const mockStore = configureStore([])

describe("WizardStepper", () => {
const store = mockStore({
submissionType: "sample",
wizardStep: 1,
})

const submissions = [
{ accessionId: "EDAG1", schema: "sample" },
{ accessionId: "EDAG2", schema: "sample" },
]

it("should have 'Added!' message rendered on item that has 'new' property", () => {
render(
<Provider store={store}>
<WizardSavedObjectsList submissions={submissions} submissionType="sample" />
</Provider>
)
submissions.forEach(item => {
expect(screen.getByText(item.accessionId)).toBeInTheDocument()
})
})
})
44 changes: 44 additions & 0 deletions src/__tests__/WizardShowSummaryStep.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import React from "react"

import "@testing-library/jest-dom/extend-expect"
import { render, screen } from "@testing-library/react"
import { Provider } from "react-redux"
import configureStore from "redux-mock-store"
import { toMatchDiffSnapshot } from "snapshot-diff"

import WizardShowSummaryStep from "../components/NewDraftWizard/WizardSteps/WizardShowSummaryStep"

const mockStore = configureStore([])

expect.extend({ toMatchDiffSnapshot })

describe("WizardShowSummaryStep", () => {
let store
let wrapper

beforeEach(() => {
store = mockStore({
submissionFolder: {
description: "AWD",
id: "FOL90524783",
metadataObjects: [
{ accessionId: "EDAG2584421211413887", schema: "study" },
{ accessionId: "EDAG9880663174234413", schema: "study" },
],
name: "AA",
published: false,
},
})
wrapper = (
<Provider store={store}>
<WizardShowSummaryStep />
</Provider>
)
})

it("should have uploaded objects listed", async () => {
render(wrapper)
const items = await screen.findAllByRole("button")
expect(items).toHaveLength(4) // Screen renders stepper back and next buttons
})
})
Loading

0 comments on commit db65f5e

Please sign in to comment.