ARIA label modal as dialog

cornell-dti · Nov 7, 2023 · 741150f · 741150f
1 parent 0bd29ea
commit 741150f
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -37,7 +37,7 @@
     "typescript": "^4.8.4"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "react-scripts --openssl-legacy-provider start",
     "build": "react-scripts build",
     "tsc": "../node_modules/.bin/tsc --noEmit false",
     "lint": "eslint . --ext .js --ext .jsx --ext .ts --ext .tsx --fix",

diff --git a/frontend/src/components/Modal/ConfirmationModal.tsx b/frontend/src/components/Modal/ConfirmationModal.tsx
@@ -65,7 +65,7 @@ const ConfirmationModal = ({
   };
 
   return (
-    <Modal title={''} isOpen={open} onClose={closeModal} displayClose={true}>
+    <Modal title={''} isOpen={open} onClose={closeModal} displayClose={true} id="confirm-modal">
       <div className={styles.modal}>
         <p className={styles.modalText}>
           Are you sure you want to remove {user.firstName} {user.lastName}?

diff --git a/frontend/src/components/Modal/Modal.tsx b/frontend/src/components/Modal/Modal.tsx
@@ -71,7 +71,12 @@ const Modal = ({
             }}
           >
             <div className={styles.background}>
-              <div className={styles.modal}>
+              <div
+                className={styles.modal}
+                role="dialog"
+                aria-modal="true"
+                aria-labelledby={id}
+              >
                 <div className={styles.topContainer}>
                   {isRider ? (
                     <h1 className={styles.title} id={id}>