diff --git a/src/components/Checkbox.js b/src/components/Checkbox.js
index 05807c3..cac0277 100644
--- a/src/components/Checkbox.js
+++ b/src/components/Checkbox.js
@@ -6,8 +6,8 @@ export const Checkbox = ({ id, taskDesc }) => {
   const archiveTask = () => {
     updateTaskData(id, {
       archived: true,
-    }).then(docRef => {
-      console.log("Task updated successfully , task id:", docRef.id)
+    }).then(() => {
+      console.log("Task updated successfully , task id:", id)
     }).catch(e => console.log("Failed to update the task", e));
   };
 
diff --git a/src/components/IndividualProject.js b/src/components/IndividualProject.js
index fa8e83b..8a346c8 100644
--- a/src/components/IndividualProject.js
+++ b/src/components/IndividualProject.js
@@ -49,6 +49,7 @@ export const IndividualProject = ({ project }) => {
               <button
                 type="button"
                 onClick={() => deleteProject(project.docId)}
+                data-testid="delete"
               >
                 Delete
               </button>
@@ -60,6 +61,7 @@ export const IndividualProject = ({ project }) => {
                 tabIndex={0}
                 role="button"
                 aria-label="Cancel adding project, do not delete"
+                data-testid="cancel"
               >
                 Cancel
               </span>
diff --git a/src/helpers/firestore-api.js b/src/helpers/firestore-api.js
index e287d06..0610202 100644
--- a/src/helpers/firestore-api.js
+++ b/src/helpers/firestore-api.js
@@ -25,7 +25,7 @@ export const addTaskOnFB = async (payload) => {
 }
 
 export const updateTaskData = async (id, newData) => {
-    return await updateDoc(collection(db, "tasks", id), newData)
+    return await updateDoc(doc(db, "tasks", id), newData)
 }
 
 export const deleteProjectFromFB = async (id) => {
diff --git a/src/pages/Dashboard.js b/src/pages/Dashboard.js
index 61f92a6..d8c6539 100644
--- a/src/pages/Dashboard.js
+++ b/src/pages/Dashboard.js
@@ -28,22 +28,27 @@ export default function Dashboard() {
     >
       <div className="w-100" style={{ maxWidth: '400px' }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4">Profile</h2>
-            {error && <Alert variant="danger">{error}</Alert>}
-            <strong>Email:</strong> {currentUser.email}
-            <Link to={ROUTES.HOME} className="btn btn-primary w-100 mt-3">
+          <Card.Body data-testid="profile">
+            <h2 className="text-center mb-4" data-testid="title">Profile</h2>
+            {error && <Alert data-testid="error-message" variant="danger">{error}</Alert>}
+            <strong data-testid="username">Email:</strong> {currentUser.email}
+            <Link
+              to={ROUTES.HOME}
+              className="btn btn-primary w-100 mt-3"
+              data-testid="go-home"
+            >
               Go Home
             </Link>
             <Link
               to={ROUTES.UPDATE_PROFILE}
               className="btn btn-primary w-100 mt-3"
+              data-testid="update-profile"
             >
               Update Profile
             </Link>
           </Card.Body>
         </Card>
-        <div className="w-100 text-center mt-2">
+        <div className="w-100 text-center mt-2" data-testid="logout">
           <Button variant="link" onClick={handleLogout}>
             Log Out
           </Button>
diff --git a/src/pages/ForgotPassword.js b/src/pages/ForgotPassword.js
index fd745dc..78f11ea 100644
--- a/src/pages/ForgotPassword.js
+++ b/src/pages/ForgotPassword.js
@@ -33,25 +33,25 @@ export default function ForgotPassword() {
       style={{ minHeight: "100vh" }}>
       <div className="w-100" style={{ maxWidth: "400px" }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4">Password Reset</h2>
-            {error && <Alert variant="danger">{error}</Alert>}
-            {message && <Alert variant="success">{message}</Alert>}
-            <Form onSubmit={handleSubmit}>
-              <Form.Group id="email">
-                <Form.Label>Email</Form.Label>
-                <Form.Control type="email" ref={emailRef} required />
+          <Card.Body data-testid="forgot-password">
+            <h2 className="text-center mb-4" data-testid="title">Password Reset</h2>
+            {error && <Alert variant="danger" data-testid="error-message">{error}</Alert>}
+            {message && <Alert variant="success" data-testid="success-message">{message}</Alert>}
+            <Form onSubmit={handleSubmit} data-testid="forgot-password-form">
+              <Form.Group id="email" data-testid="email">
+                <Form.Label data-testid="label">Email</Form.Label>
+                <Form.Control data-testid="input" type="email" ref={emailRef} required />
               </Form.Group>
-              <Button disabled={loading} className="w-100" type="submit">
+              <Button disabled={loading} className="w-100" type="submit" data-testid="reset-password-btn">
                 Reset Password
               </Button>
             </Form>
-            <div className="w-100 text-center mt-3">
+            <div className="w-100 text-center mt-3" data-testid="login">
               <Link to="/login">Login</Link>
             </div>
           </Card.Body>
         </Card>
-        <div className="w-100 text-center mt-2">
+        <div className="w-100 text-center mt-2" data-testid="signup">
           Need an account? <Link to={ROUTES.SIGN_UP}>Sign Up</Link>
         </div>
       </div></Container>
diff --git a/src/pages/Login.js b/src/pages/Login.js
index 73fd167..91d0ba0 100644
--- a/src/pages/Login.js
+++ b/src/pages/Login.js
@@ -35,28 +35,28 @@ export default function Login() {
       style={{ minHeight: "100vh" }}>
       <div className="w-100" style={{ maxWidth: "400px" }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4">Log In</h2>
-            {error && <Alert variant="danger">{error}</Alert>}
-            <Form onSubmit={handleSubmit}>
-              <Form.Group id="email">
-                <Form.Label>Email</Form.Label>
-                <Form.Control type="email" ref={emailRef} required />
+          <Card.Body data-testid="login-card">
+            <h2 className="text-center mb-4" data-testid="title">Log In</h2>
+            {error && <Alert data-testid="error-message" variant="danger">{error}</Alert>}
+            <Form onSubmit={handleSubmit} data-testid="login-form">
+              <Form.Group id="email" data-testid="email">
+                <Form.Label data-testid="label">Email</Form.Label>
+                <Form.Control type="email" ref={emailRef} required data-testid="input" />
               </Form.Group>
-              <Form.Group id="password">
-                <Form.Label>Password</Form.Label>
-                <Form.Control type="password" ref={passwordRef} required />
+              <Form.Group id="password" data-testid="password">
+                <Form.Label data-testid="label">Password</Form.Label>
+                <Form.Control type="password" ref={passwordRef} required data-testid="input" />
               </Form.Group>
-              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }} >
+              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }} data-testid="loginbtn">
                 Log In
               </Button>
             </Form>
-            <div className="w-100 text-center mt-3">
+            <div className="w-100 text-center mt-3" data-testid="forgot-password">
               <Link to={ROUTES.FORGOT_PASSWORD} style={{ color: "#0080c8" }}>Forgot Password?</Link>
             </div>
           </Card.Body>
         </Card>
-        <div className="w-100 text-center mt-2">
+        <div className="w-100 text-center mt-2" data-testid="signup" >
           Need an account? <Link to={ROUTES.SIGN_UP} style={{ color: "#0080c8" }}>Sign Up</Link>
         </div>
       </div></Container >
diff --git a/src/pages/NotFound.js b/src/pages/NotFound.js
index 341e92d..0da235a 100644
--- a/src/pages/NotFound.js
+++ b/src/pages/NotFound.js
@@ -13,9 +13,9 @@ export default function NotFound() {
       style={{ minHeight: "100vh" }}>
       <div className="w-100" style={{ maxWidth: "400px" }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4"> Page Not Found</h2>
-            <Link to={ROUTES.HOME} className="btn btn-primary w-100 mt-3">
+          <Card.Body data-testid="not-found-page">
+            <h2 className="text-center mb-4" data-testid="title"> Page Not Found</h2>
+            <Link to={ROUTES.HOME} className="btn btn-primary w-100 mt-3" data-testid="go-back">
               Go Back To Home
             </Link>
           </Card.Body>
diff --git a/src/pages/Signup.js b/src/pages/Signup.js
index d8e0e51..853e24d 100644
--- a/src/pages/Signup.js
+++ b/src/pages/Signup.js
@@ -42,29 +42,29 @@ export default function Signup() {
       style={{ minHeight: "100vh" }}>
       <div className="w-100" style={{ maxWidth: "400px" }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4">Sign Up</h2>
-            {error && <Alert variant="danger">{error}</Alert>}
-            <Form onSubmit={handleSubmit}>
-              <Form.Group id="email">
-                <Form.Label>Email</Form.Label>
-                <Form.Control type="email" placeholder="member@utasks.com" ref={emailRef} required />
+          <Card.Body data-testid="signup-card">
+            <h2 className="text-center mb-4" data-testid="title">Sign Up</h2>
+            {error && <Alert variant="danger" data-testid="error-message">{error}</Alert>}
+            <Form onSubmit={handleSubmit} data-testid="signup-form">
+              <Form.Group id="email" data-testid="email">
+                <Form.Label data-testid="label">Email</Form.Label>
+                <Form.Control type="email" placeholder="member@utasks.com" ref={emailRef} required data-testid="input" />
               </Form.Group>
-              <Form.Group id="password">
-                <Form.Label>Password</Form.Label>
-                <Form.Control type="password" ref={passwordRef} required />
+              <Form.Group id="password" data-testid="password">
+                <Form.Label data-testid="label">Password</Form.Label>
+                <Form.Control type="password" ref={passwordRef} required data-testid="input" />
               </Form.Group>
-              <Form.Group id="password-confirm">
-                <Form.Label>Password Confirmation</Form.Label>
-                <Form.Control type="password" ref={passwordConfirmRef} required />
+              <Form.Group id="password-confirm" data-testid="confirm-password">
+                <Form.Label data-testid="label">Password Confirmation</Form.Label>
+                <Form.Control type="password" ref={passwordConfirmRef} required data-testid="input" />
               </Form.Group>
-              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }}>
+              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }} data-testid="signup-btn">
                 Sign Up
               </Button>
             </Form>
           </Card.Body>
         </Card>
-        <div className="w-100 text-center mt-2">
+        <div className="w-100 text-center mt-2" data-testid="login">
           Already have an account? <Link to="/login" style={{ color: "#0080c8" }}>Log In</Link>
         </div>
       </div>
diff --git a/src/pages/UpdateProfile.js b/src/pages/UpdateProfile.js
index 58856da..2ce6b86 100644
--- a/src/pages/UpdateProfile.js
+++ b/src/pages/UpdateProfile.js
@@ -49,42 +49,45 @@ export default function UpdateProfile() {
       style={{ minHeight: "100vh" }}>
       <div className="w-100" style={{ maxWidth: "400px" }}>
         <Card>
-          <Card.Body>
-            <h2 className="text-center mb-4">Update Profile</h2>
-            {error && <Alert variant="danger">{error}</Alert>}
-            <Form onSubmit={handleSubmit}>
-              <Form.Group id="email">
-                <Form.Label>Email</Form.Label>
+          <Card.Body data-testid="update-card">
+            <h2 className="text-center mb-4" data-testid="title">Update Profile</h2>
+            {error && <Alert variant="danger" data-testid="error-message">{error}</Alert>}
+            <Form onSubmit={handleSubmit} data-testid="ypdate-form">
+              <Form.Group id="email" data-testid="email">
+                <Form.Label data-testid="label">Email</Form.Label>
                 <Form.Control
                   type="email"
                   ref={emailRef}
                   required
                   defaultValue={currentUser.email}
+                  data-testid="input"
                 />
               </Form.Group>
-              <Form.Group id="password">
-                <Form.Label>Password</Form.Label>
+              <Form.Group id="password" data-testid="password">
+                <Form.Label data-testid="label">Password</Form.Label>
                 <Form.Control
                   type="password"
                   ref={passwordRef}
-                  placeholder="Leave blank to keep the same"
+                  placeholder="Enter you password"
+                  data-testid="input"
                 />
               </Form.Group>
-              <Form.Group id="password-confirm">
-                <Form.Label>Password Confirmation</Form.Label>
+              <Form.Group id="password-confirm" data-testid="confirm-password">
+                <Form.Label data-testid="label" >Password Confirmation</Form.Label>
                 <Form.Control
                   type="password"
                   ref={passwordConfirmRef}
-                  placeholder="Leave blank to keep the same"
+                  placeholder="Re-enter your password"
+                  data-testid="input"
                 />
               </Form.Group>
-              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }} >
+              <Button disabled={loading} className="w-100" type="submit" style={{ background: "#0080c8", borderColor: "#0080c8" }} data-testid="update-btn">
                 Update
               </Button>
             </Form>
           </Card.Body>
         </Card>
-        <div className="w-100 text-center mt-2">
+        <div className="w-100 text-center mt-2" data-testid="cancel">
           <Link to="/" style={{ color: "#0080c8" }} > Cancel</Link>
         </div>
       </div ></Container >