Fix oppia#2635: [A11y]Topic Lessons (oppia#3476)

* A11y Topic Lessons * A11y Topic Lessons Co-authored-by: Rajat Talesra <[email protected]>
kritigupta45 · Jul 14, 2021 · 3d055ef · 3d055ef
1 parent 09b6e59
commit 3d055ef
Show file tree

Hide file tree

Showing 6 changed files with 83 additions and 9 deletions.
diff --git a/app/src/main/res/layout-land/topic_lessons_story_summary.xml b/app/src/main/res/layout-land/topic_lessons_story_summary.xml
@@ -55,7 +55,8 @@
  <FrameLayout
  android:id="@+id/story_progress_container"
  android:layout_width="wrap_content"
- android:layout_height="wrap_content">
+ android:layout_height="wrap_content"
+ android:contentDescription="@{@string/topic_story_progress_percentage(storyPercentage)}">
 
  <org.oppia.android.app.customview.SegmentedCircularProgressView
  android:id="@+id/story_progress_view"
@@ -92,10 +93,12 @@
  android:orientation="horizontal">
 
  <LinearLayout
+ android:id="@+id/story_name_chapter_count_container"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_marginStart="20dp"
  android:layout_weight="1"
+ android:contentDescription="@{String.format(@string/chapter_count_with_story_name, @plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount), viewModel.storySummary.storyName)}"
  android:gravity="center_vertical"
  android:orientation="vertical">
 
@@ -116,6 +119,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:fontFamily="sans-serif"
+ android:importantForAccessibility="no"
  android:text="@{@plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount)}"
  android:textColor="@color/oppiaPrimaryText"
  android:textSize="16sp" />
@@ -134,7 +138,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal|bottom"
- android:contentDescription="@{@string/show_hide_chapter_list(viewModel.storySummary.storyName)}"
+ android:contentDescription="@{isListExpanded ? @string/hide_chapter_list : @string/show_chapter_list}"
  android:src="@drawable/ic_arrow_drop_down_black_24dp"
  app:isRotationAnimationClockwise="@{isListExpanded}"
  app:rotationAnimationAngle="@{180f}" />

diff --git a/app/src/main/res/layout-sw600dp-land/topic_lessons_story_summary.xml b/app/src/main/res/layout-sw600dp-land/topic_lessons_story_summary.xml
@@ -58,7 +58,8 @@
  <FrameLayout
  android:id="@+id/story_progress_container"
  android:layout_width="wrap_content"
- android:layout_height="wrap_content">
+ android:layout_height="wrap_content"
+ android:contentDescription="@{@string/topic_story_progress_percentage(storyPercentage)}">
 
  <org.oppia.android.app.customview.SegmentedCircularProgressView
  android:id="@+id/story_progress_view"
@@ -95,10 +96,12 @@
  android:orientation="horizontal">
 
  <LinearLayout
+ android:id="@+id/story_name_chapter_count_container"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_marginStart="20dp"
  android:layout_weight="1"
+ android:contentDescription="@{String.format(@string/chapter_count_with_story_name, @plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount), viewModel.storySummary.storyName)}"
  android:gravity="center_vertical"
  android:orientation="vertical">
 
@@ -119,6 +122,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:fontFamily="sans-serif"
+ android:importantForAccessibility="no"
  android:text="@{@plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount)}"
  android:textColor="@color/oppiaPrimaryText"
  android:textSize="16sp" />
@@ -137,7 +141,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal|bottom"
- android:contentDescription="@{@string/show_hide_chapter_list(viewModel.storySummary.storyName)}"
+ android:contentDescription="@{isListExpanded ? @string/hide_chapter_list : @string/show_chapter_list}"
  android:src="@drawable/ic_arrow_drop_down_black_24dp"
  app:isRotationAnimationClockwise="@{isListExpanded}"
  app:rotationAnimationAngle="@{180f}" />

diff --git a/app/src/main/res/layout-sw600dp-port/topic_lessons_story_summary.xml b/app/src/main/res/layout-sw600dp-port/topic_lessons_story_summary.xml
@@ -58,7 +58,8 @@
  <FrameLayout
  android:id="@+id/story_progress_container"
  android:layout_width="wrap_content"
