Skip to content

Commit

Permalink
Pull improvements from KVis fork (OpenImaging#645)
Browse files Browse the repository at this point in the history
* Create .devcontainer/devcontainer.json

* Update gitconfig/exclusions; reorder dependencies

* Upgrading Webpack from 4.x to 5.x and some Vue CLI packages

- Vue CLI packages upgraded because older versions of the Vue CLI don't support 5.x
- Change 'port' to 'host' in Vue config (per Webpack 5.x requirements)
- Remove port from 'PUBLIC_ADDRESS' in .env.development so it will work with 'host'.

* Upgrading core-js to supported version and update ESLint and most dependents of ESLint

- Add Vuetify ESLint plugin. Note that this needs to stay at 1.x, the 2.x release is for Vuetify 3.

* Removing deprecated `babel-eslint` and replacing with `@babel/eslint-parser`

* Upgrade Vuetify from 2.6.3 to 2.6.14

* Upgrading Vuex, updating ESLint config

- Ensure that both `@vue/airbnb` and `@vue/typescript/recommended` are enabled
- Turn off ESLint rule regarding providing file extensions when importing

* Adding Jest for unit testing

* Adding TS import resolver to do away with errors when importing

For example '@/django' previously threw an error

* Minor linting changes

* Creating `storeConfig` that is consumed by `createDirectStore` and can be used for unit testing

Minor formatting updates, removing `rootActionContext`, `moduleActionContext`, `rootGetterContext`, `moduleGetterContext` as these appear to be unused

Note: We don't want to mount the actual MIQA store when performing tests, rather we want to create an instance specifically for testing. This isn't easy to accomplish when the store is exported as already implemented. By separating the declaration and implementation of the store (using `storeConfig`) `createDirectStore` can still export `store` as the MIQA store instance while Jest can also pull in the `storeConfig` to implement its own testing instance.

* Updating Jest configs

Note: Some of our node modules are not in the expected form. Usually Jest ignores the contents of the `node_modules` folder but in our case we need it to interact with a few directly, they are listed in the config file under `transformIgnorePatterns`

Note: Some file formats are not natively supported by Jest (e.g. most static assets), using `moduleNameMapper` we can have `jest-transform-stub` stub them out so they don't cause issues

* Adding basic unit test of `setCurrentVtkIndexSlices`

* Minor code refactoring, mainly using primitive types instead of object types

Note: See https://betterprogramming.pub/how-to-use-lowercase-types-for-primitives-and-objects-in-typescript-ddd00273849a

* Removing unneeded pug related dependencies

* Correcting tsconfig to target Vue 2 rather than 3, add `@vue/runtime-dom` which provides typing for Vue

* Removing `direct-vuex`, add additional type defs

* Minor code reformatting, specifying `lang="ts"` where appropriate

* Refactoring to standard Vuex style instead of `direct-vuex`

* Refactoring to standard Vuex style instead of `direct-vuex`, type `storeConfig` explicitly

* Update types

* Add missing properties/types to types, correct scans from having value `string[]` to `Scan`.

* Reorging types roughly by alphabetical order (User/Email at beginning, MIQAStore at end) to allow easier navigation between types

* Explicitly define permissions object

* Remove `MIQAStore` as type from `initState`, TODO regarding windowLocked

* Explicitly declaring `any` type on VRangeSlider

`options` is part of an undocumented API and thus no TS types have been defined, see: vuejs/vue-class-component#337

* Fix Vue shim, add `artifact_states` to `MIQAConfig` in store

* Refactoring `ControlPanel` to use Composition API and...

- Adding missing `lockCycle` to `data`
- Comment out non-existent catch handling

* Making `frame_evaluation` optional on `Frame`, adding `artifact_options` (optional) to `MIQAConfig` and...

Update target version in `tsconfig.json` to `2.7`

* Upgrading `vue` from `2.6.14` to `2.7.14` which allows us to remove `@vue/composition-api` and `@vue/runtime-dom`

* Minimal refactoring to remove dependency on `@vue/composition-api` from components and fixing incorrect syntax for `setTaskOverview` in `DecisionButtons.vue`

* Override TS depend version, upgrade vue router

* Refactor `hashCode` so conversion of boolean to number is explicit

* Add additional optional properties to `ResponseData` to eliminate TS complaints

* Adding types to various variables, ESLint fix

* Refactor keydown event listener in ControlPanel to use explicit types, use `tagName` instead of `type`

* Fix issue with app not running when using docker container for npm

* Add playwright and basic test

* Minor reformatting fixes for ESLint includes renaming a few components...

- Scan -> ScanView
- Projects -> ProjectsView

Disable Vuetify rules for the moment, changes required too disruptive

* Add keydown for accessibility

* Fix decisions on `ScanDecision` to be string not array, specify `last` in `Scan` has a type of `ScanDecision`

Ignoring complaints about multi-word component names for Vue plugins

Minor spelling corrections

* Adding properties to store that are utilized but not called

Ignore Navbar multi-world lint rule

* Correcting type of duration on WindowLock

* Move `snackbarAttach` and `promptAttach` into `mounted` to avoid TS complaining.

* Remove any, replace with explicit import of VRangeSlider

* Removing playwright tests on pull

* Removing pyppeteer and codecov from tests

* Removing with: related to codecov

* Removing unused ColorMaps, updating gitignore, old pyppeteer tox config

* Updating dependencies

* Minor code refactorings...

Primarily reformatting for consistency, ESLint compliance
Addition of some explanatory comments
Renaming ExperimentsView's scanState method's state variable to scanTaskState for clarity

* Refactoring store, Scan...

Renaming Vuex store action `getScan` to `loadScan`, this makes it consistent with other Vuex naming

Renaming method `loadScan` in `Scan.vue` to `swapToScan` to avoid naming conflict and replace call to `getScan` with `loadScan`

* Removing unused constants, extracting timeout constants into constants.ts, adding TS types to snackbar, renaming `reset` to `continueSession` in `TimeoutDialog`

* Minor refactoring of ControlPanel

switchLock parameters newExp and oldExp now newExperimentId, oldExperimentId

Additional comments

* Refactoring of DecisionButtons.vue...

- Removing `currentViewData` from `mapState` b/c (1) it's a getter and (2) it's included in `mapGetters`
- Renaming `dec` in `suggestedArtifacts` to `decision`
- Adding `AUTO_ADVANCE` flag which determines whether scans advance when a decision is made

* Minor refactoring for VtkViewer...

- Renaming slice parameter `value` to `newSlice`
- Adding type declaration in `takeScreenshot`

* Refactoring Vuex store...

- Adding a mutation-types.ts file which declares all the mutations we'll be using in the store
- Updating the mutations to standardized naming provided by mutation-types.ts
- Adding type for `proxyManager` param of `shrinkProxyManager` and `prepareProxyManager`
- Adding/updating comments throughout

* Refactoring Vuex store...

- Removing unused `wholeState` getter
- Refactoring `ADD_SCAN_DECISION` params from `currentScan`, `newDecision` to `currentScanId`, `newScanDecision`
- Refactoring `SET_FRAME_EVALUATION` param from `evaluation` to `frameEvaluation`
- Additional refactorings:
  - SET_LOADING_FRAME: value -> isLoading
  - SET_ERROR_LOADING_FRAME: value -> isErrorLoading
  - ADD_SCAN_FRAME: sid, id -> scanId, frameId
  - ADD_EXPERIMENT_SCANS: eid, sid -> experimentId, scanId
  - ADD_EXPERIMENT: id, value -> experimentId, experiment

* Refactoring Vuex store...

- Renaming variable `i` in `loadProject` to `experimentIndex`
- Renaming variable `j` in `loadProject` to `scanIndex`
- Renaming variable `k` in `loadProject` to `frameIndex`

* Refactoring Vuex store...

- Renaming `getArrayName` to `getArrayNameFromFilename`
- Renaming `getData` to `getImageData`
  - Renaming param `id` to `frameId`
- Renaming `loadFile` and `loadFileAndGetData` variable `fileP` to `cachedFile`
- Reduce nesting of async calls in `loadFileAndGetData`
- Renaming `i, j` params in `getNextFrame` to `experimentIndex, scanIndex`

* Updating calls to Vuex store to use new mutation standardized names, also fixing a problem where crosshair persistence and visibility where not being set correctly

Updating Vuex test to use new mutation names

* Updating mutation naming in a number of components

* Updating mutation naming in Projects, fixing sorting issue for `decisionToRating` in ExperimentsView

* Adding await to `this.refreshTaskOverview()`, `this.login`, `this.loadProject(this.currentProject)`, `store.dispatch('loadProject', newProject)` and `djangoRest.projects`

Updating mutation naming in django.ts

* Removing unused mutations setCurrentWindowWidth and setCurrentWindowLevel from Vuex store

* Remove unnecessary file additions

* Move playwright test to top-level CI

* Remove outdated vue-utilities directory

* Manage snackbar with App and store

* Make all components use composition api and similar structure

* Type fixes

* Update packages

* Behavior fixes

* Update github action versions for npm, tox, ci

* Updating package-lock

* Test update to CI

* New ci test

* Updating package-lock

* Disabling playwright github action

* Remove commented lines

* Remove ci.yml.old file

---------

Co-authored-by: Dave Mackey <[email protected]>
  • Loading branch information
annehaley and davidshq authored May 1, 2023
1 parent d159e42 commit 6f15153
Show file tree
Hide file tree
Showing 61 changed files with 13,547 additions and 43,002 deletions.
3 changes: 3 additions & 0 deletions .gitattributes
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
*.png -text
* text eol=lf

2 changes: 1 addition & 1 deletion .github/actions/npm/action.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ name: Cache node modules
runs:
using: composite
steps:
- uses: actions/setup-node@v2
- uses: actions/setup-node@v3
with:
node-version: "16"

Expand Down
2 changes: 1 addition & 1 deletion .github/actions/tox/action.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ name: Cache tox
runs:
using: composite
steps:
- uses: actions/setup-python@v2
- uses: actions/setup-python@v4
with:
python-version: "3.8"
# - name: cache-tox
Expand Down
64 changes: 21 additions & 43 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ jobs:
lint:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v3
- uses: ./.github/actions/tox
- uses: ./.github/actions/npm
- run: tox -e lint
Expand Down Expand Up @@ -40,7 +40,7 @@ jobs:
ports:
- 9000:9000
steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v3
- uses: ./.github/actions/lfs
- uses: ./.github/actions/tox
- run: tox
Expand All @@ -51,45 +51,23 @@ jobs:
DJANGO_MINIO_STORAGE_ACCESS_KEY: minioAccessKey
DJANGO_MINIO_STORAGE_SECRET_KEY: minioSecretKey
DJANGO_STORAGE_BUCKET_NAME: django-storage
- uses: codecov/codecov-action@v2
with:
fail_ci_if_error: true

pyppeteer:
runs-on: ubuntu-latest
services:
postgres:
image: postgres:latest
env:
POSTGRES_DB: django
POSTGRES_PASSWORD: postgres
ports:
- 5432:5432
rabbitmq:
image: rabbitmq:management
ports:
- 5672:5672
minio:
image: bitnami/minio:latest
env:
MINIO_ROOT_USER: minioAccessKey
MINIO_ROOT_PASSWORD: minioSecretKey
ports:
- 9000:9000
steps:
- uses: actions/checkout@v2
- uses: ./.github/actions/tox
- uses: ./.github/actions/lfs
- uses: ./.github/actions/npm
- uses: docker://ghcr.io/girder/pytest-pyppeteer:v0.0.11
with:
install_directory: web_client
install_command: npm install
test_directory: .
test_command: tox -e test-pyppeteer
env:
DJANGO_DATABASE_URL: postgres://postgres:postgres@postgres:5432/django
DJANGO_MINIO_STORAGE_ENDPOINT: minio:9000
DJANGO_MINIO_STORAGE_ACCESS_KEY: minioAccessKey
DJANGO_MINIO_STORAGE_SECRET_KEY: minioSecretKey
DJANGO_STORAGE_BUCKET_NAME: integration-test-bucket
# playwright:
# timeout-minutes: 60
# runs-on: ubuntu-latest
# steps:
# - uses: actions/checkout@v3
# - uses: actions/setup-node@v3
# with:
# node-version: 16
# - name: Install dependencies
# run: cd web_client && npm ci
# - name: Install Playwright Browsers
# run: cd web_client && npx playwright install --with-deps
# - name: Run Playwright tests
# run: cd web_client && npx playwright test
# - uses: actions/upload-artifact@v3
# with:
# name: playwright-report
# path: playwright-report/
# retention-days: 30
8 changes: 8 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -127,5 +127,13 @@ dmypy.json
# Pyre type checker
.pyre/

# JetBrains
.idea/*

# End of https://www.gitignore.io/api/django
samples/**/*.zarr

node_modules/
/test-results/
/playwright-report/
/playwright/.cache/
39 changes: 0 additions & 39 deletions tox.ini
Original file line number Diff line number Diff line change
Expand Up @@ -69,45 +69,6 @@ deps =
commands =
pytest {posargs:--cov=miqa --cov-report=xml}

[testenv:test-pyppeteer]
setenv =
# See https://docs.djangoproject.com/en/4.0/topics/async/#envvar-DJANGO_ALLOW_ASYNC_UNSAFE
DJANGO_ALLOW_ASYNC_UNSAFE = true
# This is necessary for the Django dev server to behave correctly
DJANGO_CONFIGURATION = PyppeteerTestingConfiguration
PYPPETEER_TEST_CLIENT_COMMAND=npm run serve
PYPPETEER_TEST_CLIENT_DIR=web_client
# nodeversion >=17 deprecated some OpenSSL algorithms which a dependency is still using
# https://nodejs.org/en/blog/release/v17.0.0/
PYPPETEER_NODE_OPTIONS=--openssl-legacy-provider
# This differs from the cookiecutter default PYPPETEER_VUE_APP_API_ROOT, so we need to set it manually
# See https://girder-pytest-pyppeteer.readthedocs.io/en/latest/pytest_plugin/#webpack_server
PYPPETEER_VUE_APP_API_URL=\{live_server\}/api/v1
# I had to set this to get the browser window to show up in Ubuntu 20.04
DISPLAY=:1
passenv =
DJANGO_CELERY_BROKER_URL
DJANGO_DATABASE_URL
DJANGO_MINIO_STORAGE_ACCESS_KEY
DJANGO_MINIO_STORAGE_ENDPOINT
DJANGO_MINIO_STORAGE_SECRET_KEY
DJANGO_STORAGE_BUCKET_NAME
PYPPETEER_BROWSER_HEADLESS
extras =
dev
learning
zarr
deps =
factory-boy
girder-pytest-pyppeteer[pyppeteer]
pytest
pytest-cov
pytest-django
pytest-factoryboy
pytest-mock
commands =
pytest -m pyppeteer {posargs:--cov=miqa --cov-report=xml}

[testenv:check-migrations]
setenv =
DJANGO_CONFIGURATION = TestingConfiguration
Expand Down
2 changes: 1 addition & 1 deletion web_client/.env.development
Original file line number Diff line number Diff line change
@@ -1 +1 @@
PUBLIC_ADDRESS=localhost:8081
PUBLIC_ADDRESS=0.0.0.0
9 changes: 8 additions & 1 deletion web_client/.eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,13 @@ module.exports = {
},
extends: [
'plugin:vue/recommended',
'@vue/typescript/recommended',
'@vue/airbnb',
],
parser: 'vue-eslint-parser',
parserOptions: {
parser: {
js: 'babel-eslint',
js: '@babel/eslint-parser',
ts: '@typescript-eslint/parser',
},
},
Expand All @@ -21,6 +22,7 @@ module.exports = {
'func-names': 'off',
'vue/valid-template-root': 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'import/extensions': 'off',
},
ignorePatterns: [
'src/shims-*.d.ts',
Expand All @@ -36,4 +38,9 @@ module.exports = {
},
},
],
settings: {
'import/resolver': {
typescript: {},
},
},
};
3 changes: 3 additions & 0 deletions web_client/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -17,3 +17,6 @@ npm-debug.log*
*.njsproj
*.sln
*.sw*
/test-results/
/playwright-report/
/playwright/.cache/
9 changes: 9 additions & 0 deletions web_client/jest.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
module.exports = {
preset: '@vue/cli-plugin-unit-jest/presets/typescript-and-babel',
transformIgnorePatterns: [
'node_modules/(?!(vtk.js|itk|@girder/oauth-client|django-s3-file-field|d3-scale|d3-array|internmap|d3-.*)/)',
],
moduleNameMapper: {
'^.+.(vert|frag|glsl)$': 'jest-transform-stub',
},
};
Loading

0 comments on commit 6f15153

Please sign in to comment.