Common Screen Reader Incompatibility in Marketplace Apps: Causes and Fixes

2️⃣ Silent price updates

priceTextView.text = newPrice
priceTextView.announceForAccessibility("Price updated to $newPrice")

*For iOS, use UIAccessibility.post(notification: .announcement, argument: "Price updated to $newPrice").*

3️⃣ Wishlist icon reads “image”

<!-- Android XML -->
<ImageButton
    android:id="@+id/btn_wishlist"
    android:src="@drawable/ic_heart"
    android:contentDescription="@string/add_to_wishlist"
    android:importantForAccessibility="yes"/>

*If using React Native: .*

4️⃣ Checkout focus trap

// When opening the payment modal
paymentDialog.setOnShowListener {
    // Move focus to first input
    cardNumberEditText.requestFocus()
    // Optionally announce
    it.context.getSystemService(AccessibilityManager::class.java)
        .sendAccessibilityEvent(AccessibilityEvent.TYPE_WINDOW_STATE_CHANGED)
}

*On the web, add autofocus to the first field and aria-modal="true" to the dialog.*

5️⃣ Search results list lacks role

<!-- Replace LinearLayout with RecyclerView -->
<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/search_results"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:importantForAccessibility="yes"/>

*Add role="list" and each child role="listitem" in HTML.*

6️⃣ Invisible error messages

errorTextView.apply {
    text = "Invalid coupon code"
    visibility = View.VISIBLE
    // Make screen reader read it
    accessibilityLiveRegion = View.ACCESSIBILITY_LIVE_REGION_POLITE
}

*Web:

7️⃣ Small promo‑code button

<Button
    android:id="@+id/btn_copy_code"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:minWidth="48dp"
    android:minHeight="48dp"
    android:text="Copy"
    android:contentDescription="Copy promo code"/>

*If design constraints force a smaller visual, increase the touchable area with android:padding while keeping the icon size small.*

---

6. Prevention: catch screen‑reader incompatibility before release

1. Embed SUSA into CI/CD

• Add pip install susatest-agent to your pipeline.
• Run susa run --apk path/to/app.apk --ci on every PR.
• Fail the build if any WCAG 2.1 AA violation appears for the “accessibility” persona.

1. Shift‑left linting

• Enforce androidx.accessibility:accessibility-lint in Gradle (check.dependsOn lint).
• Treat missing contentDescription warnings as errors.

1. Component library audit

• Keep a shared UI component catalog (e.g., Material‑UI, Jetpack Compose).
• Tag each component with an accessibility checklist; run SUSA’s coverage analytics to ensure every screen uses only vetted components.

1. Automated regression script generation

• After each successful SUSA run, export the generated Appium (Android) and Playwright (Web) scripts.
• Run these scripts nightly against a fresh build; any new failure in a flow (login → search → checkout) flags a regression.

1. Persona‑based exploratory testing

• Schedule a quarterly manual session with real users representing the ten SUSA personas (especially “elderly”, “novice”, and “accessibility”).
• Record observations and feed them back into SUSA’s cross‑session learning so future runs become smarter about your app’s quirks.

1. Documentation and code review guardrails

• Add a checklist item to every pull‑request template: “All new UI elements have accessible labels and live‑region announcements.”
• Require at least one reviewer to verify the checklist before merge.

By integrating SUSA’s autonomous testing, leveraging its persona‑driven reports, and enforcing strict lint and review policies, marketplace teams can eliminate screen‑reader incompatibility early, protect user experience, and avoid the costly downstream effects of poor accessibility.