diff --git a/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/OutlinedTextFieldBoxTest.kt b/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/OutlinedTextFieldBoxTest.kt
new file mode 100644
index 000000000..845a0f508
--- /dev/null
+++ b/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/OutlinedTextFieldBoxTest.kt
@@ -0,0 +1,88 @@
+package com.edricchan.studybuddy.ui.widgets.compose.textfield
+
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.test.assertHasClickAction
+import androidx.compose.ui.test.assertHasNoClickAction
+import androidx.compose.ui.test.assertIsDisplayed
+import androidx.compose.ui.test.assertIsEnabled
+import androidx.compose.ui.test.assertIsNotEnabled
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onNodeWithTag
+import androidx.compose.ui.test.performClick
+import com.edricchan.studybuddy.ui.theming.compose.StudyBuddyTheme
+import com.edricchan.studybuddy.ui.widgets.compose.assertExistsAndIsDisplayed
+import org.junit.Rule
+import kotlin.test.Test
+import kotlin.test.assertTrue
+
+class OutlinedTextFieldBoxTest {
+    @get:Rule
+    val composeTestRule = createComposeRule()
+
+    @Test
+    fun outlinedTextFieldBox() {
+        composeTestRule.apply {
+            setContent {
+                StudyBuddyTheme {
+                    OutlinedTextFieldBox(
+                        modifier = boxModifier,
+                        headlineText = { OutlinedTextFieldBoxText() },
+                        leadingIcon = { OutlinedTextFieldBoxLeadingIcon() },
+                        trailingIcon = { OutlinedTextFieldBoxTrailingIcon() }
+                    )
+                }
+            }
+
+            onNodeWithTag(boxTag).apply {
+                assertExists()
+                assertIsDisplayed()
+                assertHasNoClickAction()
+            }
+
+            onNodeWithTag(textTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+
+            onNodeWithTag(leadingIconTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+
+            onNodeWithTag(trailingIconTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+        }
+    }
+
+    @Test
+    fun outlinedTextFieldBox_withOnClickAndEnabled() {
+        var hasClicked = false
+        var enabled by mutableStateOf(true)
+
+        composeTestRule.apply {
+            setContent {
+                StudyBuddyTheme {
+                    OutlinedTextFieldBox(
+                        modifier = boxModifier,
+                        onClick = { hasClicked = true },
+                        enabled = enabled,
+                        headlineText = { OutlinedTextFieldBoxText() },
+                        leadingIcon = { OutlinedTextFieldBoxLeadingIcon() },
+                        trailingIcon = { OutlinedTextFieldBoxTrailingIcon() }
+                    )
+                }
+            }
+
+            val box = onNodeWithTag(boxTag).apply {
+                assertExists()
+                assertIsDisplayed()
+                assertIsEnabled()
+                assertHasClickAction()
+                performClick()
+                assertTrue(hasClicked, "Composable should have been clicked")
+            }
+
+            onNodeWithTag(textTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+            onNodeWithTag(leadingIconTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+            onNodeWithTag(trailingIconTag, useUnmergedTree = true).assertExistsAndIsDisplayed()
+
+            enabled = false
+            box.assertIsNotEnabled()
+        }
+    }
+}
diff --git a/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/Utils.kt b/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/Utils.kt
new file mode 100644
index 000000000..2e4023199
--- /dev/null
+++ b/ui/widgets/compose/src/androidTest/kotlin/com/edricchan/studybuddy/ui/widgets/compose/textfield/Utils.kt
@@ -0,0 +1,47 @@
+@file:Suppress("TestFunctionName")
+
+package com.edricchan.studybuddy.ui.widgets.compose.textfield
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.outlined.CheckCircle
+import androidx.compose.material.icons.outlined.Favorite
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.testTag
+
+internal const val boxTag = "Tag:OutlinedTextFieldBox"
+internal const val textTag = "Tag:Text"
+internal const val leadingIconTag = "Tag:LeadingIcon"
+internal const val trailingIconTag = "Tag:TrailingIcon"
+
+internal val boxModifier = Modifier.testTag(boxTag)
+internal val textModifier = Modifier.testTag(textTag)
+internal val leadingIconModifier = Modifier.testTag(leadingIconTag)
+internal val trailingIconModifier = Modifier.testTag(trailingIconTag)
+
+private const val itemText = "Content of text field"
+
+@Composable
+internal fun OutlinedTextFieldBoxText() {
+    Text(modifier = textModifier, text = itemText)
+}
+
+@Composable
+internal fun OutlinedTextFieldBoxLeadingIcon() {
+    Icon(
+        modifier = leadingIconModifier,
+        imageVector = Icons.Outlined.CheckCircle,
+        contentDescription = null
+    )
+}
+
+@Composable
+internal fun OutlinedTextFieldBoxTrailingIcon() {
+    Icon(
+        modifier = trailingIconModifier,
+        imageVector = Icons.Outlined.Favorite,
+        contentDescription = null
+    )
+}