https://kotlinlang.org logo
#compose
Title
# compose
r

Rene Win

05/19/2022, 9:01 AM
Hello, i have an issue with screen reader and jetpack compose: When I'm using Modifier.testTags the screen reader order is not correct (detail3 is marked instead of detail1) when navigating to a other screen - see code and video below: Some notes on the code (I can provide the whole application if necessary): Home is the root view with just some text and a button, which opens the detail composable
Copy code
@Composable
fun Home(navController: NavController) {
    Column(
        modifier = Modifier.testTag("hometag")
    ) {
        Text("home1")
        Text("home2")
        Button(onClick = {
            navController.navigate("detail",
            )
        }) {
            Text("NEXT")
        }

    }
}

@Composable
fun Detail(navController: NavController) {
    Column(
        modifier = Modifier
            .testTag("detailTag")
    ) {
        Text("detail1")
        Text("detail2")
        Text("detail3")
    }
}
Is there something I can do against that behaviour? Thanks in advance!
j

Jelle Fresen [G]

05/19/2022, 1:52 PM
In the recording I see the a11y focus jump from "home1" to the "next" button. Is that the unexpected order?
r

Rene Win

05/20/2022, 5:26 AM
the focus from home1 to next was a manual input. the issue is on the next screen, where detail3 is focussed instead of the first one
@Jelle Fresen [G] maybe i have not described perfectly. but the problem is resolved when I remove the testTags. Then the "detail1" in the second screen gets focussed correctly
z

Zach Klippenstein (he/him) [MOD]

05/24/2022, 4:11 PM
This definitely seems like a bug, although I'm not sure where. Can you file a bug with this code and the details you mentioned in the thread?
r

Rene Win

05/25/2022, 6:42 AM
@Zach Klippenstein (he/him) [MOD] did it already 🙂 https://issuetracker.google.com/issues/233251832
z

Zach Klippenstein (he/him) [MOD]

05/25/2022, 3:08 PM
Thanks. Just to confirm, you're observing this in compose 1.1? Have you tried the latest version?
r

Rene Win

05/30/2022, 3:54 AM
i tried with compose 1.1.1, yes
z

Zach Klippenstein (he/him) [MOD]

05/30/2022, 5:50 PM
Have you tried with 1.2?
r

Rene Win

05/31/2022, 4:04 AM
yes, just now. result in my minified dummy application -> the issue is gone. result in my real application -> the issue is still here. so i will try to create another minified version of the problem with compose 1.2
🙏🏻 1
new day new try -> when i change the code to :
Copy code
@Composable
fun Home(navController: NavController) {
    Column(
        modifier = Modifier
            .testTag("hometag")
    ) {
        Text("home1")
        Text("home2")
        Button(onClick = {
            navController.navigate(
                "detail"
            )
        }) {
            Text("NEXT")
        }

    }
}

@Composable
fun Detail() {
    Column(
        modifier = Modifier
            .testTag("detailTag")
    ) {
        Text("detail1")
        Text("detail2")
        Button(onClick = { /*TODO*/ }) {

            Text("detail3")
        }
    }
}
then the screen reader is again on the wrong element. (even with compose 1.2.0-beta02) the only thing i changed is wrapping the Text("detail3") in a button, so the structure is the same as in the screen before.
i have updated the issue in google issue tracker also 😉
🙏🏻 1
@Zach Klippenstein (he/him) [MOD] as this (on my point of view) randomly changes for every compose version - is there any chance to unit test the accessablity stuff so that we can ensure we dont break something when upgrading compose?
3 Views