diff --git a/NEWS.md b/NEWS.md index 120dd60cb..02932cad8 100644 --- a/NEWS.md +++ b/NEWS.md @@ -18,6 +18,10 @@ * Added an aria-controls attribute when using bslib::page_navbar() with bslib::nav_panel() to establish an explicit relationship between the tab and the controlled tab panel. (@shelbylevel, #1354) +* `page_navbar()` now wraps the top navigation bar in a `
` element, giving the page a banner landmark that screen readers can navigate to. + +* `page_navbar()` now renders its content area as a `
` element, giving the page a main landmark. (Pages with a `sidebar` already had one, via `page_main_container()`.) + # bslib 0.12.0 ## New features diff --git a/R/page.R b/R/page.R index 7ecc6cd4b..5385d2848 100644 --- a/R/page.R +++ b/R/page.R @@ -469,6 +469,21 @@ page_navbar <- function( theme = theme ) + # Wrap the navbar in a
to give the page a banner landmark. + # This happens here, rather than in navs_bar_(), because navset_bar() + # (which shares that code) can appear anywhere on a page, where a + # banner landmark would be inappropriate. + navbar[[1]] <- tags$header(navbar[[1]]) + + # Give the content area a
landmark. When a sidebar is present, the + # content area already contains a
(via page_main_container()), so + # only change the content container's tag in the sidebar-less case. Done + # in-place (rather than wrapping) so the container remains a direct child + # of the page's fill container. + if (is.null(sidebar)) { + navbar[[2]]$name <- "main" + } + page_func( title = infer_window_title(title, window_title), theme = theme, diff --git a/R/sysdata.rda b/R/sysdata.rda index 4b2c69896..e50fd0064 100644 Binary files a/R/sysdata.rda and b/R/sysdata.rda differ diff --git a/man/figures/page-navbar.png b/man/figures/page-navbar.png index 054786ccd..9e7c8f03d 100644 Binary files a/man/figures/page-navbar.png and b/man/figures/page-navbar.png differ diff --git a/tests/testthat/test-page.R b/tests/testthat/test-page.R index 9c251f058..c4917c451 100644 --- a/tests/testthat/test-page.R +++ b/tests/testthat/test-page.R @@ -33,6 +33,61 @@ test_that("page_navbar()", { ) }) +test_that("page_navbar() wraps the navbar in a
banner landmark", { + skip_if_not_installed("shiny") + with_private_seed() + + html <- renderTags(page_navbar( + title = "foo", + nav_panel("One", "content") + ))$html + expect_match( + as.character(html), + "
\\s*