From 20326e4929cecd65036a7801298f81c5ddd289c7 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:46:42 -0600 Subject: [PATCH 1/9] =?UTF-8?q?Fix=20=E2=80=9Cmain=E2=80=9D=20role?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/render/tpl.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/core/render/tpl.js b/src/core/render/tpl.js index 424ffe88f..4f1fcb1f3 100644 --- a/src/core/render/tpl.js +++ b/src/core/render/tpl.js @@ -57,9 +57,9 @@ export function main(config) { `; return /* html */ ` -
${aside} +
${aside}
-
+
`; From d0bd0aa441982baa1fac591a8545b7623f014f93 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:49:00 -0600 Subject: [PATCH 2/9] Fix primary navigation role and aria label --- src/core/render/tpl.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/core/render/tpl.js b/src/core/render/tpl.js index 4f1fcb1f3..ce9ffa7e3 100644 --- a/src/core/render/tpl.js +++ b/src/core/render/tpl.js @@ -42,7 +42,7 @@ export function main(config) { -
+
${ config.name ? /* html */ ` @@ -52,7 +52,7 @@ export function main(config) { ` : '' } -
+
`; From e8e688dafcbb6bcd6f06151d3369bb74c5415195 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:51:48 -0600 Subject: [PATCH 3/9] Fix secondary navigation aria label --- src/core/render/index.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/core/render/index.js b/src/core/render/index.js index 2ee9755be..308eab1e4 100644 --- a/src/core/render/index.js +++ b/src/core/render/index.js @@ -416,6 +416,8 @@ export function Render(Base) { let navAppendToTarget = dom.body; if (el) { + navEl.setAttribute('aria-label', 'secondary'); + if (config.repo) { html += tpl.corner(config.repo, config.cornerExternalLinkTarget); } From 18e7f7bc7e53b82241c201397b69d5110f7520b7 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:52:38 -0600 Subject: [PATCH 4/9] Fix progress bar role and aria labels --- src/core/render/progressbar.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/core/render/progressbar.js b/src/core/render/progressbar.js index 613de9285..29d0dfe79 100644 --- a/src/core/render/progressbar.js +++ b/src/core/render/progressbar.js @@ -10,6 +10,10 @@ function init() { const div = dom.create('div'); div.classList.add('progress'); + div.setAttribute('role', 'progressbar'); + div.setAttribute('aria-valuemin', '0'); + div.setAttribute('aria-valuemax', '100'); + div.setAttribute('aria-label', 'Loading...'); dom.appendTo(dom.body, div); barEl = div; } @@ -33,6 +37,7 @@ export default function (info) { barEl.style.opacity = 1; barEl.style.width = num >= 95 ? '100%' : num + '%'; + barEl.setAttribute('aria-valuenow', num >= 95 ? 100 : num); if (num >= 95) { clearTimeout(timeId); @@ -40,6 +45,7 @@ export default function (info) { timeId = setTimeout(_ => { barEl.style.opacity = 0; barEl.style.width = '0%'; + barEl.removeAttribute('aria-valuenow'); }, 200); } } From 255127c1dbaf44955d23115c9e09c53a06c84f9f Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:53:03 -0600 Subject: [PATCH 5/9] Fix cover page role and aria label --- src/core/render/tpl.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/render/tpl.js b/src/core/render/tpl.js index ce9ffa7e3..622d22a8a 100644 --- a/src/core/render/tpl.js +++ b/src/core/render/tpl.js @@ -80,7 +80,7 @@ export function cover() { `; return /* html */ ` -
+
From 1657adc4d81bbe799ef1203e71585cae775a48b7 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:56:22 -0600 Subject: [PATCH 6/9] Fix search role --- src/plugins/search/component.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/plugins/search/component.js b/src/plugins/search/component.js index 35a99115d..a95ba49b4 100644 --- a/src/plugins/search/component.js +++ b/src/plugins/search/component.js @@ -128,6 +128,7 @@ function tpl(defaultValue = '') { const aside = Docsify.dom.find('aside'); Docsify.dom.toggleClass(el, 'search'); + el.setAttribute('role', 'search'); Docsify.dom.before(aside, el); } From 7387f91e173385c5ba151ecb32f7d3aeb3c520fa Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:57:59 -0600 Subject: [PATCH 7/9] Fix search results aria labels --- src/plugins/search/component.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/plugins/search/component.js b/src/plugins/search/component.js index a95ba49b4..685b75c1f 100644 --- a/src/plugins/search/component.js +++ b/src/plugins/search/component.js @@ -152,12 +152,12 @@ function doSearch(value) { return; } - const matchs = search(value); + const matches = search(value); let html = ''; - matchs.forEach(post => { + matches.forEach((post, i) => { html += /* html */ ` -
+

${post.title}

${post.content}

From 34cb4e29a3a4cf4826f0c5adb8e237d427b7241e Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 15:58:53 -0600 Subject: [PATCH 8/9] Add search results status element --- src/plugins/search/component.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/plugins/search/component.js b/src/plugins/search/component.js index 685b75c1f..c3d7a678b 100644 --- a/src/plugins/search/component.js +++ b/src/plugins/search/component.js @@ -21,6 +21,11 @@ function style() { align-items: center; } +.search .results-status:not(:empty) { + margin-top: 10px; + font-size: smaller; +} + .search .results-panel { display: none; } @@ -122,6 +127,7 @@ function tpl(defaultValue = '') {
+
`; const el = Docsify.dom.create('div', html); @@ -137,12 +143,14 @@ function doSearch(value) { const $panel = Docsify.dom.find($search, '.results-panel'); const $clearBtn = Docsify.dom.find($search, '.clear-button'); const $sidebarNav = Docsify.dom.find('.sidebar-nav'); + const $status = Docsify.dom.find('div.search .results-status'); const $appName = Docsify.dom.find('.app-name'); if (!value) { $panel.classList.remove('show'); $clearBtn.classList.remove('show'); $panel.innerHTML = ''; + $status.textContent = ''; if (options.hideOtherSidebarContent) { $sidebarNav && $sidebarNav.classList.remove('hide'); @@ -169,6 +177,8 @@ function doSearch(value) { $panel.classList.add('show'); $clearBtn.classList.add('show'); $panel.innerHTML = html || /* html */ `

${NO_DATA_TEXT}

`; + $status.textContent = `Found ${matches.length} results`; + if (options.hideOtherSidebarContent) { $sidebarNav && $sidebarNav.classList.add('hide'); $appName && $appName.classList.add('hide'); From 5b1ab11ae04c1919b55f9880952547dea7dec6a9 Mon Sep 17 00:00:00 2001 From: John Hildenbiddle Date: Wed, 15 Nov 2023 16:56:14 -0600 Subject: [PATCH 9/9] Update snapshots with new roles and aria labels --- test/integration/__snapshots__/docs.test.js.snap | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/test/integration/__snapshots__/docs.test.js.snap b/test/integration/__snapshots__/docs.test.js.snap index 2e620b9dd..06354402e 100644 --- a/test/integration/__snapshots__/docs.test.js.snap +++ b/test/integration/__snapshots__/docs.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Docs Site coverpage renders and is unchanged 1`] = ` -"
" `; -exports[`Docs Site navbar renders and is unchanged 1`] = `"
  • Translations
    • \\"uk\\" English
    • \\"cn\\" 简体中文
    • \\"de\\" Deutsch
    • \\"es\\" Español
    • \\"ru\\" Русский
"`; +exports[`Docs Site navbar renders and is unchanged 1`] = `"
  • Translations
    • \\"uk\\" English
    • \\"cn\\" 简体中文
    • \\"de\\" Deutsch
    • \\"es\\" Español
    • \\"ru\\" Русский
"`; exports[`Docs Site sidebar renders and is unchanged 1`] = ` -"
+"
-

  • Getting started

    • Quick start
    • Writing more pages
    • Custom navbar
    • Cover page

  • Customization

    • Configuration
    • Themes
    • List of Plugins
    • Write a Plugin
    • Markdown configuration
    • Language highlighting
    • Emoji

  • Guide

    • Deploy
    • Helpers
    • Vue compatibility
    • CDN
    • Offline Mode (PWA)
    • Embed Files

  • Awesome docsify

  • Changelog

+

  • Getting started

    • Quick start
    • Writing more pages
    • Custom navbar
    • Cover page

  • Customization

    • Configuration
    • Themes
    • List of Plugins
    • Write a Plugin
    • Markdown configuration
    • Language highlighting
    • Emoji

  • Guide

    • Deploy
    • Helpers
    • Vue compatibility
    • CDN
    • Offline Mode (PWA)
    • Embed Files

  • Awesome docsify

  • Changelog

" `;