wassname/optuna-dashboard
1
0
Fork 0
mirror of https://github.com/wassname/optuna-dashboard.git synced 2026-09-09 11:28:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add unit test for TrialTable

Browse Source
This commit is contained in:
Cheng Huzi
2021-07-19 23:47:08 +08:00
parent 9053ce96e8
commit 7d5eaaef22
7 changed files with 7498 additions and 4641 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend_tests/TrialTable.test.tsx
+136
View File
@@ -0,0 +1,136 @@
import React from "react"
global.URL.createObjectURL = jest.fn()
import { cleanup, render, within, fireEvent } from "@testing-library/react"
import { TrialTable } from "../optuna_dashboard/static/components/StudyDetail"
afterEach(cleanup)
const trials = [
{
trial_id: 1,
study_id: 0,
number: 0,
state: "Complete" as TrialState,
values: [-1],
intermediate_values: [],
datetime_start: new Date("2021-06-15T00:00:00"),
datetime_complete: new Date("2021-06-15T00:00:01"),
params: [
{ name: "x", value: "1" },
{ name: "y", value: "2" },
],
user_attrs: [],
system_attrs: [],
},
{
trial_id: 2,
study_id: 0,
number: 1,
state: "Fail" as TrialState,
values: [-2],
intermediate_values: [],
datetime_start: new Date("2021-06-15T00:00:01"),
datetime_complete: new Date("2021-06-15T00:00:03"),
params: [
{ name: "x", value: "2" },
{ name: "y", value: "1" },
],
user_attrs: [],
system_attrs: [],
},
]
const study_direction: StudyDirection = "minimize" as StudyDirection
const study_detail = {
name: "study_0",
directions: [study_direction],
datetime_start: new Date("2021-06-15T00:00:00"),
best_trial: trials[1],
trials: trials,
intersection_search_space: [
{
name: "x",
type: "UniformDistribution",
attributes: { low: -3, high: 3 },
},
{
name: "y",
type: "UniformDistribution",
attributes: { low: -3, high: 3 },
},
],
union_search_space: [
{
name: "x",
type: "UniformDistribution",
attributes: { low: -3, high: 3 },
},
{
name: "y",
type: "UniformDistribution",
attributes: { low: -3, high: 3 },
},
],
}
it("Sort TrialTable by trial number", () => {
const { getAllByRole, getByText } = render(
<TrialTable studyDetail={study_detail} />
)
const rows = getAllByRole("row")
expect(within(rows[1]).getByText("0")).toBeTruthy()
expect(within(rows[3]).getByText("1")).toBeTruthy()
fireEvent.click(getByText("Number"))
const rows_updated = getAllByRole("row")
expect(within(rows_updated[1]).getByText("1")).toBeTruthy()
expect(within(rows_updated[3]).getByText("0")).toBeTruthy()
})
it("Sort TrialTable by value", () => {
const { getAllByRole, getByText } = render(
<TrialTable studyDetail={study_detail} />
)
fireEvent.click(getByText("Value"))
const rows = getAllByRole("row")
expect(within(rows[1]).getByText("-2")).toBeTruthy()
expect(within(rows[3]).getByText("-1")).toBeTruthy()
fireEvent.click(getByText("Value"))
const rows_updated = getAllByRole("row")
expect(within(rows_updated[1]).getByText("-1")).toBeTruthy()
expect(within(rows_updated[3]).getByText("-2")).toBeTruthy()
})
it("Sort TrialTable by duration", () => {
const { getAllByRole, getByText } = render(
<TrialTable studyDetail={study_detail} />
)
fireEvent.click(getByText("Duration(ms)"))
const rows = getAllByRole("row")
expect(within(rows[1]).getByText("1000")).toBeTruthy()
expect(within(rows[3]).getByText("2000")).toBeTruthy()
fireEvent.click(getByText("Duration(ms)"))
const rows_updated = getAllByRole("row")
expect(within(rows_updated[1]).getByText("2000")).toBeTruthy()
expect(within(rows_updated[3]).getByText("1000")).toBeTruthy()
})
it("Sort TrialTable by state", () => {
const { getAllByRole, getByText } = render(
<TrialTable studyDetail={study_detail} />
)
fireEvent.click(getByText("State"))
const rows = getAllByRole("row")
expect(within(rows[1]).getByText("Complete")).toBeTruthy()
expect(within(rows[3]).getByText("Fail")).toBeTruthy()
fireEvent.click(getByText("State"))
const rows_updated = getAllByRole("row")
expect(within(rows_updated[1]).getByText("Fail")).toBeTruthy()
expect(within(rows_updated[3]).getByText("Complete")).toBeTruthy()
})
jest.config.js
+11
View File
@@ -0,0 +1,11 @@
module.exports = {
preset: 'ts-jest',
testEnvironment: 'jsdom',
setupFiles: ["jest-canvas-mock"],
globals: {
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
'APP_BAR_TITLE': JSON.stringify(process.env.APP_BAR_TITLE || "Optuna Dashboard"),
'API_ENDPOINT': JSON.stringify(process.env.API_ENDPOINT),
'URL_PREFIX': JSON.stringify(process.env.URL_PREFIX || "/dashboard")
}
};
optuna_dashboard/static/components/DataGrid.tsx
+6 -6
View File
@@ -54,7 +54,7 @@ interface DataGridColumn<T> {
less?: (a: T, b: T) => number
filterable?: boolean
toCellValue?: (rowIndex: number) => string | React.ReactNode
padding?: "default" | "checkbox" | "none"
padding?: "normal" | "checkbox" | "none"
}
interface RowFilter<T> {
@@ -156,7 +156,7 @@ function DataGrid<T>(props: {
{columns.map((column, index) => (
<TableCell
key={index}
padding={column.padding || "default"}
padding={column.padding || "normal"}
sortDirection={orderBy === column.field ? order : false}
>
<span className={classes.tableHeaderCell}>
@@ -225,8 +225,8 @@ function DataGrid<T>(props: {
count={filteredRows.length}
rowsPerPage={rowsPerPage}
page={page}
onChangePage={handleChangePage}
onChangeRowsPerPage={handleChangeRowsPerPage}
onPageChange={handleChangePage}
onRowsPerPageChange={handleChangeRowsPerPage}
/>
</div>
)
@@ -273,7 +273,7 @@ function DataGridRow<T>(props: {
return column.filterable ? (
<TableCell
key={`${row[keyField]}:${column.field}:${columnIndex}`}
padding={column.padding || "default"}
padding={column.padding || "normal"}
onClick={(e) => {
handleClickFilterCell(column.field, row[column.field])
}}
@@ -283,7 +283,7 @@ function DataGridRow<T>(props: {
) : (
<TableCell
key={`${row[keyField]}:${column.field}:${columnIndex}`}
padding={column.padding || "default"}
padding={column.padding || "normal"}
>
{cellItem}
</TableCell>
optuna_dashboard/static/components/StudyDetail.tsx
+1 -1
View File
@@ -395,7 +395,7 @@ export const StudyDetail: FC = () => {
)
}
const TrialTable: FC<{ studyDetail: StudyDetail | null }> = ({
export const TrialTable: FC<{ studyDetail: StudyDetail | null }> = ({
studyDetail,
}) => {
const trials: Trial[] = studyDetail !== null ? studyDetail.trials : []
package-lock.json
Generated
+7332 -4630
View File
File diff suppressed because it is too large Load Diff
package.json
+10 -3
View File
@@ -5,12 +5,13 @@
"description": "Dashboard for Optuna",
"main": "index.js",
"scripts": {
"fmt": "prettier --write \"optuna_dashboard/static/**/*.{ts,tsx}\"",
"lint": "eslint . --ext .ts,.tsx && prettier --list-different \"optuna_dashboard/static/**/*.{ts,tsx}\"",
"fmt": "prettier --write \"optuna_dashboard/static/**/*.{ts,tsx}\" \"frontend_tests/*.{ts,tsx}\"",
"lint": "eslint . --ext .ts,.tsx && prettier --list-different \"optuna_dashboard/static/**/*.{ts,tsx}\" \"frontend_tests/*.{ts,tsx}\"",
"watch": "webpack --watch",
"build": "webpack",
"build:dev": "NODE_ENV=development webpack",
"build:prd": "NODE_ENV=production webpack"
"build:prd": "NODE_ENV=production webpack",
"test": "jest frontend_tests"
},
"author": "Masashi Shibata",
"license": "MIT",
@@ -27,6 +28,9 @@
},
"devDependencies": {
"@babel/core": "^7.14.3",
"@babel/preset-env": "^7.14.5",
"@testing-library/react": "^12.0.0",
"@types/jest": "^26.0.23",
"@types/plotly.js": "^1.54.10",
"@types/react": "^17.0.9",
"@types/react-dom": "^17.0.6",
@@ -34,7 +38,10 @@
"@typescript-eslint/eslint-plugin": "^4.26.1",
"@typescript-eslint/parser": "^4.26.1",
"eslint": "^7.28.0",
"jest": "^27.0.4",
"jest-canvas-mock": "^2.3.1",
"prettier": "^2.3.1",
"ts-jest": "^27.0.3",
"ts-loader": "^8.3.0",
"typescript": "^4.3.2",
"webpack": "^5.38.1",
tsconfig.json
+2 -1
View File
@@ -24,7 +24,8 @@
"./optuna_dashboard/static/index.tsx"
],
"include": [
"./optuna_dashboard/static/types/**/*"
"./optuna_dashboard/static/types/**/*",
"./frontend_tests/**/*"
],
"types": ["node"]
}