- android:layout_height="wrap_content">
+ android:layout_height="wrap_content"
+ android:contentDescription="@{@string/topic_story_progress_percentage(storyPercentage)}">
 
  <org.oppia.android.app.customview.SegmentedCircularProgressView
  android:id="@+id/story_progress_view"
@@ -95,10 +96,12 @@
  android:orientation="horizontal">
 
  <LinearLayout
+ android:id="@+id/story_name_chapter_count_container"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_marginStart="12dp"
  android:layout_weight="1"
+ android:contentDescription="@{String.format(@string/chapter_count_with_story_name, @plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount), viewModel.storySummary.storyName)}"
  android:gravity="center_vertical"
  android:orientation="vertical">
 
@@ -119,6 +122,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:fontFamily="sans-serif"
+ android:importantForAccessibility="no"
  android:text="@{@plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount)}"
  android:textColor="@color/oppiaPrimaryText"
  android:textSize="16sp" />
@@ -137,7 +141,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal|bottom"
- android:contentDescription="@{@string/show_hide_chapter_list(viewModel.storySummary.storyName)}"
+ android:contentDescription="@{isListExpanded ? @string/hide_chapter_list : @string/show_chapter_list}"
  android:src="@drawable/ic_arrow_drop_down_black_24dp"
  app:isRotationAnimationClockwise="@{isListExpanded}"
  app:rotationAnimationAngle="@{180f}" />

diff --git a/app/src/main/res/layout/topic_lessons_story_summary.xml b/app/src/main/res/layout/topic_lessons_story_summary.xml
@@ -55,7 +55,8 @@
  <FrameLayout
  android:id="@+id/story_progress_container"
  android:layout_width="wrap_content"
- android:layout_height="wrap_content">
+ android:layout_height="wrap_content"
+ android:contentDescription="@{@string/topic_story_progress_percentage(storyPercentage)}">
 
  <org.oppia.android.app.customview.SegmentedCircularProgressView
  android:id="@+id/story_progress_view"
@@ -92,10 +93,12 @@
  android:orientation="horizontal">
 
  <LinearLayout
+ android:id="@+id/story_name_chapter_count_container"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_marginStart="12dp"
  android:layout_weight="1"
+ android:contentDescription="@{String.format(@string/chapter_count_with_story_name, @plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount), viewModel.storySummary.storyName)}"
  android:gravity="center_vertical"
  android:orientation="vertical">
 
@@ -116,6 +119,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:fontFamily="sans-serif"
+ android:importantForAccessibility="no"
  android:text="@{@plurals/chapter_count(viewModel.storySummary.chapterCount, viewModel.storySummary.chapterCount)}"
  android:textColor="@color/oppiaPrimaryText"
  android:textSize="16sp" />
@@ -134,7 +138,7 @@
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal|bottom"
- android:contentDescription="@{@string/show_hide_chapter_list(viewModel.storySummary.storyName)}"
+ android:contentDescription="@{isListExpanded ? @string/hide_chapter_list : @string/show_chapter_list}"
  android:src="@drawable/ic_arrow_drop_down_black_24dp"
  app:isRotationAnimationClockwise="@{isListExpanded}"
  app:rotationAnimationAngle="@{180f}" />

diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -99,7 +99,8 @@
  <string name="question_training_session_finished_message">You have finished all of the questions! You can choose to play another set of questions, or return to the topic.</string>
  <string name="status_in_progress">In Progress</string>
  <string name="status_completed">Completed</string>
- <string name="show_hide_chapter_list">Show/Hide chapter list of %s</string>
+ <string name="show_chapter_list">Show chapter list</string>
+ <string name="hide_chapter_list">Hide chapter list</string>
  <string name="play_pause_audio">Play/Pause Audio</string>
  <string name="preferences">Preferences</string>
  <string name="profile_progress_activity_title">Profile Progress Page</string>
@@ -134,6 +135,7 @@
  <string name="correct">Correct!</string>
  <string name="topic_prefix">Topic: %s</string>
  <string name="welcome_profile_name">%s!</string>
+ <string name="chapter_count_with_story_name">%1$s in %2$s</string>
  <plurals name="chapter_count">
  <item quantity="one">
  1 Chapter

