From bc5c9b606e2ca96698a2305395cca9f3bb08f08d Mon Sep 17 00:00:00 2001 From: Calvin Lu <59149377+calvinlu3@users.noreply.github.com> Date: Fri, 7 Feb 2025 16:52:55 -0500 Subject: [PATCH] Add e2e and screenshot tests for refactored add mutation modal (#495) --- .../webapp/app/config/constants/html-id.ts | 6 + .../app/shared/modal/AddMutationModal.tsx | 7 +- .../modal/MutationModal/AddExonForm.tsx | 5 +- .../MutationModal/AlterationBadgeList.tsx | 9 +- .../AlterationCategoryInputs.tsx | 3 +- .../ExcludedAlterationContent.tsx | 17 +- .../modal/MutationModal/MutationDetails.tsx | 5 +- .../MutationModal/MutationListSection.tsx | 3 + .../webapp/app/shared/util/test-id-utils.ts | 11 ++ src/test/javascript/constants.ts | 5 + ...nnotate-alterations-exon-2-4-deletion.json | 68 +++++++ ...otate-alterations-oncogenic-mutations.json | 46 +++++ .../javascript/data/api-protein-exons.json | 128 ++++++++++++ .../add-mutation-modal--1920x1080.png | Bin 57078 -> 26239 bytes ...utation-modal-add-exon-form--1920x1080.png | Bin 0 -> 24203 bytes ...tion-modal-modify-exon-form--1920x1080.png | Bin 0 -> 48188 bytes ...odal-opened-alteration-info--1920x1440.png | Bin 0 -> 64613 bytes ...odal-with-excluded-mutation--1920x1440.png | Bin 0 -> 51857 bytes src/test/javascript/setup-mocks.ts | 13 ++ .../javascript/spec/add-mutation-modal.e2e.ts | 116 +++++++++++ .../spec/add-mutation-modal.screenshot.ts | 183 ++++++++++++++++++ src/test/javascript/spec/screenshot.ts | 22 --- 22 files changed, 607 insertions(+), 40 deletions(-) create mode 100644 src/test/javascript/data/api-annotate-alterations-exon-2-4-deletion.json create mode 100644 src/test/javascript/data/api-annotate-alterations-oncogenic-mutations.json create mode 100644 src/test/javascript/data/api-protein-exons.json create mode 100644 src/test/javascript/screenshots/baseline/desktop_chrome/add-mutation-modal-add-exon-form--1920x1080.png create mode 100644 src/test/javascript/screenshots/baseline/desktop_chrome/add-mutation-modal-modify-exon-form--1920x1080.png create mode 100644 src/test/javascript/screenshots/baseline/desktop_chrome/add-mutation-modal-opened-alteration-info--1920x1440.png create mode 100644 src/test/javascript/screenshots/baseline/desktop_chrome/add-mutation-modal-with-excluded-mutation--1920x1440.png create mode 100644 src/test/javascript/spec/add-mutation-modal.e2e.ts create mode 100644 src/test/javascript/spec/add-mutation-modal.screenshot.ts diff --git a/src/main/webapp/app/config/constants/html-id.ts b/src/main/webapp/app/config/constants/html-id.ts index 32553f174..186b5f96f 100644 --- a/src/main/webapp/app/config/constants/html-id.ts +++ b/src/main/webapp/app/config/constants/html-id.ts @@ -26,6 +26,12 @@ export const RCT_MODAL_ID = 'relevant-cancer-type-modal'; export const DEFAULT_ADD_MUTATION_MODAL_ID = 'default-add-mutation-modal'; export const ADD_MUTATION_MODAL_INPUT_ID = 'add-mutation-modal-input'; +export const ADD_MUTATION_MODAL_EXCLUDED_ALTERATION_INPUT_ID = 'add-mutation-modal-excluded-alteration-input'; +export const ADD_MUTATION_MODAL_ADD_EXCLUDED_ALTERATION_BUTTON_ID = 'add-mutation-modal-add-excluded-alteration-button'; +export const ADD_MUTATION_MODAL_ADD_EXON_BUTTON_ID = 'add-mutation-modal-add-exon-button'; +export const ADD_MUTATION_MODAL_FLAG_DROPDOWN_ID = 'add-mutation-modal-flag-input'; +export const ADD_MUTATION_MODAL_FLAG_COMMENT_ID = 'add-mutation-modal-flag-comment'; +export const ADD_MUTATION_MODAL_FLAG_COMMENT_INPUT_ID = 'add-mutation-modal-flag-comment-input'; export const SIMPLE_CONFIRM_MODAL_CONTENT_ID = 'simple-confirm-modal-content'; diff --git a/src/main/webapp/app/shared/modal/AddMutationModal.tsx b/src/main/webapp/app/shared/modal/AddMutationModal.tsx index 644a731ce..46122396d 100644 --- a/src/main/webapp/app/shared/modal/AddMutationModal.tsx +++ b/src/main/webapp/app/shared/modal/AddMutationModal.tsx @@ -33,6 +33,7 @@ import classNames from 'classnames'; import { ReferenceGenome } from '../model/enumerations/reference-genome.model'; import { notifyError } from 'app/oncokb-commons/components/util/NotificationUtils'; import DefaultTooltip from '../tooltip/DefaultTooltip'; +import { ADD_MUTATION_MODAL_ADD_EXON_BUTTON_ID, ADD_MUTATION_MODAL_INPUT_ID } from 'app/config/constants/html-id'; function getModalErrorMessage(mutationAlreadyExists: MutationExistsMeta) { let modalErrorMessage: string | undefined = undefined; @@ -261,7 +262,7 @@ function AddMutationModal({ } else { try { setIsAddAlterationPending(true); - await updateAlterationStateAfterAlterationAdded?.(parseAlterationName(alterationString)); + await updateAlterationStateAfterAlterationAdded?.(parseAlterationName(alterationString, true)); } finally { setIsAddAlterationPending(false); } @@ -353,7 +354,8 @@ function AddMutationModal({