Skip to content

Commit

Permalink
UX enhancements (#274)
Browse files Browse the repository at this point in the history 
* fix: remove document ID at top of document preview

* feat: add spinner during file preparation on document preview screen

* feat: add the map to the swiper

* fix: reduce thumbnail size in activity cards

* feat: replace + sign with a hambuger menu and add a cross to close the FAB in edit travel

* feat: enhance UX for fabs on the map

* test: fix the tests after the ux improvements

* test: complete tests to test new behavior of the fabs on map
  • Loading branch information
@ArthurChalard
ArthurChalard authored Dec 20, 2024
1 parent 3d307d1 commit 2bcfef4
Show file tree
Hide file tree
Showing 9 changed files with 207 additions and 186 deletions.
5 changes: 5 additions & 0 deletions app/src/androidTest/java/com/github/se/travelpouch/e2e/DocumentUpload.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import androidx.test.espresso.intent.Intents.intending
import androidx.test.espresso.intent.matcher.IntentMatchers.hasAction
import androidx.test.espresso.intent.rule.IntentsTestRule
import androidx.test.platform.app.InstrumentationRegistry.getInstrumentation
import androidx.test.rule.GrantPermissionRule
import com.github.se.travelpouch.MainActivity
import com.github.se.travelpouch.di.AppModule
import com.google.firebase.Timestamp
Expand Down Expand Up @@ -56,6 +57,10 @@ class DocumentUpload {

@get:Rule(order = 2) val intentsTestRule = IntentsTestRule(MainActivity::class.java)

@Rule(order = 3)
fun grantPermissionRule() =
GrantPermissionRule.grant(android.Manifest.permission.ACCESS_FINE_LOCATION)

@Inject lateinit var firestore: FirebaseFirestore
@Inject lateinit var auth: FirebaseAuth

Expand Down
27 changes: 12 additions & 15 deletions ...rc/androidTest/java/com/github/se/travelpouch/ui/dashboard/map/ActivitiesMapScreenTest.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@ package com.github.se.travelpouch.ui.dashboard.map

import android.Manifest
import android.content.pm.PackageManager
import androidx.compose.runtime.mutableStateOf
import androidx.compose.ui.test.assert
import androidx.compose.ui.test.assertIsDisplayed
import androidx.compose.ui.test.assertTextEquals
import androidx.compose.ui.test.junit4.createComposeRule
import androidx.compose.ui.test.onNodeWithTag
Expand Down Expand Up @@ -34,7 +36,6 @@ import org.junit.Test
import org.junit.runner.RunWith
import org.mockito.Mockito.anyString
import org.mockito.Mockito.mock
import org.mockito.Mockito.verify
import org.mockito.Mockito.`when`
import org.mockito.kotlin.any
import org.mockito.kotlin.anyOrNull
Expand Down Expand Up @@ -168,20 +169,6 @@ class ActivitiesMapScreenTest {
composeTestRule.onNodeWithTag("Map").assertExists()
}

@Test
fun testGoBackButton() {
composeTestRule.setContent {
ActivitiesMapScreen(
activityViewModel = mockActivityModelView, navigationActions = mockNavigationActions)
}

composeTestRule.waitForIdle()

composeTestRule.onNodeWithTag("GoBackButton").performClick()

verify(mockNavigationActions).goBack()
}

@Test
fun testActivityDetailsContentDisplaysCorrectDetails() {
composeTestRule.setContent {
Expand Down Expand Up @@ -310,12 +297,14 @@ class ActivitiesMapScreenTest {
fun testTravelModeButtonActivities() {
var showPathsState = false
var selectedTravelMode = "walking"
val expandable = mutableStateOf(true)

composeTestRule.setContent {
TravelModeButtonActivities(
showPaths = showPathsState,
onTogglePaths = { showPathsState = !showPathsState },
travelMode = selectedTravelMode,
expanded = expandable,
onTravelModeChange = { mode -> selectedTravelMode = mode })
}

Expand All @@ -325,26 +314,34 @@ class ActivitiesMapScreenTest {
// Click the toggle button to enable paths
composeTestRule.onNodeWithTag("ToggleModeButtonActivities").performClick()
assert(showPathsState) // Verify state is updated
composeTestRule.onNodeWithTag("ToggleModeButtonActivities").performClick()
assert(!showPathsState) // Verify state is updated

// Verify "Walking Mode" button exists
composeTestRule.onNodeWithTag("WalkingModeButtonActivities").assertExists()

// Switch to "Driving Mode"
composeTestRule.onNodeWithTag("WalkingModeButtonActivities").performClick()
assert(selectedTravelMode == "walking") // Verify state is updated
composeTestRule.onNodeWithTag("ToggleModeButtonActivities").assertIsDisplayed()
expandable.value = true

// Verify "Driving Mode" button exists
composeTestRule.onNodeWithTag("DrivingModeButtonActivities").assertExists()

// Switch to "Driving Mode"
composeTestRule.onNodeWithTag("DrivingModeButtonActivities").performClick()
assert(selectedTravelMode == "driving") // Verify state is updated
composeTestRule.onNodeWithTag("ToggleModeButtonActivities").assertIsDisplayed()
expandable.value = true

// Verify "Bicycling Mode" button exists
composeTestRule.onNodeWithTag("BicyclingModeButtonActivities").assertExists()

// Switch to "Bicycling Mode"
composeTestRule.onNodeWithTag("BicyclingModeButtonActivities").performClick()
expandable.value = true
composeTestRule.onNodeWithTag("ToggleModeButtonActivities").assertIsDisplayed()
assert(selectedTravelMode == "bicycling") // Verify state is updated
}

Expand Down
3 changes: 0 additions & 3 deletions app/src/androidTest/java/com/github/se/travelpouch/ui/documents/DocumentPreviewTest.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,9 +132,6 @@ class DocumentPreviewTest {
composeTestRule.onNodeWithTag("goBackButton").assertIsDisplayed()
composeTestRule.onNodeWithTag("deleteButton").assertIsDisplayed()
composeTestRule.onNodeWithTag("linkingButton").assertIsDisplayed()
composeTestRule
.onNodeWithTag("documentTitle", useUnmergedTree = true)
.assertTextContains("Document ID: ref_id")
composeTestRule.waitUntil(1000) { composeTestRule.onNodeWithTag("document").isDisplayed() }
}

Expand Down
70 changes: 44 additions & 26 deletions app/src/androidTest/java/com/github/se/travelpouch/ui/navigation/PagerSwipeTest.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,20 @@ import androidx.compose.ui.test.swipeLeft
import androidx.compose.ui.test.swipeRight
import androidx.datastore.core.DataStore
import androidx.datastore.preferences.core.Preferences
import androidx.test.rule.GrantPermissionRule
import com.github.se.travelpouch.model.activity.ActivityRepository
import com.github.se.travelpouch.model.activity.ActivityViewModel
import com.github.se.travelpouch.model.dashboard.CalendarViewModel
import com.github.se.travelpouch.model.documents.DocumentRepository
import com.github.se.travelpouch.model.documents.DocumentViewModel
import com.github.se.travelpouch.model.documents.DocumentsManager
import com.github.se.travelpouch.model.travels.ListTravelViewModel
import com.github.se.travelpouch.model.travels.Location
import com.github.se.travelpouch.model.travels.Participant
import com.github.se.travelpouch.model.travels.Role
import com.github.se.travelpouch.model.travels.TravelContainer
import com.github.se.travelpouch.model.travels.TravelRepository
import com.google.firebase.Timestamp
import org.junit.Before
import org.junit.Rule
import org.junit.Test
Expand All @@ -31,6 +37,10 @@ class PagerSwipeTest {

@get:Rule val composeTestRule = createComposeRule()

@Rule
fun grantPermissionRule() =
GrantPermissionRule.grant(android.Manifest.permission.ACCESS_FINE_LOCATION)

private lateinit var mockActivityRepository: ActivityRepository
private lateinit var mockNavigationActions: NavigationActions
private lateinit var mockTravelRepository: TravelRepository
Expand All @@ -57,27 +67,38 @@ class PagerSwipeTest {
documentViewModel =
DocumentViewModel(mockDocumentRepository, mockDocumentsManager, mockDataStore)
listTravelViewModel = ListTravelViewModel(mockTravelRepository)
listTravelViewModel.selectTravel(
TravelContainer(
"qwertzuiopasdfghjkly",
"Travel title",
"Travel description",
Timestamp(1234567890L + 3600, 0),
Timestamp(1234567890L + 200_000L, 0),
Location(0.0, 0.0, Timestamp.now(), "Location"),
mapOf(),
mapOf(Participant("qwertzuiopasdfghjklyxcvbnm12") to Role.OWNER),
listOf("qwertzuiopasdfghjklyxcvbnm12")))
}

private fun assertTopBarIsDisplayedCorrectly(composeTestRule: ComposeTestRule, title: String) {
private fun assertTopBarIsDisplayedCorrectly(composeTestRule: ComposeTestRule) {
composeTestRule.onNodeWithTag("topBar").assertIsDisplayed()
composeTestRule.onNodeWithTag("travelTitle").assertIsDisplayed()
composeTestRule.onNodeWithTag("travelTitle").assertTextEquals(title)
composeTestRule.onNodeWithTag("travelTitle").assertTextEquals("Travel title")
composeTestRule.onNodeWithTag("goBackButton").assertIsDisplayed()
composeTestRule.onNodeWithTag("settingsButton").assertIsDisplayed()
composeTestRule.onNodeWithTag("eventTimelineButton").assertIsDisplayed()
}

private fun assertBottomBarIsDisplayedCorrectly(composeTestRule: ComposeTestRule) {
composeTestRule.onNodeWithTag("navigationBarTravelList").assertIsDisplayed()
composeTestRule.onNodeWithTag("Activities").assertIsDisplayed()
composeTestRule.onNodeWithTag("Activities").assertTextEquals("Activities")
composeTestRule.onNodeWithTag("Calendar").assertIsDisplayed()
composeTestRule.onNodeWithTag("Calendar").assertTextEquals("Calendar")
composeTestRule.onNodeWithTag("Map").assertIsDisplayed()
composeTestRule.onNodeWithTag("Map").assertTextEquals("Map")
composeTestRule.onNodeWithTag("Documents").assertIsDisplayed()
composeTestRule.onNodeWithTag("Documents").assertTextEquals("Documents")
composeTestRule.onNodeWithTag("nav-Activities").assertIsDisplayed()
composeTestRule.onNodeWithTag("nav-Activities").assertTextEquals("Activities")
composeTestRule.onNodeWithTag("nav-Calendar").assertIsDisplayed()
composeTestRule.onNodeWithTag("nav-Calendar").assertTextEquals("Calendar")
composeTestRule.onNodeWithTag("nav-Map").assertIsDisplayed()
composeTestRule.onNodeWithTag("nav-Map").assertTextEquals("Map")
composeTestRule.onNodeWithTag("nav-Documents").assertIsDisplayed()
composeTestRule.onNodeWithTag("nav-Documents").assertTextEquals("Documents")
}

@Test
Expand All @@ -97,7 +118,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Activities")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsDisplayed()
composeTestRule.onNodeWithText("for this trip").assertIsDisplayed()
Expand All @@ -107,7 +128,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Activities")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsDisplayed()
composeTestRule.onNodeWithText("for this trip").assertIsDisplayed()
Expand All @@ -118,7 +139,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Calendar")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsNotDisplayed()
composeTestRule.onNodeWithText(" for this trip").assertIsNotDisplayed()
Expand All @@ -129,7 +150,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Documents")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsNotDisplayed()
composeTestRule.onNodeWithText(" for this trip").assertIsNotDisplayed()
Expand All @@ -139,24 +160,21 @@ class PagerSwipeTest {

composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Documents")
composeTestRule.onNodeWithTag("Map").assertIsDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsNotDisplayed()
composeTestRule.onNodeWithText(" for this trip").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("addActivityButton").assertIsNotDisplayed()

composeTestRule.onNodeWithTag("goBackButton").performClick()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("Documents").performClick()
composeTestRule.onNodeWithTag("nav-Documents").performClick()

composeTestRule.onNodeWithTag("pagerSwipe").performTouchInput { swipeRight() }

composeTestRule.onNodeWithTag("calenmdarScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Calendar")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsNotDisplayed()
composeTestRule.onNodeWithText(" for this trip").assertIsNotDisplayed()
Expand All @@ -166,7 +184,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Activities")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsDisplayed()
composeTestRule.onNodeWithText("for this trip").assertIsDisplayed()
Expand All @@ -188,7 +206,7 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Activities")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsDisplayed()
composeTestRule.onNodeWithText("for this trip").assertIsDisplayed()
Expand All @@ -198,21 +216,21 @@ class PagerSwipeTest {
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Calendar")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)

composeTestRule.onNodeWithText("Documents").performClick()
composeTestRule.onNodeWithTag("documentListScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Documents")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)

composeTestRule.onNodeWithText("Activities").performClick()
composeTestRule.onNodeWithTag("travelActivitiesScreen").assertIsDisplayed()
composeTestRule.onNodeWithTag("calenmdarScreen").assertIsNotDisplayed()
composeTestRule.onNodeWithTag("documentListScreen").assertIsNotDisplayed()
assertTopBarIsDisplayedCorrectly(composeTestRule, "Activities")
assertTopBarIsDisplayedCorrectly(composeTestRule)
assertBottomBarIsDisplayedCorrectly(composeTestRule)
composeTestRule.onNodeWithText("No activities planned").assertIsDisplayed()
composeTestRule.onNodeWithText("for this trip").assertIsDisplayed()
Expand Down
Loading

0 comments on commit 2bcfef4

Please sign in to comment.