diff --git a/app/src/sharedTest/java/org/oppia/android/app/topic/lessons/TopicLessonsFragmentTest.kt b/app/src/sharedTest/java/org/oppia/android/app/topic/lessons/TopicLessonsFragmentTest.kt
@@ -21,6 +21,7 @@ import androidx.test.espresso.matcher.ViewMatchers.hasDescendant
 import androidx.test.espresso.matcher.ViewMatchers.isDescendantOfA
 import androidx.test.espresso.matcher.ViewMatchers.isDisplayed
 import androidx.test.espresso.matcher.ViewMatchers.isRoot
+import androidx.test.espresso.matcher.ViewMatchers.withContentDescription
 import androidx.test.espresso.matcher.ViewMatchers.withId
 import androidx.test.espresso.matcher.ViewMatchers.withText
 import androidx.test.ext.junit.runners.AndroidJUnit4
@@ -74,6 +75,7 @@ import org.oppia.android.domain.oppialogger.loguploader.LogUploadWorkerModule
 import org.oppia.android.domain.oppialogger.loguploader.WorkManagerConfigurationModule
 import org.oppia.android.domain.platformparameter.PlatformParameterModule
 import org.oppia.android.domain.question.QuestionModule
+import org.oppia.android.domain.topic.FRACTIONS_TOPIC_ID
 import org.oppia.android.domain.topic.PrimeTopicAssetsControllerModule
 import org.oppia.android.domain.topic.RATIOS_EXPLORATION_ID_0
 import org.oppia.android.domain.topic.RATIOS_STORY_ID_0
@@ -174,6 +176,37 @@ class TopicLessonsFragmentTest {
  }
  }
 
+ @Test
+ fun testLessonsPlayFragment_loadRatiosTopic_completeStoryProgress_contentDescriptionIsCorrect() {
+ storyProgressTestHelper.markCompletedRatiosStory0(
+ profileId,
+ timestampOlderThanOneWeek = false
+ )
+ launch<TopicActivity>(createTopicActivityIntent(internalProfileId, RATIOS_TOPIC_ID)).use {
+ clickLessonTab()
+ verifyProgressContentDescriptionAtPosition(itemPosition = 1, stringToMatch = "100%")
+ }
+ }
+
+ @Test
+ fun testLessonsPlayFragment_loadRatiosTopic_noStoryProgress_contentDescriptionIsCorrect() {
+ launch<TopicActivity>(createTopicActivityIntent(internalProfileId, RATIOS_TOPIC_ID)).use {
+ clickLessonTab()
+ verifyProgressContentDescriptionAtPosition(itemPosition = 1, stringToMatch = "0%")
+ }
+ }
+
+ @Test
+ fun testLessonsPlayFragment_loadFractionsTopic_storyChapterTextsContentDescriptionIsCorrect() {
+ launch<TopicActivity>(createTopicActivityIntent(internalProfileId, FRACTIONS_TOPIC_ID)).use {
+ clickLessonTab()
+ verifyStoryAndChapterCountContentDescriptionAtPosition(
+ itemPosition = 1,
+ stringToMatch = "2 Chapters in Matthew Goes to the Bakery"
+ )
+ }
+ }
+
  @Test
  fun testLessonsPlayFragment_loadRatiosTopic_partialStoryProgress_isDisplayed() {
  storyProgressTestHelper.markCompletedRatiosStory0Exp0(
@@ -421,6 +454,29 @@ class TopicLessonsFragmentTest {
  ).check(matches(hasDescendant(withText(containsString(stringToMatch)))))
  }
 
+ private fun verifyProgressContentDescriptionAtPosition(itemPosition: Int, stringToMatch: String) {
+ onView(
+ atPositionOnView(
+ recyclerViewId = R.id.story_summary_recycler_view,
+ position = itemPosition,
+ targetViewId = R.id.story_progress_container
+ )
+ ).check(matches(withContentDescription(stringToMatch)))
+ }
+
+ private fun verifyStoryAndChapterCountContentDescriptionAtPosition(
+ itemPosition: Int,
+ stringToMatch: String
+ ) {
+ onView(
+ atPositionOnView(
+ recyclerViewId = R.id.story_summary_recycler_view,
+ position = itemPosition,
+ targetViewId = R.id.story_name_chapter_count_container
+ )
+ ).check(matches(withContentDescription(stringToMatch)))
+ }
+
  // TODO(#59): Figure out a way to reuse modules instead of needing to re-declare them.
  @Singleton
  @Component(