Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Accessibility] shiny::icons() are not accessible to screen readers #3675

Open
jooyoungseo opened this issue Jul 25, 2022 · 2 comments
Open

Comments

@jooyoungseo
Copy link

jooyoungseo commented Jul 25, 2022

In the following example (retrieved from example(checkboxGroupInput, package = "shiny")), icons are used for informative purpose. However, the checkbox
is not accessible for screen readers until explicit aria-label is used by content creator because this does not provide any icon alt text by default. It
would be more desirable and safer if the aria-label is provided by default equal to font name and allow content creators to override that value if necessary.

library(shiny)

ui <- fluidPage(
  checkboxGroupInput("icons", "Choose icons:",
    choiceNames =
      list(icon("calendar"), icon("bed"),
           icon("cog"), icon("bug")),
    choiceValues =
      list("calendar", "bed", "cog", "bug")
  ),
  textOutput("txt")
)


server <- function(input, output, session) {
  output$txt <- renderText({
    icons <- paste(input$icons, collapse = ", ")
    paste("You chose", icons)
  })
}

shinyApp(ui, server)

CC @rich-iannone

Related discussion: quarto-ext/fontawesome#8

@cpsievert
Copy link
Collaborator

FWIW you can use fontawesome::fa() directly (instead of icon()) which makes it easier to implement accessible icons

@ms609
Copy link

ms609 commented Aug 26, 2022

@cpsievert I tried dropping fontawesome::fa() in place of icon() into

actionButton("go", "Search", icon = fontawesome::fa("magnifying-glass"))

but I see

Error in validateIcon(icon) : 
  Invalid icon. Use Shiny's 'icon()' function to generate a valid icon

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants