#31 fix(web): ARIA semantics for MR panels, dialogs, palette, forms and status regions
A internal/adapters/web/accessibility_test.go +53 -0
M internal/adapters/web/fragments.templ +1 -0
M internal/adapters/web/fragments_templ.go +2 -2
M internal/adapters/web/issues_form.templ +47 -9
M internal/adapters/web/issues_form_templ.go +161 -84
M internal/adapters/web/issues_form_test.go +2 -2
M internal/adapters/web/jstest/a11y.test.mjs +79 -1
M internal/adapters/web/jstest/finder.test.mjs +9 -8
M internal/adapters/web/jstest/mr.test.mjs +33 -1
M internal/adapters/web/mr.templ +9 -9
M internal/adapters/web/mr_templ.go +7 -7
M internal/adapters/web/mr_test.go +8 -7
M internal/adapters/web/overlays.templ +5 -5
M internal/adapters/web/overlays_templ.go +35 -12
M internal/adapters/web/shell.templ +4 -4
M internal/adapters/web/shell_templ.go +1 -1
M internal/adapters/web/static/css/20-shell.css +2 -1
M internal/adapters/web/static/css/60-mr.css +5 -8
M internal/adapters/web/static/css/85-mobile.css +1 -1
M internal/adapters/web/static/js/ermite.js +15 -0
M internal/adapters/web/static/js/files.js +4 -3
M internal/adapters/web/static/js/mr.js +3 -3
M internal/adapters/web/tree.templ +1 -1
M internal/adapters/web/tree_templ.go +1 -1
M internal/app/testdata/web/blob-binary.html +19 -17
M internal/app/testdata/web/blob-code.html +19 -17
| @@ -211,18 +211,20 @@ | |||
| 211 | 211 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 212 | 212 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 213 | 213 | </footer> | |
| 214 | - | <div class="hint" role="status" aria-live="polite"> | |
| 215 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 214 | + | <div class="hint"> | |
| 215 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 216 | 216 | </span> | |
| 217 | + | <span role="status" aria-live="polite"> | |
| 217 | 218 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 218 | 219 | </span> | |
| 219 | 220 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 220 | 221 | </span> | |
| 222 | + | </span> | |
| 221 | 223 | </div> | |
| 222 | 224 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 223 | 225 | <div class="panel-head"> | |
| 224 | 226 | <h2>Keyboard shortcuts</h2> | |
| 225 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 227 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 226 | 228 | <kbd>esc</kbd> close</button> | |
| 227 | 229 | </div> | |
| 228 | 230 | <div class="keys-pref"> | |
| @@ -356,7 +358,7 @@ | |||
| 356 | 358 | <div class="panel-head"> | |
| 357 | 359 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 358 | 360 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 359 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 361 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 360 | 362 | <kbd>esc</kbd> | |
| 361 | 363 | </button> | |
| 362 | 364 | </div> | |
| @@ -391,79 +393,79 @@ | |||
| 391 | 393 | <div class="panel-head"> | |
| 392 | 394 | <label for="cmd-q" class="sr">go to</label> | |
| 393 | 395 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 394 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 396 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 395 | 397 | <kbd>esc</kbd> | |
| 396 | 398 | </button> | |
| 397 | 399 | </div> | |
| 398 | 400 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 399 | 401 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 400 | - | <a href="/" tabindex="-1"> | |
| 402 | + | <a role="presentation" data-href="/"> | |
| 401 | 403 | <span class="lbl">home</span> | |
| 402 | 404 | <span class="k">go</span> | |
| 403 | 405 | </a> | |
| 404 | 406 | </li> | |
| 405 | 407 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 406 | - | <a href="/files" tabindex="-1"> | |
| 408 | + | <a role="presentation" data-href="/files"> | |
| 407 | 409 | <span class="lbl">summary</span> | |
| 408 | 410 | <span class="k">section</span> | |
| 409 | 411 | </a> | |
| 410 | 412 | </li> | |
| 411 | 413 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 412 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 414 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 413 | 415 | <span class="lbl">files</span> | |
| 414 | 416 | <span class="k">section</span> | |
| 415 | 417 | </a> | |
| 416 | 418 | </li> | |
| 417 | 419 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 418 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 420 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 419 | 421 | <span class="lbl">commits</span> | |
| 420 | 422 | <span class="k">section</span> | |
| 421 | 423 | </a> | |
| 422 | 424 | </li> | |
| 423 | 425 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 424 | - | <a href="/files/refs" tabindex="-1"> | |
| 426 | + | <a role="presentation" data-href="/files/refs"> | |
| 425 | 427 | <span class="lbl">branches & tags</span> | |
| 426 | 428 | <span class="k">section</span> | |
| 427 | 429 | </a> | |
| 428 | 430 | </li> | |
| 429 | 431 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 430 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 432 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 431 | 433 | <span class="lbl">merge requests</span> | |
| 432 | 434 | <span class="k">section</span> | |
| 433 | 435 | </a> | |
| 434 | 436 | </li> | |
| 435 | 437 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 436 | - | <a href="/files/releases" tabindex="-1"> | |
| 438 | + | <a role="presentation" data-href="/files/releases"> | |
| 437 | 439 | <span class="lbl">releases</span> | |
| 438 | 440 | <span class="k">section</span> | |
| 439 | 441 | </a> | |
| 440 | 442 | </li> | |
| 441 | 443 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 442 | - | <a href="/files/actions" tabindex="-1"> | |
| 444 | + | <a role="presentation" data-href="/files/actions"> | |
| 443 | 445 | <span class="lbl">actions</span> | |
| 444 | 446 | <span class="k">section</span> | |
| 445 | 447 | </a> | |
| 446 | 448 | </li> | |
| 447 | 449 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 448 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 450 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 449 | 451 | <span class="lbl">feature/x</span> | |
| 450 | 452 | <span class="k">branch</span> | |
| 451 | 453 | </a> | |
| 452 | 454 | </li> | |
| 453 | 455 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 454 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 456 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 455 | 457 | <span class="lbl">main</span> | |
| 456 | 458 | <span class="k">branch</span> | |
| 457 | 459 | </a> | |
| 458 | 460 | </li> | |
| 459 | 461 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 460 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 462 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 461 | 463 | <span class="lbl">v1.0</span> | |
| 462 | 464 | <span class="k">tag</span> | |
| 463 | 465 | </a> | |
| 464 | 466 | </li> | |
| 465 | 467 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 466 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 468 | + | <a role="presentation" data-fire="keys"> | |
| 467 | 469 | <span class="lbl">turn single-key shortcuts off</span> | |
| 468 | 470 | <span class="k">action</span> | |
| 469 | 471 | </a> | |
| @@ -211,18 +211,20 @@ | |||||
| 211 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 211 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 212 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 212 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 213 | </footer> | 213 | </footer> | ||
| 214 | - | <div class="hint" role="status" aria-live="polite"> | 214 | + | <div class="hint"> |
| 215 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 215 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 216 | </span> | 216 | </span> | ||
| 217 | + | <span role="status" aria-live="polite"> | |||
| 217 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 218 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 218 | </span> | 219 | </span> | ||
| 219 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 220 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 220 | </span> | 221 | </span> | ||
| 222 | + | </span> | |||
| 221 | </div> | 223 | </div> | ||
| 222 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 224 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 223 | <div class="panel-head"> | 225 | <div class="panel-head"> | ||
| 224 | <h2>Keyboard shortcuts</h2> | 226 | <h2>Keyboard shortcuts</h2> | ||
| 225 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 227 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 226 | <kbd>esc</kbd> close</button> | 228 | <kbd>esc</kbd> close</button> | ||
| 227 | </div> | 229 | </div> | ||
| 228 | <div class="keys-pref"> | 230 | <div class="keys-pref"> | ||
| @@ -356,7 +358,7 @@ | |||||
| 356 | <div class="panel-head"> | 358 | <div class="panel-head"> | ||
| 357 | <label for="refs-filter" class="sr">filter branches and tags</label> | 359 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 358 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 360 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 359 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 361 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 360 | <kbd>esc</kbd> | 362 | <kbd>esc</kbd> | ||
| 361 | </button> | 363 | </button> | ||
| 362 | </div> | 364 | </div> | ||
| @@ -391,79 +393,79 @@ | |||||
| 391 | <div class="panel-head"> | 393 | <div class="panel-head"> | ||
| 392 | <label for="cmd-q" class="sr">go to</label> | 394 | <label for="cmd-q" class="sr">go to</label> | ||
| 393 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 395 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 394 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 396 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 395 | <kbd>esc</kbd> | 397 | <kbd>esc</kbd> | ||
| 396 | </button> | 398 | </button> | ||
| 397 | </div> | 399 | </div> | ||
| 398 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 400 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 399 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 401 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 400 | - | <a href="/" tabindex="-1"> | 402 | + | <a role="presentation" data-href="/"> |
| 401 | <span class="lbl">home</span> | 403 | <span class="lbl">home</span> | ||
| 402 | <span class="k">go</span> | 404 | <span class="k">go</span> | ||
| 403 | </a> | 405 | </a> | ||
| 404 | </li> | 406 | </li> | ||
| 405 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 407 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 406 | - | <a href="/files" tabindex="-1"> | 408 | + | <a role="presentation" data-href="/files"> |
| 407 | <span class="lbl">summary</span> | 409 | <span class="lbl">summary</span> | ||
| 408 | <span class="k">section</span> | 410 | <span class="k">section</span> | ||
| 409 | </a> | 411 | </a> | ||
| 410 | </li> | 412 | </li> | ||
| 411 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 413 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 412 | - | <a href="/files/tree/main" tabindex="-1"> | 414 | + | <a role="presentation" data-href="/files/tree/main"> |
| 413 | <span class="lbl">files</span> | 415 | <span class="lbl">files</span> | ||
| 414 | <span class="k">section</span> | 416 | <span class="k">section</span> | ||
| 415 | </a> | 417 | </a> | ||
| 416 | </li> | 418 | </li> | ||
| 417 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 419 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 418 | - | <a href="/files/commits/main" tabindex="-1"> | 420 | + | <a role="presentation" data-href="/files/commits/main"> |
| 419 | <span class="lbl">commits</span> | 421 | <span class="lbl">commits</span> | ||
| 420 | <span class="k">section</span> | 422 | <span class="k">section</span> | ||
| 421 | </a> | 423 | </a> | ||
| 422 | </li> | 424 | </li> | ||
| 423 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 425 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 424 | - | <a href="/files/refs" tabindex="-1"> | 426 | + | <a role="presentation" data-href="/files/refs"> |
| 425 | <span class="lbl">branches & tags</span> | 427 | <span class="lbl">branches & tags</span> | ||
| 426 | <span class="k">section</span> | 428 | <span class="k">section</span> | ||
| 427 | </a> | 429 | </a> | ||
| 428 | </li> | 430 | </li> | ||
| 429 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 431 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 430 | - | <a href="/files/merge-requests" tabindex="-1"> | 432 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 431 | <span class="lbl">merge requests</span> | 433 | <span class="lbl">merge requests</span> | ||
| 432 | <span class="k">section</span> | 434 | <span class="k">section</span> | ||
| 433 | </a> | 435 | </a> | ||
| 434 | </li> | 436 | </li> | ||
| 435 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 437 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 436 | - | <a href="/files/releases" tabindex="-1"> | 438 | + | <a role="presentation" data-href="/files/releases"> |
| 437 | <span class="lbl">releases</span> | 439 | <span class="lbl">releases</span> | ||
| 438 | <span class="k">section</span> | 440 | <span class="k">section</span> | ||
| 439 | </a> | 441 | </a> | ||
| 440 | </li> | 442 | </li> | ||
| 441 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 443 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 442 | - | <a href="/files/actions" tabindex="-1"> | 444 | + | <a role="presentation" data-href="/files/actions"> |
| 443 | <span class="lbl">actions</span> | 445 | <span class="lbl">actions</span> | ||
| 444 | <span class="k">section</span> | 446 | <span class="k">section</span> | ||
| 445 | </a> | 447 | </a> | ||
| 446 | </li> | 448 | </li> | ||
| 447 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 449 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 448 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 450 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 449 | <span class="lbl">feature/x</span> | 451 | <span class="lbl">feature/x</span> | ||
| 450 | <span class="k">branch</span> | 452 | <span class="k">branch</span> | ||
| 451 | </a> | 453 | </a> | ||
| 452 | </li> | 454 | </li> | ||
| 453 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 455 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 454 | - | <a href="/files/tree/main" tabindex="-1"> | 456 | + | <a role="presentation" data-href="/files/tree/main"> |
| 455 | <span class="lbl">main</span> | 457 | <span class="lbl">main</span> | ||
| 456 | <span class="k">branch</span> | 458 | <span class="k">branch</span> | ||
| 457 | </a> | 459 | </a> | ||
| 458 | </li> | 460 | </li> | ||
| 459 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 461 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 460 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 462 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 461 | <span class="lbl">v1.0</span> | 463 | <span class="lbl">v1.0</span> | ||
| 462 | <span class="k">tag</span> | 464 | <span class="k">tag</span> | ||
| 463 | </a> | 465 | </a> | ||
| 464 | </li> | 466 | </li> | ||
| 465 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 467 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 466 | - | <a href="#" data-fire="keys" tabindex="-1"> | 468 | + | <a role="presentation" data-fire="keys"> |
| 467 | <span class="lbl">turn single-key shortcuts off</span> | 469 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 468 | <span class="k">action</span> | 470 | <span class="k">action</span> | ||
| 469 | </a> | 471 | </a> | ||
M internal/app/testdata/web/blob-empty.html +19 -17
| @@ -141,18 +141,20 @@ | |||
| 141 | 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 142 | 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 143 | 143 | </footer> | |
| 144 | - | <div class="hint" role="status" aria-live="polite"> | |
| 145 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 144 | + | <div class="hint"> | |
| 145 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 146 | 146 | </span> | |
| 147 | + | <span role="status" aria-live="polite"> | |
| 147 | 148 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 148 | 149 | </span> | |
| 149 | 150 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 150 | 151 | </span> | |
| 152 | + | </span> | |
| 151 | 153 | </div> | |
| 152 | 154 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 153 | 155 | <div class="panel-head"> | |
| 154 | 156 | <h2>Keyboard shortcuts</h2> | |
| 155 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 157 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 156 | 158 | <kbd>esc</kbd> close</button> | |
| 157 | 159 | </div> | |
| 158 | 160 | <div class="keys-pref"> | |
| @@ -286,7 +288,7 @@ | |||
| 286 | 288 | <div class="panel-head"> | |
| 287 | 289 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 288 | 290 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 289 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 291 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 290 | 292 | <kbd>esc</kbd> | |
| 291 | 293 | </button> | |
| 292 | 294 | </div> | |
| @@ -321,79 +323,79 @@ | |||
| 321 | 323 | <div class="panel-head"> | |
| 322 | 324 | <label for="cmd-q" class="sr">go to</label> | |
| 323 | 325 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 324 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 326 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 325 | 327 | <kbd>esc</kbd> | |
| 326 | 328 | </button> | |
| 327 | 329 | </div> | |
| 328 | 330 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 329 | 331 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 330 | - | <a href="/" tabindex="-1"> | |
| 332 | + | <a role="presentation" data-href="/"> | |
| 331 | 333 | <span class="lbl">home</span> | |
| 332 | 334 | <span class="k">go</span> | |
| 333 | 335 | </a> | |
| 334 | 336 | </li> | |
| 335 | 337 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 336 | - | <a href="/files" tabindex="-1"> | |
| 338 | + | <a role="presentation" data-href="/files"> | |
| 337 | 339 | <span class="lbl">summary</span> | |
| 338 | 340 | <span class="k">section</span> | |
| 339 | 341 | </a> | |
| 340 | 342 | </li> | |
| 341 | 343 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 342 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 344 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 343 | 345 | <span class="lbl">files</span> | |
| 344 | 346 | <span class="k">section</span> | |
| 345 | 347 | </a> | |
| 346 | 348 | </li> | |
| 347 | 349 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 348 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 350 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 349 | 351 | <span class="lbl">commits</span> | |
| 350 | 352 | <span class="k">section</span> | |
| 351 | 353 | </a> | |
| 352 | 354 | </li> | |
| 353 | 355 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 354 | - | <a href="/files/refs" tabindex="-1"> | |
| 356 | + | <a role="presentation" data-href="/files/refs"> | |
| 355 | 357 | <span class="lbl">branches & tags</span> | |
| 356 | 358 | <span class="k">section</span> | |
| 357 | 359 | </a> | |
| 358 | 360 | </li> | |
| 359 | 361 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 360 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 362 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 361 | 363 | <span class="lbl">merge requests</span> | |
| 362 | 364 | <span class="k">section</span> | |
| 363 | 365 | </a> | |
| 364 | 366 | </li> | |
| 365 | 367 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 366 | - | <a href="/files/releases" tabindex="-1"> | |
| 368 | + | <a role="presentation" data-href="/files/releases"> | |
| 367 | 369 | <span class="lbl">releases</span> | |
| 368 | 370 | <span class="k">section</span> | |
| 369 | 371 | </a> | |
| 370 | 372 | </li> | |
| 371 | 373 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 372 | - | <a href="/files/actions" tabindex="-1"> | |
| 374 | + | <a role="presentation" data-href="/files/actions"> | |
| 373 | 375 | <span class="lbl">actions</span> | |
| 374 | 376 | <span class="k">section</span> | |
| 375 | 377 | </a> | |
| 376 | 378 | </li> | |
| 377 | 379 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 378 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 380 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 379 | 381 | <span class="lbl">feature/x</span> | |
| 380 | 382 | <span class="k">branch</span> | |
| 381 | 383 | </a> | |
| 382 | 384 | </li> | |
| 383 | 385 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 384 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 386 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 385 | 387 | <span class="lbl">main</span> | |
| 386 | 388 | <span class="k">branch</span> | |
| 387 | 389 | </a> | |
| 388 | 390 | </li> | |
| 389 | 391 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 390 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 392 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 391 | 393 | <span class="lbl">v1.0</span> | |
| 392 | 394 | <span class="k">tag</span> | |
| 393 | 395 | </a> | |
| 394 | 396 | </li> | |
| 395 | 397 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 396 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 398 | + | <a role="presentation" data-fire="keys"> | |
| 397 | 399 | <span class="lbl">turn single-key shortcuts off</span> | |
| 398 | 400 | <span class="k">action</span> | |
| 399 | 401 | </a> | |
| @@ -141,18 +141,20 @@ | |||||
| 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 143 | </footer> | 143 | </footer> | ||
| 144 | - | <div class="hint" role="status" aria-live="polite"> | 144 | + | <div class="hint"> |
| 145 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 145 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 146 | </span> | 146 | </span> | ||
| 147 | + | <span role="status" aria-live="polite"> | |||
| 147 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 148 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 148 | </span> | 149 | </span> | ||
| 149 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 150 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 150 | </span> | 151 | </span> | ||
| 152 | + | </span> | |||
| 151 | </div> | 153 | </div> | ||
| 152 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 154 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 153 | <div class="panel-head"> | 155 | <div class="panel-head"> | ||
| 154 | <h2>Keyboard shortcuts</h2> | 156 | <h2>Keyboard shortcuts</h2> | ||
| 155 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 157 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 156 | <kbd>esc</kbd> close</button> | 158 | <kbd>esc</kbd> close</button> | ||
| 157 | </div> | 159 | </div> | ||
| 158 | <div class="keys-pref"> | 160 | <div class="keys-pref"> | ||
| @@ -286,7 +288,7 @@ | |||||
| 286 | <div class="panel-head"> | 288 | <div class="panel-head"> | ||
| 287 | <label for="refs-filter" class="sr">filter branches and tags</label> | 289 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 288 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 290 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 289 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 291 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 290 | <kbd>esc</kbd> | 292 | <kbd>esc</kbd> | ||
| 291 | </button> | 293 | </button> | ||
| 292 | </div> | 294 | </div> | ||
| @@ -321,79 +323,79 @@ | |||||
| 321 | <div class="panel-head"> | 323 | <div class="panel-head"> | ||
| 322 | <label for="cmd-q" class="sr">go to</label> | 324 | <label for="cmd-q" class="sr">go to</label> | ||
| 323 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 325 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 324 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 326 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 325 | <kbd>esc</kbd> | 327 | <kbd>esc</kbd> | ||
| 326 | </button> | 328 | </button> | ||
| 327 | </div> | 329 | </div> | ||
| 328 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 330 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 329 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 331 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 330 | - | <a href="/" tabindex="-1"> | 332 | + | <a role="presentation" data-href="/"> |
| 331 | <span class="lbl">home</span> | 333 | <span class="lbl">home</span> | ||
| 332 | <span class="k">go</span> | 334 | <span class="k">go</span> | ||
| 333 | </a> | 335 | </a> | ||
| 334 | </li> | 336 | </li> | ||
| 335 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 337 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 336 | - | <a href="/files" tabindex="-1"> | 338 | + | <a role="presentation" data-href="/files"> |
| 337 | <span class="lbl">summary</span> | 339 | <span class="lbl">summary</span> | ||
| 338 | <span class="k">section</span> | 340 | <span class="k">section</span> | ||
| 339 | </a> | 341 | </a> | ||
| 340 | </li> | 342 | </li> | ||
| 341 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 343 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 342 | - | <a href="/files/tree/main" tabindex="-1"> | 344 | + | <a role="presentation" data-href="/files/tree/main"> |
| 343 | <span class="lbl">files</span> | 345 | <span class="lbl">files</span> | ||
| 344 | <span class="k">section</span> | 346 | <span class="k">section</span> | ||
| 345 | </a> | 347 | </a> | ||
| 346 | </li> | 348 | </li> | ||
| 347 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 349 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 348 | - | <a href="/files/commits/main" tabindex="-1"> | 350 | + | <a role="presentation" data-href="/files/commits/main"> |
| 349 | <span class="lbl">commits</span> | 351 | <span class="lbl">commits</span> | ||
| 350 | <span class="k">section</span> | 352 | <span class="k">section</span> | ||
| 351 | </a> | 353 | </a> | ||
| 352 | </li> | 354 | </li> | ||
| 353 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 355 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 354 | - | <a href="/files/refs" tabindex="-1"> | 356 | + | <a role="presentation" data-href="/files/refs"> |
| 355 | <span class="lbl">branches & tags</span> | 357 | <span class="lbl">branches & tags</span> | ||
| 356 | <span class="k">section</span> | 358 | <span class="k">section</span> | ||
| 357 | </a> | 359 | </a> | ||
| 358 | </li> | 360 | </li> | ||
| 359 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 361 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 360 | - | <a href="/files/merge-requests" tabindex="-1"> | 362 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 361 | <span class="lbl">merge requests</span> | 363 | <span class="lbl">merge requests</span> | ||
| 362 | <span class="k">section</span> | 364 | <span class="k">section</span> | ||
| 363 | </a> | 365 | </a> | ||
| 364 | </li> | 366 | </li> | ||
| 365 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 367 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 366 | - | <a href="/files/releases" tabindex="-1"> | 368 | + | <a role="presentation" data-href="/files/releases"> |
| 367 | <span class="lbl">releases</span> | 369 | <span class="lbl">releases</span> | ||
| 368 | <span class="k">section</span> | 370 | <span class="k">section</span> | ||
| 369 | </a> | 371 | </a> | ||
| 370 | </li> | 372 | </li> | ||
| 371 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 373 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 372 | - | <a href="/files/actions" tabindex="-1"> | 374 | + | <a role="presentation" data-href="/files/actions"> |
| 373 | <span class="lbl">actions</span> | 375 | <span class="lbl">actions</span> | ||
| 374 | <span class="k">section</span> | 376 | <span class="k">section</span> | ||
| 375 | </a> | 377 | </a> | ||
| 376 | </li> | 378 | </li> | ||
| 377 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 379 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 378 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 380 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 379 | <span class="lbl">feature/x</span> | 381 | <span class="lbl">feature/x</span> | ||
| 380 | <span class="k">branch</span> | 382 | <span class="k">branch</span> | ||
| 381 | </a> | 383 | </a> | ||
| 382 | </li> | 384 | </li> | ||
| 383 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 385 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 384 | - | <a href="/files/tree/main" tabindex="-1"> | 386 | + | <a role="presentation" data-href="/files/tree/main"> |
| 385 | <span class="lbl">main</span> | 387 | <span class="lbl">main</span> | ||
| 386 | <span class="k">branch</span> | 388 | <span class="k">branch</span> | ||
| 387 | </a> | 389 | </a> | ||
| 388 | </li> | 390 | </li> | ||
| 389 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 391 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 390 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 392 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 391 | <span class="lbl">v1.0</span> | 393 | <span class="lbl">v1.0</span> | ||
| 392 | <span class="k">tag</span> | 394 | <span class="k">tag</span> | ||
| 393 | </a> | 395 | </a> | ||
| 394 | </li> | 396 | </li> | ||
| 395 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 397 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 396 | - | <a href="#" data-fire="keys" tabindex="-1"> | 398 | + | <a role="presentation" data-fire="keys"> |
| 397 | <span class="lbl">turn single-key shortcuts off</span> | 399 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 398 | <span class="k">action</span> | 400 | <span class="k">action</span> | ||
| 399 | </a> | 401 | </a> | ||
M internal/app/testdata/web/blob-image.html +19 -17
| @@ -143,18 +143,20 @@ | |||
| 143 | 143 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 144 | 144 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 145 | 145 | </footer> | |
| 146 | - | <div class="hint" role="status" aria-live="polite"> | |
| 147 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 146 | + | <div class="hint"> | |
| 147 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 148 | 148 | </span> | |
| 149 | + | <span role="status" aria-live="polite"> | |
| 149 | 150 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 150 | 151 | </span> | |
| 151 | 152 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 152 | 153 | </span> | |
| 154 | + | </span> | |
| 153 | 155 | </div> | |
| 154 | 156 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 155 | 157 | <div class="panel-head"> | |
| 156 | 158 | <h2>Keyboard shortcuts</h2> | |
| 157 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 159 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 158 | 160 | <kbd>esc</kbd> close</button> | |
| 159 | 161 | </div> | |
| 160 | 162 | <div class="keys-pref"> | |
| @@ -288,7 +290,7 @@ | |||
| 288 | 290 | <div class="panel-head"> | |
| 289 | 291 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 290 | 292 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 291 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 293 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 292 | 294 | <kbd>esc</kbd> | |
| 293 | 295 | </button> | |
| 294 | 296 | </div> | |
| @@ -323,79 +325,79 @@ | |||
| 323 | 325 | <div class="panel-head"> | |
| 324 | 326 | <label for="cmd-q" class="sr">go to</label> | |
| 325 | 327 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 326 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 328 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 327 | 329 | <kbd>esc</kbd> | |
| 328 | 330 | </button> | |
| 329 | 331 | </div> | |
| 330 | 332 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 331 | 333 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 332 | - | <a href="/" tabindex="-1"> | |
| 334 | + | <a role="presentation" data-href="/"> | |
| 333 | 335 | <span class="lbl">home</span> | |
| 334 | 336 | <span class="k">go</span> | |
| 335 | 337 | </a> | |
| 336 | 338 | </li> | |
| 337 | 339 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 338 | - | <a href="/files" tabindex="-1"> | |
| 340 | + | <a role="presentation" data-href="/files"> | |
| 339 | 341 | <span class="lbl">summary</span> | |
| 340 | 342 | <span class="k">section</span> | |
| 341 | 343 | </a> | |
| 342 | 344 | </li> | |
| 343 | 345 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 344 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 346 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 345 | 347 | <span class="lbl">files</span> | |
| 346 | 348 | <span class="k">section</span> | |
| 347 | 349 | </a> | |
| 348 | 350 | </li> | |
| 349 | 351 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 350 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 352 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 351 | 353 | <span class="lbl">commits</span> | |
| 352 | 354 | <span class="k">section</span> | |
| 353 | 355 | </a> | |
| 354 | 356 | </li> | |
| 355 | 357 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 356 | - | <a href="/files/refs" tabindex="-1"> | |
| 358 | + | <a role="presentation" data-href="/files/refs"> | |
| 357 | 359 | <span class="lbl">branches & tags</span> | |
| 358 | 360 | <span class="k">section</span> | |
| 359 | 361 | </a> | |
| 360 | 362 | </li> | |
| 361 | 363 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 362 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 364 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 363 | 365 | <span class="lbl">merge requests</span> | |
| 364 | 366 | <span class="k">section</span> | |
| 365 | 367 | </a> | |
| 366 | 368 | </li> | |
| 367 | 369 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 368 | - | <a href="/files/releases" tabindex="-1"> | |
| 370 | + | <a role="presentation" data-href="/files/releases"> | |
| 369 | 371 | <span class="lbl">releases</span> | |
| 370 | 372 | <span class="k">section</span> | |
| 371 | 373 | </a> | |
| 372 | 374 | </li> | |
| 373 | 375 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 374 | - | <a href="/files/actions" tabindex="-1"> | |
| 376 | + | <a role="presentation" data-href="/files/actions"> | |
| 375 | 377 | <span class="lbl">actions</span> | |
| 376 | 378 | <span class="k">section</span> | |
| 377 | 379 | </a> | |
| 378 | 380 | </li> | |
| 379 | 381 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 380 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 382 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 381 | 383 | <span class="lbl">feature/x</span> | |
| 382 | 384 | <span class="k">branch</span> | |
| 383 | 385 | </a> | |
| 384 | 386 | </li> | |
| 385 | 387 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 386 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 388 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 387 | 389 | <span class="lbl">main</span> | |
| 388 | 390 | <span class="k">branch</span> | |
| 389 | 391 | </a> | |
| 390 | 392 | </li> | |
| 391 | 393 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 392 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 394 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 393 | 395 | <span class="lbl">v1.0</span> | |
| 394 | 396 | <span class="k">tag</span> | |
| 395 | 397 | </a> | |
| 396 | 398 | </li> | |
| 397 | 399 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 398 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 400 | + | <a role="presentation" data-fire="keys"> | |
| 399 | 401 | <span class="lbl">turn single-key shortcuts off</span> | |
| 400 | 402 | <span class="k">action</span> | |
| 401 | 403 | </a> | |
| @@ -143,18 +143,20 @@ | |||||
| 143 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 143 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 144 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 144 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 145 | </footer> | 145 | </footer> | ||
| 146 | - | <div class="hint" role="status" aria-live="polite"> | 146 | + | <div class="hint"> |
| 147 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 147 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 148 | </span> | 148 | </span> | ||
| 149 | + | <span role="status" aria-live="polite"> | |||
| 149 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 150 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 150 | </span> | 151 | </span> | ||
| 151 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 152 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 152 | </span> | 153 | </span> | ||
| 154 | + | </span> | |||
| 153 | </div> | 155 | </div> | ||
| 154 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 156 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 155 | <div class="panel-head"> | 157 | <div class="panel-head"> | ||
| 156 | <h2>Keyboard shortcuts</h2> | 158 | <h2>Keyboard shortcuts</h2> | ||
| 157 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 159 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 158 | <kbd>esc</kbd> close</button> | 160 | <kbd>esc</kbd> close</button> | ||
| 159 | </div> | 161 | </div> | ||
| 160 | <div class="keys-pref"> | 162 | <div class="keys-pref"> | ||
| @@ -288,7 +290,7 @@ | |||||
| 288 | <div class="panel-head"> | 290 | <div class="panel-head"> | ||
| 289 | <label for="refs-filter" class="sr">filter branches and tags</label> | 291 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 290 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 292 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 291 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 293 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 292 | <kbd>esc</kbd> | 294 | <kbd>esc</kbd> | ||
| 293 | </button> | 295 | </button> | ||
| 294 | </div> | 296 | </div> | ||
| @@ -323,79 +325,79 @@ | |||||
| 323 | <div class="panel-head"> | 325 | <div class="panel-head"> | ||
| 324 | <label for="cmd-q" class="sr">go to</label> | 326 | <label for="cmd-q" class="sr">go to</label> | ||
| 325 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 327 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 326 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 328 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 327 | <kbd>esc</kbd> | 329 | <kbd>esc</kbd> | ||
| 328 | </button> | 330 | </button> | ||
| 329 | </div> | 331 | </div> | ||
| 330 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 332 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 331 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 333 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 332 | - | <a href="/" tabindex="-1"> | 334 | + | <a role="presentation" data-href="/"> |
| 333 | <span class="lbl">home</span> | 335 | <span class="lbl">home</span> | ||
| 334 | <span class="k">go</span> | 336 | <span class="k">go</span> | ||
| 335 | </a> | 337 | </a> | ||
| 336 | </li> | 338 | </li> | ||
| 337 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 339 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 338 | - | <a href="/files" tabindex="-1"> | 340 | + | <a role="presentation" data-href="/files"> |
| 339 | <span class="lbl">summary</span> | 341 | <span class="lbl">summary</span> | ||
| 340 | <span class="k">section</span> | 342 | <span class="k">section</span> | ||
| 341 | </a> | 343 | </a> | ||
| 342 | </li> | 344 | </li> | ||
| 343 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 345 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 344 | - | <a href="/files/tree/main" tabindex="-1"> | 346 | + | <a role="presentation" data-href="/files/tree/main"> |
| 345 | <span class="lbl">files</span> | 347 | <span class="lbl">files</span> | ||
| 346 | <span class="k">section</span> | 348 | <span class="k">section</span> | ||
| 347 | </a> | 349 | </a> | ||
| 348 | </li> | 350 | </li> | ||
| 349 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 351 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 350 | - | <a href="/files/commits/main" tabindex="-1"> | 352 | + | <a role="presentation" data-href="/files/commits/main"> |
| 351 | <span class="lbl">commits</span> | 353 | <span class="lbl">commits</span> | ||
| 352 | <span class="k">section</span> | 354 | <span class="k">section</span> | ||
| 353 | </a> | 355 | </a> | ||
| 354 | </li> | 356 | </li> | ||
| 355 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 357 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 356 | - | <a href="/files/refs" tabindex="-1"> | 358 | + | <a role="presentation" data-href="/files/refs"> |
| 357 | <span class="lbl">branches & tags</span> | 359 | <span class="lbl">branches & tags</span> | ||
| 358 | <span class="k">section</span> | 360 | <span class="k">section</span> | ||
| 359 | </a> | 361 | </a> | ||
| 360 | </li> | 362 | </li> | ||
| 361 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 363 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 362 | - | <a href="/files/merge-requests" tabindex="-1"> | 364 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 363 | <span class="lbl">merge requests</span> | 365 | <span class="lbl">merge requests</span> | ||
| 364 | <span class="k">section</span> | 366 | <span class="k">section</span> | ||
| 365 | </a> | 367 | </a> | ||
| 366 | </li> | 368 | </li> | ||
| 367 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 369 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 368 | - | <a href="/files/releases" tabindex="-1"> | 370 | + | <a role="presentation" data-href="/files/releases"> |
| 369 | <span class="lbl">releases</span> | 371 | <span class="lbl">releases</span> | ||
| 370 | <span class="k">section</span> | 372 | <span class="k">section</span> | ||
| 371 | </a> | 373 | </a> | ||
| 372 | </li> | 374 | </li> | ||
| 373 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 375 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 374 | - | <a href="/files/actions" tabindex="-1"> | 376 | + | <a role="presentation" data-href="/files/actions"> |
| 375 | <span class="lbl">actions</span> | 377 | <span class="lbl">actions</span> | ||
| 376 | <span class="k">section</span> | 378 | <span class="k">section</span> | ||
| 377 | </a> | 379 | </a> | ||
| 378 | </li> | 380 | </li> | ||
| 379 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 381 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 380 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 382 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 381 | <span class="lbl">feature/x</span> | 383 | <span class="lbl">feature/x</span> | ||
| 382 | <span class="k">branch</span> | 384 | <span class="k">branch</span> | ||
| 383 | </a> | 385 | </a> | ||
| 384 | </li> | 386 | </li> | ||
| 385 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 387 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 386 | - | <a href="/files/tree/main" tabindex="-1"> | 388 | + | <a role="presentation" data-href="/files/tree/main"> |
| 387 | <span class="lbl">main</span> | 389 | <span class="lbl">main</span> | ||
| 388 | <span class="k">branch</span> | 390 | <span class="k">branch</span> | ||
| 389 | </a> | 391 | </a> | ||
| 390 | </li> | 392 | </li> | ||
| 391 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 393 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 392 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 394 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 393 | <span class="lbl">v1.0</span> | 395 | <span class="lbl">v1.0</span> | ||
| 394 | <span class="k">tag</span> | 396 | <span class="k">tag</span> | ||
| 395 | </a> | 397 | </a> | ||
| 396 | </li> | 398 | </li> | ||
| 397 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 399 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 398 | - | <a href="#" data-fire="keys" tabindex="-1"> | 400 | + | <a role="presentation" data-fire="keys"> |
| 399 | <span class="lbl">turn single-key shortcuts off</span> | 401 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 400 | <span class="k">action</span> | 402 | <span class="k">action</span> | ||
| 401 | </a> | 403 | </a> | ||
M internal/app/testdata/web/blob-markdown.html +19 -17
| @@ -208,18 +208,20 @@ | |||
| 208 | 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 209 | 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 210 | 210 | </footer> | |
| 211 | - | <div class="hint" role="status" aria-live="polite"> | |
| 212 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 211 | + | <div class="hint"> | |
| 212 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 213 | 213 | </span> | |
| 214 | + | <span role="status" aria-live="polite"> | |
| 214 | 215 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 215 | 216 | </span> | |
| 216 | 217 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 217 | 218 | </span> | |
| 219 | + | </span> | |
| 218 | 220 | </div> | |
| 219 | 221 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 220 | 222 | <div class="panel-head"> | |
| 221 | 223 | <h2>Keyboard shortcuts</h2> | |
| 222 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 224 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 223 | 225 | <kbd>esc</kbd> close</button> | |
| 224 | 226 | </div> | |
| 225 | 227 | <div class="keys-pref"> | |
| @@ -353,7 +355,7 @@ | |||
| 353 | 355 | <div class="panel-head"> | |
| 354 | 356 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 355 | 357 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 356 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 358 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 357 | 359 | <kbd>esc</kbd> | |
| 358 | 360 | </button> | |
| 359 | 361 | </div> | |
| @@ -388,79 +390,79 @@ | |||
| 388 | 390 | <div class="panel-head"> | |
| 389 | 391 | <label for="cmd-q" class="sr">go to</label> | |
| 390 | 392 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 391 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 393 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 392 | 394 | <kbd>esc</kbd> | |
| 393 | 395 | </button> | |
| 394 | 396 | </div> | |
| 395 | 397 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 396 | 398 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 397 | - | <a href="/" tabindex="-1"> | |
| 399 | + | <a role="presentation" data-href="/"> | |
| 398 | 400 | <span class="lbl">home</span> | |
| 399 | 401 | <span class="k">go</span> | |
| 400 | 402 | </a> | |
| 401 | 403 | </li> | |
| 402 | 404 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 403 | - | <a href="/files" tabindex="-1"> | |
| 405 | + | <a role="presentation" data-href="/files"> | |
| 404 | 406 | <span class="lbl">summary</span> | |
| 405 | 407 | <span class="k">section</span> | |
| 406 | 408 | </a> | |
| 407 | 409 | </li> | |
| 408 | 410 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 411 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 410 | 412 | <span class="lbl">files</span> | |
| 411 | 413 | <span class="k">section</span> | |
| 412 | 414 | </a> | |
| 413 | 415 | </li> | |
| 414 | 416 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 415 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 417 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 416 | 418 | <span class="lbl">commits</span> | |
| 417 | 419 | <span class="k">section</span> | |
| 418 | 420 | </a> | |
| 419 | 421 | </li> | |
| 420 | 422 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 421 | - | <a href="/files/refs" tabindex="-1"> | |
| 423 | + | <a role="presentation" data-href="/files/refs"> | |
| 422 | 424 | <span class="lbl">branches & tags</span> | |
| 423 | 425 | <span class="k">section</span> | |
| 424 | 426 | </a> | |
| 425 | 427 | </li> | |
| 426 | 428 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 427 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 429 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 428 | 430 | <span class="lbl">merge requests</span> | |
| 429 | 431 | <span class="k">section</span> | |
| 430 | 432 | </a> | |
| 431 | 433 | </li> | |
| 432 | 434 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 433 | - | <a href="/files/releases" tabindex="-1"> | |
| 435 | + | <a role="presentation" data-href="/files/releases"> | |
| 434 | 436 | <span class="lbl">releases</span> | |
| 435 | 437 | <span class="k">section</span> | |
| 436 | 438 | </a> | |
| 437 | 439 | </li> | |
| 438 | 440 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 439 | - | <a href="/files/actions" tabindex="-1"> | |
| 441 | + | <a role="presentation" data-href="/files/actions"> | |
| 440 | 442 | <span class="lbl">actions</span> | |
| 441 | 443 | <span class="k">section</span> | |
| 442 | 444 | </a> | |
| 443 | 445 | </li> | |
| 444 | 446 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 445 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 447 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 446 | 448 | <span class="lbl">feature/x</span> | |
| 447 | 449 | <span class="k">branch</span> | |
| 448 | 450 | </a> | |
| 449 | 451 | </li> | |
| 450 | 452 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 451 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 453 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 452 | 454 | <span class="lbl">main</span> | |
| 453 | 455 | <span class="k">branch</span> | |
| 454 | 456 | </a> | |
| 455 | 457 | </li> | |
| 456 | 458 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 457 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 459 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 458 | 460 | <span class="lbl">v1.0</span> | |
| 459 | 461 | <span class="k">tag</span> | |
| 460 | 462 | </a> | |
| 461 | 463 | </li> | |
| 462 | 464 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 463 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 465 | + | <a role="presentation" data-fire="keys"> | |
| 464 | 466 | <span class="lbl">turn single-key shortcuts off</span> | |
| 465 | 467 | <span class="k">action</span> | |
| 466 | 468 | </a> | |
| @@ -208,18 +208,20 @@ | |||||
| 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 210 | </footer> | 210 | </footer> | ||
| 211 | - | <div class="hint" role="status" aria-live="polite"> | 211 | + | <div class="hint"> |
| 212 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 212 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 213 | </span> | 213 | </span> | ||
| 214 | + | <span role="status" aria-live="polite"> | |||
| 214 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 215 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 215 | </span> | 216 | </span> | ||
| 216 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 217 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 217 | </span> | 218 | </span> | ||
| 219 | + | </span> | |||
| 218 | </div> | 220 | </div> | ||
| 219 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 221 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 220 | <div class="panel-head"> | 222 | <div class="panel-head"> | ||
| 221 | <h2>Keyboard shortcuts</h2> | 223 | <h2>Keyboard shortcuts</h2> | ||
| 222 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 224 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 223 | <kbd>esc</kbd> close</button> | 225 | <kbd>esc</kbd> close</button> | ||
| 224 | </div> | 226 | </div> | ||
| 225 | <div class="keys-pref"> | 227 | <div class="keys-pref"> | ||
| @@ -353,7 +355,7 @@ | |||||
| 353 | <div class="panel-head"> | 355 | <div class="panel-head"> | ||
| 354 | <label for="refs-filter" class="sr">filter branches and tags</label> | 356 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 355 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 357 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 356 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 358 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 357 | <kbd>esc</kbd> | 359 | <kbd>esc</kbd> | ||
| 358 | </button> | 360 | </button> | ||
| 359 | </div> | 361 | </div> | ||
| @@ -388,79 +390,79 @@ | |||||
| 388 | <div class="panel-head"> | 390 | <div class="panel-head"> | ||
| 389 | <label for="cmd-q" class="sr">go to</label> | 391 | <label for="cmd-q" class="sr">go to</label> | ||
| 390 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 392 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 391 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 393 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 392 | <kbd>esc</kbd> | 394 | <kbd>esc</kbd> | ||
| 393 | </button> | 395 | </button> | ||
| 394 | </div> | 396 | </div> | ||
| 395 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 397 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 396 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 398 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 397 | - | <a href="/" tabindex="-1"> | 399 | + | <a role="presentation" data-href="/"> |
| 398 | <span class="lbl">home</span> | 400 | <span class="lbl">home</span> | ||
| 399 | <span class="k">go</span> | 401 | <span class="k">go</span> | ||
| 400 | </a> | 402 | </a> | ||
| 401 | </li> | 403 | </li> | ||
| 402 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 404 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 403 | - | <a href="/files" tabindex="-1"> | 405 | + | <a role="presentation" data-href="/files"> |
| 404 | <span class="lbl">summary</span> | 406 | <span class="lbl">summary</span> | ||
| 405 | <span class="k">section</span> | 407 | <span class="k">section</span> | ||
| 406 | </a> | 408 | </a> | ||
| 407 | </li> | 409 | </li> | ||
| 408 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 410 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | 411 | + | <a role="presentation" data-href="/files/tree/main"> |
| 410 | <span class="lbl">files</span> | 412 | <span class="lbl">files</span> | ||
| 411 | <span class="k">section</span> | 413 | <span class="k">section</span> | ||
| 412 | </a> | 414 | </a> | ||
| 413 | </li> | 415 | </li> | ||
| 414 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 416 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 415 | - | <a href="/files/commits/main" tabindex="-1"> | 417 | + | <a role="presentation" data-href="/files/commits/main"> |
| 416 | <span class="lbl">commits</span> | 418 | <span class="lbl">commits</span> | ||
| 417 | <span class="k">section</span> | 419 | <span class="k">section</span> | ||
| 418 | </a> | 420 | </a> | ||
| 419 | </li> | 421 | </li> | ||
| 420 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 422 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 421 | - | <a href="/files/refs" tabindex="-1"> | 423 | + | <a role="presentation" data-href="/files/refs"> |
| 422 | <span class="lbl">branches & tags</span> | 424 | <span class="lbl">branches & tags</span> | ||
| 423 | <span class="k">section</span> | 425 | <span class="k">section</span> | ||
| 424 | </a> | 426 | </a> | ||
| 425 | </li> | 427 | </li> | ||
| 426 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 428 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 427 | - | <a href="/files/merge-requests" tabindex="-1"> | 429 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 428 | <span class="lbl">merge requests</span> | 430 | <span class="lbl">merge requests</span> | ||
| 429 | <span class="k">section</span> | 431 | <span class="k">section</span> | ||
| 430 | </a> | 432 | </a> | ||
| 431 | </li> | 433 | </li> | ||
| 432 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 434 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 433 | - | <a href="/files/releases" tabindex="-1"> | 435 | + | <a role="presentation" data-href="/files/releases"> |
| 434 | <span class="lbl">releases</span> | 436 | <span class="lbl">releases</span> | ||
| 435 | <span class="k">section</span> | 437 | <span class="k">section</span> | ||
| 436 | </a> | 438 | </a> | ||
| 437 | </li> | 439 | </li> | ||
| 438 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 440 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 439 | - | <a href="/files/actions" tabindex="-1"> | 441 | + | <a role="presentation" data-href="/files/actions"> |
| 440 | <span class="lbl">actions</span> | 442 | <span class="lbl">actions</span> | ||
| 441 | <span class="k">section</span> | 443 | <span class="k">section</span> | ||
| 442 | </a> | 444 | </a> | ||
| 443 | </li> | 445 | </li> | ||
| 444 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 446 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 445 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 447 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 446 | <span class="lbl">feature/x</span> | 448 | <span class="lbl">feature/x</span> | ||
| 447 | <span class="k">branch</span> | 449 | <span class="k">branch</span> | ||
| 448 | </a> | 450 | </a> | ||
| 449 | </li> | 451 | </li> | ||
| 450 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 452 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 451 | - | <a href="/files/tree/main" tabindex="-1"> | 453 | + | <a role="presentation" data-href="/files/tree/main"> |
| 452 | <span class="lbl">main</span> | 454 | <span class="lbl">main</span> | ||
| 453 | <span class="k">branch</span> | 455 | <span class="k">branch</span> | ||
| 454 | </a> | 456 | </a> | ||
| 455 | </li> | 457 | </li> | ||
| 456 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 458 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 457 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 459 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 458 | <span class="lbl">v1.0</span> | 460 | <span class="lbl">v1.0</span> | ||
| 459 | <span class="k">tag</span> | 461 | <span class="k">tag</span> | ||
| 460 | </a> | 462 | </a> | ||
| 461 | </li> | 463 | </li> | ||
| 462 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 464 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 463 | - | <a href="#" data-fire="keys" tabindex="-1"> | 465 | + | <a role="presentation" data-fire="keys"> |
| 464 | <span class="lbl">turn single-key shortcuts off</span> | 466 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 465 | <span class="k">action</span> | 467 | <span class="k">action</span> | ||
| 466 | </a> | 468 | </a> | ||
M internal/app/testdata/web/blob-svg.html +19 -17
| @@ -166,18 +166,20 @@ | |||
| 166 | 166 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 167 | 167 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 168 | 168 | </footer> | |
| 169 | - | <div class="hint" role="status" aria-live="polite"> | |
| 170 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 169 | + | <div class="hint"> | |
| 170 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 171 | 171 | </span> | |
| 172 | + | <span role="status" aria-live="polite"> | |
| 172 | 173 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 173 | 174 | </span> | |
| 174 | 175 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 175 | 176 | </span> | |
| 177 | + | </span> | |
| 176 | 178 | </div> | |
| 177 | 179 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 178 | 180 | <div class="panel-head"> | |
| 179 | 181 | <h2>Keyboard shortcuts</h2> | |
| 180 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 182 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 181 | 183 | <kbd>esc</kbd> close</button> | |
| 182 | 184 | </div> | |
| 183 | 185 | <div class="keys-pref"> | |
| @@ -311,7 +313,7 @@ | |||
| 311 | 313 | <div class="panel-head"> | |
| 312 | 314 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 313 | 315 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 314 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 316 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 315 | 317 | <kbd>esc</kbd> | |
| 316 | 318 | </button> | |
| 317 | 319 | </div> | |
| @@ -346,79 +348,79 @@ | |||
| 346 | 348 | <div class="panel-head"> | |
| 347 | 349 | <label for="cmd-q" class="sr">go to</label> | |
| 348 | 350 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 349 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 351 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 350 | 352 | <kbd>esc</kbd> | |
| 351 | 353 | </button> | |
| 352 | 354 | </div> | |
| 353 | 355 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 354 | 356 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 355 | - | <a href="/" tabindex="-1"> | |
| 357 | + | <a role="presentation" data-href="/"> | |
| 356 | 358 | <span class="lbl">home</span> | |
| 357 | 359 | <span class="k">go</span> | |
| 358 | 360 | </a> | |
| 359 | 361 | </li> | |
| 360 | 362 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 361 | - | <a href="/files" tabindex="-1"> | |
| 363 | + | <a role="presentation" data-href="/files"> | |
| 362 | 364 | <span class="lbl">summary</span> | |
| 363 | 365 | <span class="k">section</span> | |
| 364 | 366 | </a> | |
| 365 | 367 | </li> | |
| 366 | 368 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 367 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 369 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 368 | 370 | <span class="lbl">files</span> | |
| 369 | 371 | <span class="k">section</span> | |
| 370 | 372 | </a> | |
| 371 | 373 | </li> | |
| 372 | 374 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 373 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 375 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 374 | 376 | <span class="lbl">commits</span> | |
| 375 | 377 | <span class="k">section</span> | |
| 376 | 378 | </a> | |
| 377 | 379 | </li> | |
| 378 | 380 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 379 | - | <a href="/files/refs" tabindex="-1"> | |
| 381 | + | <a role="presentation" data-href="/files/refs"> | |
| 380 | 382 | <span class="lbl">branches & tags</span> | |
| 381 | 383 | <span class="k">section</span> | |
| 382 | 384 | </a> | |
| 383 | 385 | </li> | |
| 384 | 386 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 385 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 387 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 386 | 388 | <span class="lbl">merge requests</span> | |
| 387 | 389 | <span class="k">section</span> | |
| 388 | 390 | </a> | |
| 389 | 391 | </li> | |
| 390 | 392 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 391 | - | <a href="/files/releases" tabindex="-1"> | |
| 393 | + | <a role="presentation" data-href="/files/releases"> | |
| 392 | 394 | <span class="lbl">releases</span> | |
| 393 | 395 | <span class="k">section</span> | |
| 394 | 396 | </a> | |
| 395 | 397 | </li> | |
| 396 | 398 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 397 | - | <a href="/files/actions" tabindex="-1"> | |
| 399 | + | <a role="presentation" data-href="/files/actions"> | |
| 398 | 400 | <span class="lbl">actions</span> | |
| 399 | 401 | <span class="k">section</span> | |
| 400 | 402 | </a> | |
| 401 | 403 | </li> | |
| 402 | 404 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 403 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 405 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 404 | 406 | <span class="lbl">feature/x</span> | |
| 405 | 407 | <span class="k">branch</span> | |
| 406 | 408 | </a> | |
| 407 | 409 | </li> | |
| 408 | 410 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 411 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 410 | 412 | <span class="lbl">main</span> | |
| 411 | 413 | <span class="k">branch</span> | |
| 412 | 414 | </a> | |
| 413 | 415 | </li> | |
| 414 | 416 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 415 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 417 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 416 | 418 | <span class="lbl">v1.0</span> | |
| 417 | 419 | <span class="k">tag</span> | |
| 418 | 420 | </a> | |
| 419 | 421 | </li> | |
| 420 | 422 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 421 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 423 | + | <a role="presentation" data-fire="keys"> | |
| 422 | 424 | <span class="lbl">turn single-key shortcuts off</span> | |
| 423 | 425 | <span class="k">action</span> | |
| 424 | 426 | </a> | |
| @@ -166,18 +166,20 @@ | |||||
| 166 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 166 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 167 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 167 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 168 | </footer> | 168 | </footer> | ||
| 169 | - | <div class="hint" role="status" aria-live="polite"> | 169 | + | <div class="hint"> |
| 170 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 170 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 171 | </span> | 171 | </span> | ||
| 172 | + | <span role="status" aria-live="polite"> | |||
| 172 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 173 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 173 | </span> | 174 | </span> | ||
| 174 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 175 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 175 | </span> | 176 | </span> | ||
| 177 | + | </span> | |||
| 176 | </div> | 178 | </div> | ||
| 177 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 179 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 178 | <div class="panel-head"> | 180 | <div class="panel-head"> | ||
| 179 | <h2>Keyboard shortcuts</h2> | 181 | <h2>Keyboard shortcuts</h2> | ||
| 180 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 182 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 181 | <kbd>esc</kbd> close</button> | 183 | <kbd>esc</kbd> close</button> | ||
| 182 | </div> | 184 | </div> | ||
| 183 | <div class="keys-pref"> | 185 | <div class="keys-pref"> | ||
| @@ -311,7 +313,7 @@ | |||||
| 311 | <div class="panel-head"> | 313 | <div class="panel-head"> | ||
| 312 | <label for="refs-filter" class="sr">filter branches and tags</label> | 314 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 313 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 315 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 314 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 316 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 315 | <kbd>esc</kbd> | 317 | <kbd>esc</kbd> | ||
| 316 | </button> | 318 | </button> | ||
| 317 | </div> | 319 | </div> | ||
| @@ -346,79 +348,79 @@ | |||||
| 346 | <div class="panel-head"> | 348 | <div class="panel-head"> | ||
| 347 | <label for="cmd-q" class="sr">go to</label> | 349 | <label for="cmd-q" class="sr">go to</label> | ||
| 348 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 350 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 349 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 351 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 350 | <kbd>esc</kbd> | 352 | <kbd>esc</kbd> | ||
| 351 | </button> | 353 | </button> | ||
| 352 | </div> | 354 | </div> | ||
| 353 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 355 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 354 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 356 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 355 | - | <a href="/" tabindex="-1"> | 357 | + | <a role="presentation" data-href="/"> |
| 356 | <span class="lbl">home</span> | 358 | <span class="lbl">home</span> | ||
| 357 | <span class="k">go</span> | 359 | <span class="k">go</span> | ||
| 358 | </a> | 360 | </a> | ||
| 359 | </li> | 361 | </li> | ||
| 360 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 362 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 361 | - | <a href="/files" tabindex="-1"> | 363 | + | <a role="presentation" data-href="/files"> |
| 362 | <span class="lbl">summary</span> | 364 | <span class="lbl">summary</span> | ||
| 363 | <span class="k">section</span> | 365 | <span class="k">section</span> | ||
| 364 | </a> | 366 | </a> | ||
| 365 | </li> | 367 | </li> | ||
| 366 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 368 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 367 | - | <a href="/files/tree/main" tabindex="-1"> | 369 | + | <a role="presentation" data-href="/files/tree/main"> |
| 368 | <span class="lbl">files</span> | 370 | <span class="lbl">files</span> | ||
| 369 | <span class="k">section</span> | 371 | <span class="k">section</span> | ||
| 370 | </a> | 372 | </a> | ||
| 371 | </li> | 373 | </li> | ||
| 372 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 374 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 373 | - | <a href="/files/commits/main" tabindex="-1"> | 375 | + | <a role="presentation" data-href="/files/commits/main"> |
| 374 | <span class="lbl">commits</span> | 376 | <span class="lbl">commits</span> | ||
| 375 | <span class="k">section</span> | 377 | <span class="k">section</span> | ||
| 376 | </a> | 378 | </a> | ||
| 377 | </li> | 379 | </li> | ||
| 378 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 380 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 379 | - | <a href="/files/refs" tabindex="-1"> | 381 | + | <a role="presentation" data-href="/files/refs"> |
| 380 | <span class="lbl">branches & tags</span> | 382 | <span class="lbl">branches & tags</span> | ||
| 381 | <span class="k">section</span> | 383 | <span class="k">section</span> | ||
| 382 | </a> | 384 | </a> | ||
| 383 | </li> | 385 | </li> | ||
| 384 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 386 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 385 | - | <a href="/files/merge-requests" tabindex="-1"> | 387 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 386 | <span class="lbl">merge requests</span> | 388 | <span class="lbl">merge requests</span> | ||
| 387 | <span class="k">section</span> | 389 | <span class="k">section</span> | ||
| 388 | </a> | 390 | </a> | ||
| 389 | </li> | 391 | </li> | ||
| 390 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 392 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 391 | - | <a href="/files/releases" tabindex="-1"> | 393 | + | <a role="presentation" data-href="/files/releases"> |
| 392 | <span class="lbl">releases</span> | 394 | <span class="lbl">releases</span> | ||
| 393 | <span class="k">section</span> | 395 | <span class="k">section</span> | ||
| 394 | </a> | 396 | </a> | ||
| 395 | </li> | 397 | </li> | ||
| 396 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 398 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 397 | - | <a href="/files/actions" tabindex="-1"> | 399 | + | <a role="presentation" data-href="/files/actions"> |
| 398 | <span class="lbl">actions</span> | 400 | <span class="lbl">actions</span> | ||
| 399 | <span class="k">section</span> | 401 | <span class="k">section</span> | ||
| 400 | </a> | 402 | </a> | ||
| 401 | </li> | 403 | </li> | ||
| 402 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 404 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 403 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 405 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 404 | <span class="lbl">feature/x</span> | 406 | <span class="lbl">feature/x</span> | ||
| 405 | <span class="k">branch</span> | 407 | <span class="k">branch</span> | ||
| 406 | </a> | 408 | </a> | ||
| 407 | </li> | 409 | </li> | ||
| 408 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 410 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | 411 | + | <a role="presentation" data-href="/files/tree/main"> |
| 410 | <span class="lbl">main</span> | 412 | <span class="lbl">main</span> | ||
| 411 | <span class="k">branch</span> | 413 | <span class="k">branch</span> | ||
| 412 | </a> | 414 | </a> | ||
| 413 | </li> | 415 | </li> | ||
| 414 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 416 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 415 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 417 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 416 | <span class="lbl">v1.0</span> | 418 | <span class="lbl">v1.0</span> | ||
| 417 | <span class="k">tag</span> | 419 | <span class="k">tag</span> | ||
| 418 | </a> | 420 | </a> | ||
| 419 | </li> | 421 | </li> | ||
| 420 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 422 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 421 | - | <a href="#" data-fire="keys" tabindex="-1"> | 423 | + | <a role="presentation" data-fire="keys"> |
| 422 | <span class="lbl">turn single-key shortcuts off</span> | 424 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 423 | <span class="k">action</span> | 425 | <span class="k">action</span> | ||
| 424 | </a> | 426 | </a> | ||
M internal/app/testdata/web/blob-text.html +19 -17
| @@ -161,18 +161,20 @@ | |||
| 161 | 161 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 162 | 162 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 163 | 163 | </footer> | |
| 164 | - | <div class="hint" role="status" aria-live="polite"> | |
| 165 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 164 | + | <div class="hint"> | |
| 165 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 166 | 166 | </span> | |
| 167 | + | <span role="status" aria-live="polite"> | |
| 167 | 168 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 168 | 169 | </span> | |
| 169 | 170 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 170 | 171 | </span> | |
| 172 | + | </span> | |
| 171 | 173 | </div> | |
| 172 | 174 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 173 | 175 | <div class="panel-head"> | |
| 174 | 176 | <h2>Keyboard shortcuts</h2> | |
| 175 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 177 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 176 | 178 | <kbd>esc</kbd> close</button> | |
| 177 | 179 | </div> | |
| 178 | 180 | <div class="keys-pref"> | |
| @@ -306,7 +308,7 @@ | |||
| 306 | 308 | <div class="panel-head"> | |
| 307 | 309 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 308 | 310 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 309 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 311 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 310 | 312 | <kbd>esc</kbd> | |
| 311 | 313 | </button> | |
| 312 | 314 | </div> | |
| @@ -341,79 +343,79 @@ | |||
| 341 | 343 | <div class="panel-head"> | |
| 342 | 344 | <label for="cmd-q" class="sr">go to</label> | |
| 343 | 345 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 344 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 346 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 345 | 347 | <kbd>esc</kbd> | |
| 346 | 348 | </button> | |
| 347 | 349 | </div> | |
| 348 | 350 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 349 | 351 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 350 | - | <a href="/" tabindex="-1"> | |
| 352 | + | <a role="presentation" data-href="/"> | |
| 351 | 353 | <span class="lbl">home</span> | |
| 352 | 354 | <span class="k">go</span> | |
| 353 | 355 | </a> | |
| 354 | 356 | </li> | |
| 355 | 357 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 356 | - | <a href="/files" tabindex="-1"> | |
| 358 | + | <a role="presentation" data-href="/files"> | |
| 357 | 359 | <span class="lbl">summary</span> | |
| 358 | 360 | <span class="k">section</span> | |
| 359 | 361 | </a> | |
| 360 | 362 | </li> | |
| 361 | 363 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 362 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 364 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 363 | 365 | <span class="lbl">files</span> | |
| 364 | 366 | <span class="k">section</span> | |
| 365 | 367 | </a> | |
| 366 | 368 | </li> | |
| 367 | 369 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 368 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 370 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 369 | 371 | <span class="lbl">commits</span> | |
| 370 | 372 | <span class="k">section</span> | |
| 371 | 373 | </a> | |
| 372 | 374 | </li> | |
| 373 | 375 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 374 | - | <a href="/files/refs" tabindex="-1"> | |
| 376 | + | <a role="presentation" data-href="/files/refs"> | |
| 375 | 377 | <span class="lbl">branches & tags</span> | |
| 376 | 378 | <span class="k">section</span> | |
| 377 | 379 | </a> | |
| 378 | 380 | </li> | |
| 379 | 381 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 380 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 382 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 381 | 383 | <span class="lbl">merge requests</span> | |
| 382 | 384 | <span class="k">section</span> | |
| 383 | 385 | </a> | |
| 384 | 386 | </li> | |
| 385 | 387 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 386 | - | <a href="/files/releases" tabindex="-1"> | |
| 388 | + | <a role="presentation" data-href="/files/releases"> | |
| 387 | 389 | <span class="lbl">releases</span> | |
| 388 | 390 | <span class="k">section</span> | |
| 389 | 391 | </a> | |
| 390 | 392 | </li> | |
| 391 | 393 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 392 | - | <a href="/files/actions" tabindex="-1"> | |
| 394 | + | <a role="presentation" data-href="/files/actions"> | |
| 393 | 395 | <span class="lbl">actions</span> | |
| 394 | 396 | <span class="k">section</span> | |
| 395 | 397 | </a> | |
| 396 | 398 | </li> | |
| 397 | 399 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 398 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 400 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 399 | 401 | <span class="lbl">feature/x</span> | |
| 400 | 402 | <span class="k">branch</span> | |
| 401 | 403 | </a> | |
| 402 | 404 | </li> | |
| 403 | 405 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 404 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 406 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 405 | 407 | <span class="lbl">main</span> | |
| 406 | 408 | <span class="k">branch</span> | |
| 407 | 409 | </a> | |
| 408 | 410 | </li> | |
| 409 | 411 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 410 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 412 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 411 | 413 | <span class="lbl">v1.0</span> | |
| 412 | 414 | <span class="k">tag</span> | |
| 413 | 415 | </a> | |
| 414 | 416 | </li> | |
| 415 | 417 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 416 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 418 | + | <a role="presentation" data-fire="keys"> | |
| 417 | 419 | <span class="lbl">turn single-key shortcuts off</span> | |
| 418 | 420 | <span class="k">action</span> | |
| 419 | 421 | </a> | |
| @@ -161,18 +161,20 @@ | |||||
| 161 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 161 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 162 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 162 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 163 | </footer> | 163 | </footer> | ||
| 164 | - | <div class="hint" role="status" aria-live="polite"> | 164 | + | <div class="hint"> |
| 165 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 165 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 166 | </span> | 166 | </span> | ||
| 167 | + | <span role="status" aria-live="polite"> | |||
| 167 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 168 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 168 | </span> | 169 | </span> | ||
| 169 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 170 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 170 | </span> | 171 | </span> | ||
| 172 | + | </span> | |||
| 171 | </div> | 173 | </div> | ||
| 172 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 174 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 173 | <div class="panel-head"> | 175 | <div class="panel-head"> | ||
| 174 | <h2>Keyboard shortcuts</h2> | 176 | <h2>Keyboard shortcuts</h2> | ||
| 175 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 177 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 176 | <kbd>esc</kbd> close</button> | 178 | <kbd>esc</kbd> close</button> | ||
| 177 | </div> | 179 | </div> | ||
| 178 | <div class="keys-pref"> | 180 | <div class="keys-pref"> | ||
| @@ -306,7 +308,7 @@ | |||||
| 306 | <div class="panel-head"> | 308 | <div class="panel-head"> | ||
| 307 | <label for="refs-filter" class="sr">filter branches and tags</label> | 309 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 308 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 310 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 309 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 311 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 310 | <kbd>esc</kbd> | 312 | <kbd>esc</kbd> | ||
| 311 | </button> | 313 | </button> | ||
| 312 | </div> | 314 | </div> | ||
| @@ -341,79 +343,79 @@ | |||||
| 341 | <div class="panel-head"> | 343 | <div class="panel-head"> | ||
| 342 | <label for="cmd-q" class="sr">go to</label> | 344 | <label for="cmd-q" class="sr">go to</label> | ||
| 343 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 345 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 344 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 346 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 345 | <kbd>esc</kbd> | 347 | <kbd>esc</kbd> | ||
| 346 | </button> | 348 | </button> | ||
| 347 | </div> | 349 | </div> | ||
| 348 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 350 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 349 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 351 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 350 | - | <a href="/" tabindex="-1"> | 352 | + | <a role="presentation" data-href="/"> |
| 351 | <span class="lbl">home</span> | 353 | <span class="lbl">home</span> | ||
| 352 | <span class="k">go</span> | 354 | <span class="k">go</span> | ||
| 353 | </a> | 355 | </a> | ||
| 354 | </li> | 356 | </li> | ||
| 355 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 357 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 356 | - | <a href="/files" tabindex="-1"> | 358 | + | <a role="presentation" data-href="/files"> |
| 357 | <span class="lbl">summary</span> | 359 | <span class="lbl">summary</span> | ||
| 358 | <span class="k">section</span> | 360 | <span class="k">section</span> | ||
| 359 | </a> | 361 | </a> | ||
| 360 | </li> | 362 | </li> | ||
| 361 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 363 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 362 | - | <a href="/files/tree/main" tabindex="-1"> | 364 | + | <a role="presentation" data-href="/files/tree/main"> |
| 363 | <span class="lbl">files</span> | 365 | <span class="lbl">files</span> | ||
| 364 | <span class="k">section</span> | 366 | <span class="k">section</span> | ||
| 365 | </a> | 367 | </a> | ||
| 366 | </li> | 368 | </li> | ||
| 367 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 369 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 368 | - | <a href="/files/commits/main" tabindex="-1"> | 370 | + | <a role="presentation" data-href="/files/commits/main"> |
| 369 | <span class="lbl">commits</span> | 371 | <span class="lbl">commits</span> | ||
| 370 | <span class="k">section</span> | 372 | <span class="k">section</span> | ||
| 371 | </a> | 373 | </a> | ||
| 372 | </li> | 374 | </li> | ||
| 373 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 375 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 374 | - | <a href="/files/refs" tabindex="-1"> | 376 | + | <a role="presentation" data-href="/files/refs"> |
| 375 | <span class="lbl">branches & tags</span> | 377 | <span class="lbl">branches & tags</span> | ||
| 376 | <span class="k">section</span> | 378 | <span class="k">section</span> | ||
| 377 | </a> | 379 | </a> | ||
| 378 | </li> | 380 | </li> | ||
| 379 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 381 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 380 | - | <a href="/files/merge-requests" tabindex="-1"> | 382 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 381 | <span class="lbl">merge requests</span> | 383 | <span class="lbl">merge requests</span> | ||
| 382 | <span class="k">section</span> | 384 | <span class="k">section</span> | ||
| 383 | </a> | 385 | </a> | ||
| 384 | </li> | 386 | </li> | ||
| 385 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 387 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 386 | - | <a href="/files/releases" tabindex="-1"> | 388 | + | <a role="presentation" data-href="/files/releases"> |
| 387 | <span class="lbl">releases</span> | 389 | <span class="lbl">releases</span> | ||
| 388 | <span class="k">section</span> | 390 | <span class="k">section</span> | ||
| 389 | </a> | 391 | </a> | ||
| 390 | </li> | 392 | </li> | ||
| 391 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 393 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 392 | - | <a href="/files/actions" tabindex="-1"> | 394 | + | <a role="presentation" data-href="/files/actions"> |
| 393 | <span class="lbl">actions</span> | 395 | <span class="lbl">actions</span> | ||
| 394 | <span class="k">section</span> | 396 | <span class="k">section</span> | ||
| 395 | </a> | 397 | </a> | ||
| 396 | </li> | 398 | </li> | ||
| 397 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 399 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 398 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 400 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 399 | <span class="lbl">feature/x</span> | 401 | <span class="lbl">feature/x</span> | ||
| 400 | <span class="k">branch</span> | 402 | <span class="k">branch</span> | ||
| 401 | </a> | 403 | </a> | ||
| 402 | </li> | 404 | </li> | ||
| 403 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 405 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 404 | - | <a href="/files/tree/main" tabindex="-1"> | 406 | + | <a role="presentation" data-href="/files/tree/main"> |
| 405 | <span class="lbl">main</span> | 407 | <span class="lbl">main</span> | ||
| 406 | <span class="k">branch</span> | 408 | <span class="k">branch</span> | ||
| 407 | </a> | 409 | </a> | ||
| 408 | </li> | 410 | </li> | ||
| 409 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 411 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 410 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 412 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 411 | <span class="lbl">v1.0</span> | 413 | <span class="lbl">v1.0</span> | ||
| 412 | <span class="k">tag</span> | 414 | <span class="k">tag</span> | ||
| 413 | </a> | 415 | </a> | ||
| 414 | </li> | 416 | </li> | ||
| 415 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 417 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 416 | - | <a href="#" data-fire="keys" tabindex="-1"> | 418 | + | <a role="presentation" data-fire="keys"> |
| 417 | <span class="lbl">turn single-key shortcuts off</span> | 419 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 418 | <span class="k">action</span> | 420 | <span class="k">action</span> | ||
| 419 | </a> | 421 | </a> | ||
M internal/app/testdata/web/blob-too-large.html +19 -17
| @@ -141,18 +141,20 @@ | |||
| 141 | 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 142 | 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 143 | 143 | </footer> | |
| 144 | - | <div class="hint" role="status" aria-live="polite"> | |
| 145 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 144 | + | <div class="hint"> | |
| 145 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 146 | 146 | </span> | |
| 147 | + | <span role="status" aria-live="polite"> | |
| 147 | 148 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 148 | 149 | </span> | |
| 149 | 150 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 150 | 151 | </span> | |
| 152 | + | </span> | |
| 151 | 153 | </div> | |
| 152 | 154 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 153 | 155 | <div class="panel-head"> | |
| 154 | 156 | <h2>Keyboard shortcuts</h2> | |
| 155 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 157 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 156 | 158 | <kbd>esc</kbd> close</button> | |
| 157 | 159 | </div> | |
| 158 | 160 | <div class="keys-pref"> | |
| @@ -286,7 +288,7 @@ | |||
| 286 | 288 | <div class="panel-head"> | |
| 287 | 289 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 288 | 290 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 289 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 291 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 290 | 292 | <kbd>esc</kbd> | |
| 291 | 293 | </button> | |
| 292 | 294 | </div> | |
| @@ -321,79 +323,79 @@ | |||
| 321 | 323 | <div class="panel-head"> | |
| 322 | 324 | <label for="cmd-q" class="sr">go to</label> | |
| 323 | 325 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 324 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 326 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 325 | 327 | <kbd>esc</kbd> | |
| 326 | 328 | </button> | |
| 327 | 329 | </div> | |
| 328 | 330 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 329 | 331 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 330 | - | <a href="/" tabindex="-1"> | |
| 332 | + | <a role="presentation" data-href="/"> | |
| 331 | 333 | <span class="lbl">home</span> | |
| 332 | 334 | <span class="k">go</span> | |
| 333 | 335 | </a> | |
| 334 | 336 | </li> | |
| 335 | 337 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 336 | - | <a href="/files" tabindex="-1"> | |
| 338 | + | <a role="presentation" data-href="/files"> | |
| 337 | 339 | <span class="lbl">summary</span> | |
| 338 | 340 | <span class="k">section</span> | |
| 339 | 341 | </a> | |
| 340 | 342 | </li> | |
| 341 | 343 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 342 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 344 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 343 | 345 | <span class="lbl">files</span> | |
| 344 | 346 | <span class="k">section</span> | |
| 345 | 347 | </a> | |
| 346 | 348 | </li> | |
| 347 | 349 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 348 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 350 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 349 | 351 | <span class="lbl">commits</span> | |
| 350 | 352 | <span class="k">section</span> | |
| 351 | 353 | </a> | |
| 352 | 354 | </li> | |
| 353 | 355 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 354 | - | <a href="/files/refs" tabindex="-1"> | |
| 356 | + | <a role="presentation" data-href="/files/refs"> | |
| 355 | 357 | <span class="lbl">branches & tags</span> | |
| 356 | 358 | <span class="k">section</span> | |
| 357 | 359 | </a> | |
| 358 | 360 | </li> | |
| 359 | 361 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 360 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 362 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 361 | 363 | <span class="lbl">merge requests</span> | |
| 362 | 364 | <span class="k">section</span> | |
| 363 | 365 | </a> | |
| 364 | 366 | </li> | |
| 365 | 367 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 366 | - | <a href="/files/releases" tabindex="-1"> | |
| 368 | + | <a role="presentation" data-href="/files/releases"> | |
| 367 | 369 | <span class="lbl">releases</span> | |
| 368 | 370 | <span class="k">section</span> | |
| 369 | 371 | </a> | |
| 370 | 372 | </li> | |
| 371 | 373 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 372 | - | <a href="/files/actions" tabindex="-1"> | |
| 374 | + | <a role="presentation" data-href="/files/actions"> | |
| 373 | 375 | <span class="lbl">actions</span> | |
| 374 | 376 | <span class="k">section</span> | |
| 375 | 377 | </a> | |
| 376 | 378 | </li> | |
| 377 | 379 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 378 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 380 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 379 | 381 | <span class="lbl">feature/x</span> | |
| 380 | 382 | <span class="k">branch</span> | |
| 381 | 383 | </a> | |
| 382 | 384 | </li> | |
| 383 | 385 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 384 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 386 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 385 | 387 | <span class="lbl">main</span> | |
| 386 | 388 | <span class="k">branch</span> | |
| 387 | 389 | </a> | |
| 388 | 390 | </li> | |
| 389 | 391 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 390 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 392 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 391 | 393 | <span class="lbl">v1.0</span> | |
| 392 | 394 | <span class="k">tag</span> | |
| 393 | 395 | </a> | |
| 394 | 396 | </li> | |
| 395 | 397 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 396 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 398 | + | <a role="presentation" data-fire="keys"> | |
| 397 | 399 | <span class="lbl">turn single-key shortcuts off</span> | |
| 398 | 400 | <span class="k">action</span> | |
| 399 | 401 | </a> | |
| @@ -141,18 +141,20 @@ | |||||
| 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 141 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 142 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 143 | </footer> | 143 | </footer> | ||
| 144 | - | <div class="hint" role="status" aria-live="polite"> | 144 | + | <div class="hint"> |
| 145 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 145 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 146 | </span> | 146 | </span> | ||
| 147 | + | <span role="status" aria-live="polite"> | |||
| 147 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 148 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 148 | </span> | 149 | </span> | ||
| 149 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 150 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 150 | </span> | 151 | </span> | ||
| 152 | + | </span> | |||
| 151 | </div> | 153 | </div> | ||
| 152 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 154 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 153 | <div class="panel-head"> | 155 | <div class="panel-head"> | ||
| 154 | <h2>Keyboard shortcuts</h2> | 156 | <h2>Keyboard shortcuts</h2> | ||
| 155 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 157 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 156 | <kbd>esc</kbd> close</button> | 158 | <kbd>esc</kbd> close</button> | ||
| 157 | </div> | 159 | </div> | ||
| 158 | <div class="keys-pref"> | 160 | <div class="keys-pref"> | ||
| @@ -286,7 +288,7 @@ | |||||
| 286 | <div class="panel-head"> | 288 | <div class="panel-head"> | ||
| 287 | <label for="refs-filter" class="sr">filter branches and tags</label> | 289 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 288 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 290 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 289 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 291 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 290 | <kbd>esc</kbd> | 292 | <kbd>esc</kbd> | ||
| 291 | </button> | 293 | </button> | ||
| 292 | </div> | 294 | </div> | ||
| @@ -321,79 +323,79 @@ | |||||
| 321 | <div class="panel-head"> | 323 | <div class="panel-head"> | ||
| 322 | <label for="cmd-q" class="sr">go to</label> | 324 | <label for="cmd-q" class="sr">go to</label> | ||
| 323 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 325 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 324 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 326 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 325 | <kbd>esc</kbd> | 327 | <kbd>esc</kbd> | ||
| 326 | </button> | 328 | </button> | ||
| 327 | </div> | 329 | </div> | ||
| 328 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 330 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 329 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 331 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 330 | - | <a href="/" tabindex="-1"> | 332 | + | <a role="presentation" data-href="/"> |
| 331 | <span class="lbl">home</span> | 333 | <span class="lbl">home</span> | ||
| 332 | <span class="k">go</span> | 334 | <span class="k">go</span> | ||
| 333 | </a> | 335 | </a> | ||
| 334 | </li> | 336 | </li> | ||
| 335 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 337 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 336 | - | <a href="/files" tabindex="-1"> | 338 | + | <a role="presentation" data-href="/files"> |
| 337 | <span class="lbl">summary</span> | 339 | <span class="lbl">summary</span> | ||
| 338 | <span class="k">section</span> | 340 | <span class="k">section</span> | ||
| 339 | </a> | 341 | </a> | ||
| 340 | </li> | 342 | </li> | ||
| 341 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 343 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 342 | - | <a href="/files/tree/main" tabindex="-1"> | 344 | + | <a role="presentation" data-href="/files/tree/main"> |
| 343 | <span class="lbl">files</span> | 345 | <span class="lbl">files</span> | ||
| 344 | <span class="k">section</span> | 346 | <span class="k">section</span> | ||
| 345 | </a> | 347 | </a> | ||
| 346 | </li> | 348 | </li> | ||
| 347 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 349 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 348 | - | <a href="/files/commits/main" tabindex="-1"> | 350 | + | <a role="presentation" data-href="/files/commits/main"> |
| 349 | <span class="lbl">commits</span> | 351 | <span class="lbl">commits</span> | ||
| 350 | <span class="k">section</span> | 352 | <span class="k">section</span> | ||
| 351 | </a> | 353 | </a> | ||
| 352 | </li> | 354 | </li> | ||
| 353 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 355 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 354 | - | <a href="/files/refs" tabindex="-1"> | 356 | + | <a role="presentation" data-href="/files/refs"> |
| 355 | <span class="lbl">branches & tags</span> | 357 | <span class="lbl">branches & tags</span> | ||
| 356 | <span class="k">section</span> | 358 | <span class="k">section</span> | ||
| 357 | </a> | 359 | </a> | ||
| 358 | </li> | 360 | </li> | ||
| 359 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 361 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 360 | - | <a href="/files/merge-requests" tabindex="-1"> | 362 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 361 | <span class="lbl">merge requests</span> | 363 | <span class="lbl">merge requests</span> | ||
| 362 | <span class="k">section</span> | 364 | <span class="k">section</span> | ||
| 363 | </a> | 365 | </a> | ||
| 364 | </li> | 366 | </li> | ||
| 365 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 367 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 366 | - | <a href="/files/releases" tabindex="-1"> | 368 | + | <a role="presentation" data-href="/files/releases"> |
| 367 | <span class="lbl">releases</span> | 369 | <span class="lbl">releases</span> | ||
| 368 | <span class="k">section</span> | 370 | <span class="k">section</span> | ||
| 369 | </a> | 371 | </a> | ||
| 370 | </li> | 372 | </li> | ||
| 371 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 373 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 372 | - | <a href="/files/actions" tabindex="-1"> | 374 | + | <a role="presentation" data-href="/files/actions"> |
| 373 | <span class="lbl">actions</span> | 375 | <span class="lbl">actions</span> | ||
| 374 | <span class="k">section</span> | 376 | <span class="k">section</span> | ||
| 375 | </a> | 377 | </a> | ||
| 376 | </li> | 378 | </li> | ||
| 377 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 379 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 378 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 380 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 379 | <span class="lbl">feature/x</span> | 381 | <span class="lbl">feature/x</span> | ||
| 380 | <span class="k">branch</span> | 382 | <span class="k">branch</span> | ||
| 381 | </a> | 383 | </a> | ||
| 382 | </li> | 384 | </li> | ||
| 383 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 385 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 384 | - | <a href="/files/tree/main" tabindex="-1"> | 386 | + | <a role="presentation" data-href="/files/tree/main"> |
| 385 | <span class="lbl">main</span> | 387 | <span class="lbl">main</span> | ||
| 386 | <span class="k">branch</span> | 388 | <span class="k">branch</span> | ||
| 387 | </a> | 389 | </a> | ||
| 388 | </li> | 390 | </li> | ||
| 389 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 391 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 390 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 392 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 391 | <span class="lbl">v1.0</span> | 393 | <span class="lbl">v1.0</span> | ||
| 392 | <span class="k">tag</span> | 394 | <span class="k">tag</span> | ||
| 393 | </a> | 395 | </a> | ||
| 394 | </li> | 396 | </li> | ||
| 395 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 397 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 396 | - | <a href="#" data-fire="keys" tabindex="-1"> | 398 | + | <a role="presentation" data-fire="keys"> |
| 397 | <span class="lbl">turn single-key shortcuts off</span> | 399 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 398 | <span class="k">action</span> | 400 | <span class="k">action</span> | ||
| 399 | </a> | 401 | </a> | ||
M internal/app/testdata/web/blob-trojan.html +19 -17
| @@ -208,18 +208,20 @@ | |||
| 208 | 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 209 | 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 210 | 210 | </footer> | |
| 211 | - | <div class="hint" role="status" aria-live="polite"> | |
| 212 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 211 | + | <div class="hint"> | |
| 212 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 213 | 213 | </span> | |
| 214 | + | <span role="status" aria-live="polite"> | |
| 214 | 215 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 215 | 216 | </span> | |
| 216 | 217 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 217 | 218 | </span> | |
| 219 | + | </span> | |
| 218 | 220 | </div> | |
| 219 | 221 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 220 | 222 | <div class="panel-head"> | |
| 221 | 223 | <h2>Keyboard shortcuts</h2> | |
| 222 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 224 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 223 | 225 | <kbd>esc</kbd> close</button> | |
| 224 | 226 | </div> | |
| 225 | 227 | <div class="keys-pref"> | |
| @@ -353,7 +355,7 @@ | |||
| 353 | 355 | <div class="panel-head"> | |
| 354 | 356 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 355 | 357 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 356 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 358 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 357 | 359 | <kbd>esc</kbd> | |
| 358 | 360 | </button> | |
| 359 | 361 | </div> | |
| @@ -388,79 +390,79 @@ | |||
| 388 | 390 | <div class="panel-head"> | |
| 389 | 391 | <label for="cmd-q" class="sr">go to</label> | |
| 390 | 392 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 391 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 393 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 392 | 394 | <kbd>esc</kbd> | |
| 393 | 395 | </button> | |
| 394 | 396 | </div> | |
| 395 | 397 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 396 | 398 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 397 | - | <a href="/" tabindex="-1"> | |
| 399 | + | <a role="presentation" data-href="/"> | |
| 398 | 400 | <span class="lbl">home</span> | |
| 399 | 401 | <span class="k">go</span> | |
| 400 | 402 | </a> | |
| 401 | 403 | </li> | |
| 402 | 404 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 403 | - | <a href="/files" tabindex="-1"> | |
| 405 | + | <a role="presentation" data-href="/files"> | |
| 404 | 406 | <span class="lbl">summary</span> | |
| 405 | 407 | <span class="k">section</span> | |
| 406 | 408 | </a> | |
| 407 | 409 | </li> | |
| 408 | 410 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 411 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 410 | 412 | <span class="lbl">files</span> | |
| 411 | 413 | <span class="k">section</span> | |
| 412 | 414 | </a> | |
| 413 | 415 | </li> | |
| 414 | 416 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 415 | - | <a href="/files/commits/main" tabindex="-1"> | |
| 417 | + | <a role="presentation" data-href="/files/commits/main"> | |
| 416 | 418 | <span class="lbl">commits</span> | |
| 417 | 419 | <span class="k">section</span> | |
| 418 | 420 | </a> | |
| 419 | 421 | </li> | |
| 420 | 422 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 421 | - | <a href="/files/refs" tabindex="-1"> | |
| 423 | + | <a role="presentation" data-href="/files/refs"> | |
| 422 | 424 | <span class="lbl">branches & tags</span> | |
| 423 | 425 | <span class="k">section</span> | |
| 424 | 426 | </a> | |
| 425 | 427 | </li> | |
| 426 | 428 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 427 | - | <a href="/files/merge-requests" tabindex="-1"> | |
| 429 | + | <a role="presentation" data-href="/files/merge-requests"> | |
| 428 | 430 | <span class="lbl">merge requests</span> | |
| 429 | 431 | <span class="k">section</span> | |
| 430 | 432 | </a> | |
| 431 | 433 | </li> | |
| 432 | 434 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 433 | - | <a href="/files/releases" tabindex="-1"> | |
| 435 | + | <a role="presentation" data-href="/files/releases"> | |
| 434 | 436 | <span class="lbl">releases</span> | |
| 435 | 437 | <span class="k">section</span> | |
| 436 | 438 | </a> | |
| 437 | 439 | </li> | |
| 438 | 440 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 439 | - | <a href="/files/actions" tabindex="-1"> | |
| 441 | + | <a role="presentation" data-href="/files/actions"> | |
| 440 | 442 | <span class="lbl">actions</span> | |
| 441 | 443 | <span class="k">section</span> | |
| 442 | 444 | </a> | |
| 443 | 445 | </li> | |
| 444 | 446 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 445 | - | <a href="/files/tree/feature/x" tabindex="-1"> | |
| 447 | + | <a role="presentation" data-href="/files/tree/feature/x"> | |
| 446 | 448 | <span class="lbl">feature/x</span> | |
| 447 | 449 | <span class="k">branch</span> | |
| 448 | 450 | </a> | |
| 449 | 451 | </li> | |
| 450 | 452 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 451 | - | <a href="/files/tree/main" tabindex="-1"> | |
| 453 | + | <a role="presentation" data-href="/files/tree/main"> | |
| 452 | 454 | <span class="lbl">main</span> | |
| 453 | 455 | <span class="k">branch</span> | |
| 454 | 456 | </a> | |
| 455 | 457 | </li> | |
| 456 | 458 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | |
| 457 | - | <a href="/files/tree/v1.0" tabindex="-1"> | |
| 459 | + | <a role="presentation" data-href="/files/tree/v1.0"> | |
| 458 | 460 | <span class="lbl">v1.0</span> | |
| 459 | 461 | <span class="k">tag</span> | |
| 460 | 462 | </a> | |
| 461 | 463 | </li> | |
| 462 | 464 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 463 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 465 | + | <a role="presentation" data-fire="keys"> | |
| 464 | 466 | <span class="lbl">turn single-key shortcuts off</span> | |
| 465 | 467 | <span class="k">action</span> | |
| 466 | 468 | </a> | |
| @@ -208,18 +208,20 @@ | |||||
| 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 208 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 209 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 210 | </footer> | 210 | </footer> | ||
| 211 | - | <div class="hint" role="status" aria-live="polite"> | 211 | + | <div class="hint"> |
| 212 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 212 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 213 | </span> | 213 | </span> | ||
| 214 | + | <span role="status" aria-live="polite"> | |||
| 214 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 215 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 215 | </span> | 216 | </span> | ||
| 216 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 217 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 217 | </span> | 218 | </span> | ||
| 219 | + | </span> | |||
| 218 | </div> | 220 | </div> | ||
| 219 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 221 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 220 | <div class="panel-head"> | 222 | <div class="panel-head"> | ||
| 221 | <h2>Keyboard shortcuts</h2> | 223 | <h2>Keyboard shortcuts</h2> | ||
| 222 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 224 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 223 | <kbd>esc</kbd> close</button> | 225 | <kbd>esc</kbd> close</button> | ||
| 224 | </div> | 226 | </div> | ||
| 225 | <div class="keys-pref"> | 227 | <div class="keys-pref"> | ||
| @@ -353,7 +355,7 @@ | |||||
| 353 | <div class="panel-head"> | 355 | <div class="panel-head"> | ||
| 354 | <label for="refs-filter" class="sr">filter branches and tags</label> | 356 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 355 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 357 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 356 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 358 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 357 | <kbd>esc</kbd> | 359 | <kbd>esc</kbd> | ||
| 358 | </button> | 360 | </button> | ||
| 359 | </div> | 361 | </div> | ||
| @@ -388,79 +390,79 @@ | |||||
| 388 | <div class="panel-head"> | 390 | <div class="panel-head"> | ||
| 389 | <label for="cmd-q" class="sr">go to</label> | 391 | <label for="cmd-q" class="sr">go to</label> | ||
| 390 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 392 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 391 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 393 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 392 | <kbd>esc</kbd> | 394 | <kbd>esc</kbd> | ||
| 393 | </button> | 395 | </button> | ||
| 394 | </div> | 396 | </div> | ||
| 395 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 397 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 396 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 398 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 397 | - | <a href="/" tabindex="-1"> | 399 | + | <a role="presentation" data-href="/"> |
| 398 | <span class="lbl">home</span> | 400 | <span class="lbl">home</span> | ||
| 399 | <span class="k">go</span> | 401 | <span class="k">go</span> | ||
| 400 | </a> | 402 | </a> | ||
| 401 | </li> | 403 | </li> | ||
| 402 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 404 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 403 | - | <a href="/files" tabindex="-1"> | 405 | + | <a role="presentation" data-href="/files"> |
| 404 | <span class="lbl">summary</span> | 406 | <span class="lbl">summary</span> | ||
| 405 | <span class="k">section</span> | 407 | <span class="k">section</span> | ||
| 406 | </a> | 408 | </a> | ||
| 407 | </li> | 409 | </li> | ||
| 408 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 410 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 409 | - | <a href="/files/tree/main" tabindex="-1"> | 411 | + | <a role="presentation" data-href="/files/tree/main"> |
| 410 | <span class="lbl">files</span> | 412 | <span class="lbl">files</span> | ||
| 411 | <span class="k">section</span> | 413 | <span class="k">section</span> | ||
| 412 | </a> | 414 | </a> | ||
| 413 | </li> | 415 | </li> | ||
| 414 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 416 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 415 | - | <a href="/files/commits/main" tabindex="-1"> | 417 | + | <a role="presentation" data-href="/files/commits/main"> |
| 416 | <span class="lbl">commits</span> | 418 | <span class="lbl">commits</span> | ||
| 417 | <span class="k">section</span> | 419 | <span class="k">section</span> | ||
| 418 | </a> | 420 | </a> | ||
| 419 | </li> | 421 | </li> | ||
| 420 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 422 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 421 | - | <a href="/files/refs" tabindex="-1"> | 423 | + | <a role="presentation" data-href="/files/refs"> |
| 422 | <span class="lbl">branches & tags</span> | 424 | <span class="lbl">branches & tags</span> | ||
| 423 | <span class="k">section</span> | 425 | <span class="k">section</span> | ||
| 424 | </a> | 426 | </a> | ||
| 425 | </li> | 427 | </li> | ||
| 426 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 428 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 427 | - | <a href="/files/merge-requests" tabindex="-1"> | 429 | + | <a role="presentation" data-href="/files/merge-requests"> |
| 428 | <span class="lbl">merge requests</span> | 430 | <span class="lbl">merge requests</span> | ||
| 429 | <span class="k">section</span> | 431 | <span class="k">section</span> | ||
| 430 | </a> | 432 | </a> | ||
| 431 | </li> | 433 | </li> | ||
| 432 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 434 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 433 | - | <a href="/files/releases" tabindex="-1"> | 435 | + | <a role="presentation" data-href="/files/releases"> |
| 434 | <span class="lbl">releases</span> | 436 | <span class="lbl">releases</span> | ||
| 435 | <span class="k">section</span> | 437 | <span class="k">section</span> | ||
| 436 | </a> | 438 | </a> | ||
| 437 | </li> | 439 | </li> | ||
| 438 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 440 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 439 | - | <a href="/files/actions" tabindex="-1"> | 441 | + | <a role="presentation" data-href="/files/actions"> |
| 440 | <span class="lbl">actions</span> | 442 | <span class="lbl">actions</span> | ||
| 441 | <span class="k">section</span> | 443 | <span class="k">section</span> | ||
| 442 | </a> | 444 | </a> | ||
| 443 | </li> | 445 | </li> | ||
| 444 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 446 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 445 | - | <a href="/files/tree/feature/x" tabindex="-1"> | 447 | + | <a role="presentation" data-href="/files/tree/feature/x"> |
| 446 | <span class="lbl">feature/x</span> | 448 | <span class="lbl">feature/x</span> | ||
| 447 | <span class="k">branch</span> | 449 | <span class="k">branch</span> | ||
| 448 | </a> | 450 | </a> | ||
| 449 | </li> | 451 | </li> | ||
| 450 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 452 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 451 | - | <a href="/files/tree/main" tabindex="-1"> | 453 | + | <a role="presentation" data-href="/files/tree/main"> |
| 452 | <span class="lbl">main</span> | 454 | <span class="lbl">main</span> | ||
| 453 | <span class="k">branch</span> | 455 | <span class="k">branch</span> | ||
| 454 | </a> | 456 | </a> | ||
| 455 | </li> | 457 | </li> | ||
| 456 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | 458 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0"> | ||
| 457 | - | <a href="/files/tree/v1.0" tabindex="-1"> | 459 | + | <a role="presentation" data-href="/files/tree/v1.0"> |
| 458 | <span class="lbl">v1.0</span> | 460 | <span class="lbl">v1.0</span> | ||
| 459 | <span class="k">tag</span> | 461 | <span class="k">tag</span> | ||
| 460 | </a> | 462 | </a> | ||
| 461 | </li> | 463 | </li> | ||
| 462 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 464 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 463 | - | <a href="#" data-fire="keys" tabindex="-1"> | 465 | + | <a role="presentation" data-fire="keys"> |
| 464 | <span class="lbl">turn single-key shortcuts off</span> | 466 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 465 | <span class="k">action</span> | 467 | <span class="k">action</span> | ||
| 466 | </a> | 468 | </a> | ||
M internal/app/testdata/web/commit-big.html +19 -17
| @@ -193,18 +193,20 @@ | |||
| 193 | 193 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 194 | 194 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 195 | 195 | </footer> | |
| 196 | - | <div class="hint" role="status" aria-live="polite"> | |
| 197 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 196 | + | <div class="hint"> | |
| 197 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 198 | 198 | </span> | |
| 199 | + | <span role="status" aria-live="polite"> | |
| 199 | 200 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 200 | 201 | </span> | |
| 201 | 202 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 202 | 203 | </span> | |
| 204 | + | </span> | |
| 203 | 205 | </div> | |
| 204 | 206 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 205 | 207 | <div class="panel-head"> | |
| 206 | 208 | <h2>Keyboard shortcuts</h2> | |
| 207 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 209 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 208 | 210 | <kbd>esc</kbd> close</button> | |
| 209 | 211 | </div> | |
| 210 | 212 | <div class="keys-pref"> | |
| @@ -338,7 +340,7 @@ | |||
| 338 | 340 | <div class="panel-head"> | |
| 339 | 341 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 340 | 342 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 341 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 343 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 342 | 344 | <kbd>esc</kbd> | |
| 343 | 345 | </button> | |
| 344 | 346 | </div> | |
| @@ -373,79 +375,79 @@ | |||
| 373 | 375 | <div class="panel-head"> | |
| 374 | 376 | <label for="cmd-q" class="sr">go to</label> | |
| 375 | 377 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 376 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 378 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 377 | 379 | <kbd>esc</kbd> | |
| 378 | 380 | </button> | |
| 379 | 381 | </div> | |
| 380 | 382 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 381 | 383 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 382 | - | <a href="/" tabindex="-1"> | |
| 384 | + | <a role="presentation" data-href="/"> | |
| 383 | 385 | <span class="lbl">home</span> | |
| 384 | 386 | <span class="k">go</span> | |
| 385 | 387 | </a> | |
| 386 | 388 | </li> | |
| 387 | 389 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 388 | - | <a href="/diffs" tabindex="-1"> | |
| 390 | + | <a role="presentation" data-href="/diffs"> | |
| 389 | 391 | <span class="lbl">summary</span> | |
| 390 | 392 | <span class="k">section</span> | |
| 391 | 393 | </a> | |
| 392 | 394 | </li> | |
| 393 | 395 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 394 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 396 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 395 | 397 | <span class="lbl">files</span> | |
| 396 | 398 | <span class="k">section</span> | |
| 397 | 399 | </a> | |
| 398 | 400 | </li> | |
| 399 | 401 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 400 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 402 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 401 | 403 | <span class="lbl">commits</span> | |
| 402 | 404 | <span class="k">section</span> | |
| 403 | 405 | </a> | |
| 404 | 406 | </li> | |
| 405 | 407 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 406 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 408 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 407 | 409 | <span class="lbl">branches & tags</span> | |
| 408 | 410 | <span class="k">section</span> | |
| 409 | 411 | </a> | |
| 410 | 412 | </li> | |
| 411 | 413 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 412 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 414 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 413 | 415 | <span class="lbl">merge requests</span> | |
| 414 | 416 | <span class="k">section</span> | |
| 415 | 417 | </a> | |
| 416 | 418 | </li> | |
| 417 | 419 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 418 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 420 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 419 | 421 | <span class="lbl">releases</span> | |
| 420 | 422 | <span class="k">section</span> | |
| 421 | 423 | </a> | |
| 422 | 424 | </li> | |
| 423 | 425 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 424 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 426 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 425 | 427 | <span class="lbl">actions</span> | |
| 426 | 428 | <span class="k">section</span> | |
| 427 | 429 | </a> | |
| 428 | 430 | </li> | |
| 429 | 431 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 430 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 432 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 431 | 433 | <span class="lbl">main</span> | |
| 432 | 434 | <span class="k">branch</span> | |
| 433 | 435 | </a> | |
| 434 | 436 | </li> | |
| 435 | 437 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 436 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 438 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 437 | 439 | <span class="lbl">side</span> | |
| 438 | 440 | <span class="k">branch</span> | |
| 439 | 441 | </a> | |
| 440 | 442 | </li> | |
| 441 | 443 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 442 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 444 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 443 | 445 | <span class="lbl">v1.0.0</span> | |
| 444 | 446 | <span class="k">tag</span> | |
| 445 | 447 | </a> | |
| 446 | 448 | </li> | |
| 447 | 449 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 448 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 450 | + | <a role="presentation" data-fire="keys"> | |
| 449 | 451 | <span class="lbl">turn single-key shortcuts off</span> | |
| 450 | 452 | <span class="k">action</span> | |
| 451 | 453 | </a> | |
| @@ -193,18 +193,20 @@ | |||||
| 193 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 193 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 194 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 194 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 195 | </footer> | 195 | </footer> | ||
| 196 | - | <div class="hint" role="status" aria-live="polite"> | 196 | + | <div class="hint"> |
| 197 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 197 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 198 | </span> | 198 | </span> | ||
| 199 | + | <span role="status" aria-live="polite"> | |||
| 199 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 200 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 200 | </span> | 201 | </span> | ||
| 201 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 202 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 202 | </span> | 203 | </span> | ||
| 204 | + | </span> | |||
| 203 | </div> | 205 | </div> | ||
| 204 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 206 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 205 | <div class="panel-head"> | 207 | <div class="panel-head"> | ||
| 206 | <h2>Keyboard shortcuts</h2> | 208 | <h2>Keyboard shortcuts</h2> | ||
| 207 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 209 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 208 | <kbd>esc</kbd> close</button> | 210 | <kbd>esc</kbd> close</button> | ||
| 209 | </div> | 211 | </div> | ||
| 210 | <div class="keys-pref"> | 212 | <div class="keys-pref"> | ||
| @@ -338,7 +340,7 @@ | |||||
| 338 | <div class="panel-head"> | 340 | <div class="panel-head"> | ||
| 339 | <label for="refs-filter" class="sr">filter branches and tags</label> | 341 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 340 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 342 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 341 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 343 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 342 | <kbd>esc</kbd> | 344 | <kbd>esc</kbd> | ||
| 343 | </button> | 345 | </button> | ||
| 344 | </div> | 346 | </div> | ||
| @@ -373,79 +375,79 @@ | |||||
| 373 | <div class="panel-head"> | 375 | <div class="panel-head"> | ||
| 374 | <label for="cmd-q" class="sr">go to</label> | 376 | <label for="cmd-q" class="sr">go to</label> | ||
| 375 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 377 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 376 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 378 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 377 | <kbd>esc</kbd> | 379 | <kbd>esc</kbd> | ||
| 378 | </button> | 380 | </button> | ||
| 379 | </div> | 381 | </div> | ||
| 380 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 382 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 381 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 383 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 382 | - | <a href="/" tabindex="-1"> | 384 | + | <a role="presentation" data-href="/"> |
| 383 | <span class="lbl">home</span> | 385 | <span class="lbl">home</span> | ||
| 384 | <span class="k">go</span> | 386 | <span class="k">go</span> | ||
| 385 | </a> | 387 | </a> | ||
| 386 | </li> | 388 | </li> | ||
| 387 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 389 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 388 | - | <a href="/diffs" tabindex="-1"> | 390 | + | <a role="presentation" data-href="/diffs"> |
| 389 | <span class="lbl">summary</span> | 391 | <span class="lbl">summary</span> | ||
| 390 | <span class="k">section</span> | 392 | <span class="k">section</span> | ||
| 391 | </a> | 393 | </a> | ||
| 392 | </li> | 394 | </li> | ||
| 393 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 395 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 394 | - | <a href="/diffs/tree/main" tabindex="-1"> | 396 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 395 | <span class="lbl">files</span> | 397 | <span class="lbl">files</span> | ||
| 396 | <span class="k">section</span> | 398 | <span class="k">section</span> | ||
| 397 | </a> | 399 | </a> | ||
| 398 | </li> | 400 | </li> | ||
| 399 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 401 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 400 | - | <a href="/diffs/commits/main" tabindex="-1"> | 402 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 401 | <span class="lbl">commits</span> | 403 | <span class="lbl">commits</span> | ||
| 402 | <span class="k">section</span> | 404 | <span class="k">section</span> | ||
| 403 | </a> | 405 | </a> | ||
| 404 | </li> | 406 | </li> | ||
| 405 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 407 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 406 | - | <a href="/diffs/refs" tabindex="-1"> | 408 | + | <a role="presentation" data-href="/diffs/refs"> |
| 407 | <span class="lbl">branches & tags</span> | 409 | <span class="lbl">branches & tags</span> | ||
| 408 | <span class="k">section</span> | 410 | <span class="k">section</span> | ||
| 409 | </a> | 411 | </a> | ||
| 410 | </li> | 412 | </li> | ||
| 411 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 413 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 412 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 414 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 413 | <span class="lbl">merge requests</span> | 415 | <span class="lbl">merge requests</span> | ||
| 414 | <span class="k">section</span> | 416 | <span class="k">section</span> | ||
| 415 | </a> | 417 | </a> | ||
| 416 | </li> | 418 | </li> | ||
| 417 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 419 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 418 | - | <a href="/diffs/releases" tabindex="-1"> | 420 | + | <a role="presentation" data-href="/diffs/releases"> |
| 419 | <span class="lbl">releases</span> | 421 | <span class="lbl">releases</span> | ||
| 420 | <span class="k">section</span> | 422 | <span class="k">section</span> | ||
| 421 | </a> | 423 | </a> | ||
| 422 | </li> | 424 | </li> | ||
| 423 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 425 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 424 | - | <a href="/diffs/actions" tabindex="-1"> | 426 | + | <a role="presentation" data-href="/diffs/actions"> |
| 425 | <span class="lbl">actions</span> | 427 | <span class="lbl">actions</span> | ||
| 426 | <span class="k">section</span> | 428 | <span class="k">section</span> | ||
| 427 | </a> | 429 | </a> | ||
| 428 | </li> | 430 | </li> | ||
| 429 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 431 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 430 | - | <a href="/diffs/tree/main" tabindex="-1"> | 432 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 431 | <span class="lbl">main</span> | 433 | <span class="lbl">main</span> | ||
| 432 | <span class="k">branch</span> | 434 | <span class="k">branch</span> | ||
| 433 | </a> | 435 | </a> | ||
| 434 | </li> | 436 | </li> | ||
| 435 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 437 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 436 | - | <a href="/diffs/tree/side" tabindex="-1"> | 438 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 437 | <span class="lbl">side</span> | 439 | <span class="lbl">side</span> | ||
| 438 | <span class="k">branch</span> | 440 | <span class="k">branch</span> | ||
| 439 | </a> | 441 | </a> | ||
| 440 | </li> | 442 | </li> | ||
| 441 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 443 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 442 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 444 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 443 | <span class="lbl">v1.0.0</span> | 445 | <span class="lbl">v1.0.0</span> | ||
| 444 | <span class="k">tag</span> | 446 | <span class="k">tag</span> | ||
| 445 | </a> | 447 | </a> | ||
| 446 | </li> | 448 | </li> | ||
| 447 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 449 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 448 | - | <a href="#" data-fire="keys" tabindex="-1"> | 450 | + | <a role="presentation" data-fire="keys"> |
| 449 | <span class="lbl">turn single-key shortcuts off</span> | 451 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 450 | <span class="k">action</span> | 452 | <span class="k">action</span> | ||
| 451 | </a> | 453 | </a> | ||
M internal/app/testdata/web/commit-binary.html +19 -17
| @@ -184,18 +184,20 @@ | |||
| 184 | 184 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 185 | 185 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 186 | 186 | </footer> | |
| 187 | - | <div class="hint" role="status" aria-live="polite"> | |
| 188 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 187 | + | <div class="hint"> | |
| 188 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 189 | 189 | </span> | |
| 190 | + | <span role="status" aria-live="polite"> | |
| 190 | 191 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 191 | 192 | </span> | |
| 192 | 193 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 193 | 194 | </span> | |
| 195 | + | </span> | |
| 194 | 196 | </div> | |
| 195 | 197 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 196 | 198 | <div class="panel-head"> | |
| 197 | 199 | <h2>Keyboard shortcuts</h2> | |
| 198 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 200 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 199 | 201 | <kbd>esc</kbd> close</button> | |
| 200 | 202 | </div> | |
| 201 | 203 | <div class="keys-pref"> | |
| @@ -329,7 +331,7 @@ | |||
| 329 | 331 | <div class="panel-head"> | |
| 330 | 332 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 331 | 333 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 332 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 334 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 333 | 335 | <kbd>esc</kbd> | |
| 334 | 336 | </button> | |
| 335 | 337 | </div> | |
| @@ -364,79 +366,79 @@ | |||
| 364 | 366 | <div class="panel-head"> | |
| 365 | 367 | <label for="cmd-q" class="sr">go to</label> | |
| 366 | 368 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 367 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 369 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 368 | 370 | <kbd>esc</kbd> | |
| 369 | 371 | </button> | |
| 370 | 372 | </div> | |
| 371 | 373 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 372 | 374 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 373 | - | <a href="/" tabindex="-1"> | |
| 375 | + | <a role="presentation" data-href="/"> | |
| 374 | 376 | <span class="lbl">home</span> | |
| 375 | 377 | <span class="k">go</span> | |
| 376 | 378 | </a> | |
| 377 | 379 | </li> | |
| 378 | 380 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 379 | - | <a href="/diffs" tabindex="-1"> | |
| 381 | + | <a role="presentation" data-href="/diffs"> | |
| 380 | 382 | <span class="lbl">summary</span> | |
| 381 | 383 | <span class="k">section</span> | |
| 382 | 384 | </a> | |
| 383 | 385 | </li> | |
| 384 | 386 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 385 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 387 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 386 | 388 | <span class="lbl">files</span> | |
| 387 | 389 | <span class="k">section</span> | |
| 388 | 390 | </a> | |
| 389 | 391 | </li> | |
| 390 | 392 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 391 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 393 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 392 | 394 | <span class="lbl">commits</span> | |
| 393 | 395 | <span class="k">section</span> | |
| 394 | 396 | </a> | |
| 395 | 397 | </li> | |
| 396 | 398 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 397 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 399 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 398 | 400 | <span class="lbl">branches & tags</span> | |
| 399 | 401 | <span class="k">section</span> | |
| 400 | 402 | </a> | |
| 401 | 403 | </li> | |
| 402 | 404 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 403 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 405 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 404 | 406 | <span class="lbl">merge requests</span> | |
| 405 | 407 | <span class="k">section</span> | |
| 406 | 408 | </a> | |
| 407 | 409 | </li> | |
| 408 | 410 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 409 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 411 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 410 | 412 | <span class="lbl">releases</span> | |
| 411 | 413 | <span class="k">section</span> | |
| 412 | 414 | </a> | |
| 413 | 415 | </li> | |
| 414 | 416 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 415 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 417 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 416 | 418 | <span class="lbl">actions</span> | |
| 417 | 419 | <span class="k">section</span> | |
| 418 | 420 | </a> | |
| 419 | 421 | </li> | |
| 420 | 422 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 421 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 423 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 422 | 424 | <span class="lbl">main</span> | |
| 423 | 425 | <span class="k">branch</span> | |
| 424 | 426 | </a> | |
| 425 | 427 | </li> | |
| 426 | 428 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 427 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 429 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 428 | 430 | <span class="lbl">side</span> | |
| 429 | 431 | <span class="k">branch</span> | |
| 430 | 432 | </a> | |
| 431 | 433 | </li> | |
| 432 | 434 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 433 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 435 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 434 | 436 | <span class="lbl">v1.0.0</span> | |
| 435 | 437 | <span class="k">tag</span> | |
| 436 | 438 | </a> | |
| 437 | 439 | </li> | |
| 438 | 440 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 439 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 441 | + | <a role="presentation" data-fire="keys"> | |
| 440 | 442 | <span class="lbl">turn single-key shortcuts off</span> | |
| 441 | 443 | <span class="k">action</span> | |
| 442 | 444 | </a> | |
| @@ -184,18 +184,20 @@ | |||||
| 184 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 184 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 185 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 185 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 186 | </footer> | 186 | </footer> | ||
| 187 | - | <div class="hint" role="status" aria-live="polite"> | 187 | + | <div class="hint"> |
| 188 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 188 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 189 | </span> | 189 | </span> | ||
| 190 | + | <span role="status" aria-live="polite"> | |||
| 190 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 191 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 191 | </span> | 192 | </span> | ||
| 192 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 193 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 193 | </span> | 194 | </span> | ||
| 195 | + | </span> | |||
| 194 | </div> | 196 | </div> | ||
| 195 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 197 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 196 | <div class="panel-head"> | 198 | <div class="panel-head"> | ||
| 197 | <h2>Keyboard shortcuts</h2> | 199 | <h2>Keyboard shortcuts</h2> | ||
| 198 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 200 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 199 | <kbd>esc</kbd> close</button> | 201 | <kbd>esc</kbd> close</button> | ||
| 200 | </div> | 202 | </div> | ||
| 201 | <div class="keys-pref"> | 203 | <div class="keys-pref"> | ||
| @@ -329,7 +331,7 @@ | |||||
| 329 | <div class="panel-head"> | 331 | <div class="panel-head"> | ||
| 330 | <label for="refs-filter" class="sr">filter branches and tags</label> | 332 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 331 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 333 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 332 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 334 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 333 | <kbd>esc</kbd> | 335 | <kbd>esc</kbd> | ||
| 334 | </button> | 336 | </button> | ||
| 335 | </div> | 337 | </div> | ||
| @@ -364,79 +366,79 @@ | |||||
| 364 | <div class="panel-head"> | 366 | <div class="panel-head"> | ||
| 365 | <label for="cmd-q" class="sr">go to</label> | 367 | <label for="cmd-q" class="sr">go to</label> | ||
| 366 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 368 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 367 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 369 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 368 | <kbd>esc</kbd> | 370 | <kbd>esc</kbd> | ||
| 369 | </button> | 371 | </button> | ||
| 370 | </div> | 372 | </div> | ||
| 371 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 373 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 372 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 374 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 373 | - | <a href="/" tabindex="-1"> | 375 | + | <a role="presentation" data-href="/"> |
| 374 | <span class="lbl">home</span> | 376 | <span class="lbl">home</span> | ||
| 375 | <span class="k">go</span> | 377 | <span class="k">go</span> | ||
| 376 | </a> | 378 | </a> | ||
| 377 | </li> | 379 | </li> | ||
| 378 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 380 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 379 | - | <a href="/diffs" tabindex="-1"> | 381 | + | <a role="presentation" data-href="/diffs"> |
| 380 | <span class="lbl">summary</span> | 382 | <span class="lbl">summary</span> | ||
| 381 | <span class="k">section</span> | 383 | <span class="k">section</span> | ||
| 382 | </a> | 384 | </a> | ||
| 383 | </li> | 385 | </li> | ||
| 384 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 386 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 385 | - | <a href="/diffs/tree/main" tabindex="-1"> | 387 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 386 | <span class="lbl">files</span> | 388 | <span class="lbl">files</span> | ||
| 387 | <span class="k">section</span> | 389 | <span class="k">section</span> | ||
| 388 | </a> | 390 | </a> | ||
| 389 | </li> | 391 | </li> | ||
| 390 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 392 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 391 | - | <a href="/diffs/commits/main" tabindex="-1"> | 393 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 392 | <span class="lbl">commits</span> | 394 | <span class="lbl">commits</span> | ||
| 393 | <span class="k">section</span> | 395 | <span class="k">section</span> | ||
| 394 | </a> | 396 | </a> | ||
| 395 | </li> | 397 | </li> | ||
| 396 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 398 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 397 | - | <a href="/diffs/refs" tabindex="-1"> | 399 | + | <a role="presentation" data-href="/diffs/refs"> |
| 398 | <span class="lbl">branches & tags</span> | 400 | <span class="lbl">branches & tags</span> | ||
| 399 | <span class="k">section</span> | 401 | <span class="k">section</span> | ||
| 400 | </a> | 402 | </a> | ||
| 401 | </li> | 403 | </li> | ||
| 402 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 404 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 403 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 405 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 404 | <span class="lbl">merge requests</span> | 406 | <span class="lbl">merge requests</span> | ||
| 405 | <span class="k">section</span> | 407 | <span class="k">section</span> | ||
| 406 | </a> | 408 | </a> | ||
| 407 | </li> | 409 | </li> | ||
| 408 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 410 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 409 | - | <a href="/diffs/releases" tabindex="-1"> | 411 | + | <a role="presentation" data-href="/diffs/releases"> |
| 410 | <span class="lbl">releases</span> | 412 | <span class="lbl">releases</span> | ||
| 411 | <span class="k">section</span> | 413 | <span class="k">section</span> | ||
| 412 | </a> | 414 | </a> | ||
| 413 | </li> | 415 | </li> | ||
| 414 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 416 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 415 | - | <a href="/diffs/actions" tabindex="-1"> | 417 | + | <a role="presentation" data-href="/diffs/actions"> |
| 416 | <span class="lbl">actions</span> | 418 | <span class="lbl">actions</span> | ||
| 417 | <span class="k">section</span> | 419 | <span class="k">section</span> | ||
| 418 | </a> | 420 | </a> | ||
| 419 | </li> | 421 | </li> | ||
| 420 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 422 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 421 | - | <a href="/diffs/tree/main" tabindex="-1"> | 423 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 422 | <span class="lbl">main</span> | 424 | <span class="lbl">main</span> | ||
| 423 | <span class="k">branch</span> | 425 | <span class="k">branch</span> | ||
| 424 | </a> | 426 | </a> | ||
| 425 | </li> | 427 | </li> | ||
| 426 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 428 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 427 | - | <a href="/diffs/tree/side" tabindex="-1"> | 429 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 428 | <span class="lbl">side</span> | 430 | <span class="lbl">side</span> | ||
| 429 | <span class="k">branch</span> | 431 | <span class="k">branch</span> | ||
| 430 | </a> | 432 | </a> | ||
| 431 | </li> | 433 | </li> | ||
| 432 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 434 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 433 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 435 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 434 | <span class="lbl">v1.0.0</span> | 436 | <span class="lbl">v1.0.0</span> | ||
| 435 | <span class="k">tag</span> | 437 | <span class="k">tag</span> | ||
| 436 | </a> | 438 | </a> | ||
| 437 | </li> | 439 | </li> | ||
| 438 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 440 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 439 | - | <a href="#" data-fire="keys" tabindex="-1"> | 441 | + | <a role="presentation" data-fire="keys"> |
| 440 | <span class="lbl">turn single-key shortcuts off</span> | 442 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 441 | <span class="k">action</span> | 443 | <span class="k">action</span> | ||
| 442 | </a> | 444 | </a> | ||
M internal/app/testdata/web/commit-merge.html +19 -17
| @@ -226,18 +226,20 @@ | |||
| 226 | 226 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 227 | 227 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 228 | 228 | </footer> | |
| 229 | - | <div class="hint" role="status" aria-live="polite"> | |
| 230 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 229 | + | <div class="hint"> | |
| 230 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 231 | 231 | </span> | |
| 232 | + | <span role="status" aria-live="polite"> | |
| 232 | 233 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 233 | 234 | </span> | |
| 234 | 235 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 235 | 236 | </span> | |
| 237 | + | </span> | |
| 236 | 238 | </div> | |
| 237 | 239 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 238 | 240 | <div class="panel-head"> | |
| 239 | 241 | <h2>Keyboard shortcuts</h2> | |
| 240 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 242 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 241 | 243 | <kbd>esc</kbd> close</button> | |
| 242 | 244 | </div> | |
| 243 | 245 | <div class="keys-pref"> | |
| @@ -371,7 +373,7 @@ | |||
| 371 | 373 | <div class="panel-head"> | |
| 372 | 374 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 373 | 375 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 374 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 376 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 375 | 377 | <kbd>esc</kbd> | |
| 376 | 378 | </button> | |
| 377 | 379 | </div> | |
| @@ -406,79 +408,79 @@ | |||
| 406 | 408 | <div class="panel-head"> | |
| 407 | 409 | <label for="cmd-q" class="sr">go to</label> | |
| 408 | 410 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 409 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 411 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 410 | 412 | <kbd>esc</kbd> | |
| 411 | 413 | </button> | |
| 412 | 414 | </div> | |
| 413 | 415 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 414 | 416 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 415 | - | <a href="/" tabindex="-1"> | |
| 417 | + | <a role="presentation" data-href="/"> | |
| 416 | 418 | <span class="lbl">home</span> | |
| 417 | 419 | <span class="k">go</span> | |
| 418 | 420 | </a> | |
| 419 | 421 | </li> | |
| 420 | 422 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 421 | - | <a href="/diffs" tabindex="-1"> | |
| 423 | + | <a role="presentation" data-href="/diffs"> | |
| 422 | 424 | <span class="lbl">summary</span> | |
| 423 | 425 | <span class="k">section</span> | |
| 424 | 426 | </a> | |
| 425 | 427 | </li> | |
| 426 | 428 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 427 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 429 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 428 | 430 | <span class="lbl">files</span> | |
| 429 | 431 | <span class="k">section</span> | |
| 430 | 432 | </a> | |
| 431 | 433 | </li> | |
| 432 | 434 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 433 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 435 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 434 | 436 | <span class="lbl">commits</span> | |
| 435 | 437 | <span class="k">section</span> | |
| 436 | 438 | </a> | |
| 437 | 439 | </li> | |
| 438 | 440 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 439 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 441 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 440 | 442 | <span class="lbl">branches & tags</span> | |
| 441 | 443 | <span class="k">section</span> | |
| 442 | 444 | </a> | |
| 443 | 445 | </li> | |
| 444 | 446 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 445 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 447 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 446 | 448 | <span class="lbl">merge requests</span> | |
| 447 | 449 | <span class="k">section</span> | |
| 448 | 450 | </a> | |
| 449 | 451 | </li> | |
| 450 | 452 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 451 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 453 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 452 | 454 | <span class="lbl">releases</span> | |
| 453 | 455 | <span class="k">section</span> | |
| 454 | 456 | </a> | |
| 455 | 457 | </li> | |
| 456 | 458 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 457 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 459 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 458 | 460 | <span class="lbl">actions</span> | |
| 459 | 461 | <span class="k">section</span> | |
| 460 | 462 | </a> | |
| 461 | 463 | </li> | |
| 462 | 464 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 463 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 465 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 464 | 466 | <span class="lbl">main</span> | |
| 465 | 467 | <span class="k">branch</span> | |
| 466 | 468 | </a> | |
| 467 | 469 | </li> | |
| 468 | 470 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 469 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 471 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 470 | 472 | <span class="lbl">side</span> | |
| 471 | 473 | <span class="k">branch</span> | |
| 472 | 474 | </a> | |
| 473 | 475 | </li> | |
| 474 | 476 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 475 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 477 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 476 | 478 | <span class="lbl">v1.0.0</span> | |
| 477 | 479 | <span class="k">tag</span> | |
| 478 | 480 | </a> | |
| 479 | 481 | </li> | |
| 480 | 482 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 481 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 483 | + | <a role="presentation" data-fire="keys"> | |
| 482 | 484 | <span class="lbl">turn single-key shortcuts off</span> | |
| 483 | 485 | <span class="k">action</span> | |
| 484 | 486 | </a> | |
| @@ -226,18 +226,20 @@ | |||||
| 226 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 226 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 227 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 227 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 228 | </footer> | 228 | </footer> | ||
| 229 | - | <div class="hint" role="status" aria-live="polite"> | 229 | + | <div class="hint"> |
| 230 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 230 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 231 | </span> | 231 | </span> | ||
| 232 | + | <span role="status" aria-live="polite"> | |||
| 232 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 233 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 233 | </span> | 234 | </span> | ||
| 234 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 235 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 235 | </span> | 236 | </span> | ||
| 237 | + | </span> | |||
| 236 | </div> | 238 | </div> | ||
| 237 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 239 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 238 | <div class="panel-head"> | 240 | <div class="panel-head"> | ||
| 239 | <h2>Keyboard shortcuts</h2> | 241 | <h2>Keyboard shortcuts</h2> | ||
| 240 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 242 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 241 | <kbd>esc</kbd> close</button> | 243 | <kbd>esc</kbd> close</button> | ||
| 242 | </div> | 244 | </div> | ||
| 243 | <div class="keys-pref"> | 245 | <div class="keys-pref"> | ||
| @@ -371,7 +373,7 @@ | |||||
| 371 | <div class="panel-head"> | 373 | <div class="panel-head"> | ||
| 372 | <label for="refs-filter" class="sr">filter branches and tags</label> | 374 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 373 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 375 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 374 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 376 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 375 | <kbd>esc</kbd> | 377 | <kbd>esc</kbd> | ||
| 376 | </button> | 378 | </button> | ||
| 377 | </div> | 379 | </div> | ||
| @@ -406,79 +408,79 @@ | |||||
| 406 | <div class="panel-head"> | 408 | <div class="panel-head"> | ||
| 407 | <label for="cmd-q" class="sr">go to</label> | 409 | <label for="cmd-q" class="sr">go to</label> | ||
| 408 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 410 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 409 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 411 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 410 | <kbd>esc</kbd> | 412 | <kbd>esc</kbd> | ||
| 411 | </button> | 413 | </button> | ||
| 412 | </div> | 414 | </div> | ||
| 413 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 415 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 414 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 416 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 415 | - | <a href="/" tabindex="-1"> | 417 | + | <a role="presentation" data-href="/"> |
| 416 | <span class="lbl">home</span> | 418 | <span class="lbl">home</span> | ||
| 417 | <span class="k">go</span> | 419 | <span class="k">go</span> | ||
| 418 | </a> | 420 | </a> | ||
| 419 | </li> | 421 | </li> | ||
| 420 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 422 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 421 | - | <a href="/diffs" tabindex="-1"> | 423 | + | <a role="presentation" data-href="/diffs"> |
| 422 | <span class="lbl">summary</span> | 424 | <span class="lbl">summary</span> | ||
| 423 | <span class="k">section</span> | 425 | <span class="k">section</span> | ||
| 424 | </a> | 426 | </a> | ||
| 425 | </li> | 427 | </li> | ||
| 426 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 428 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 427 | - | <a href="/diffs/tree/main" tabindex="-1"> | 429 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 428 | <span class="lbl">files</span> | 430 | <span class="lbl">files</span> | ||
| 429 | <span class="k">section</span> | 431 | <span class="k">section</span> | ||
| 430 | </a> | 432 | </a> | ||
| 431 | </li> | 433 | </li> | ||
| 432 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 434 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 433 | - | <a href="/diffs/commits/main" tabindex="-1"> | 435 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 434 | <span class="lbl">commits</span> | 436 | <span class="lbl">commits</span> | ||
| 435 | <span class="k">section</span> | 437 | <span class="k">section</span> | ||
| 436 | </a> | 438 | </a> | ||
| 437 | </li> | 439 | </li> | ||
| 438 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 440 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 439 | - | <a href="/diffs/refs" tabindex="-1"> | 441 | + | <a role="presentation" data-href="/diffs/refs"> |
| 440 | <span class="lbl">branches & tags</span> | 442 | <span class="lbl">branches & tags</span> | ||
| 441 | <span class="k">section</span> | 443 | <span class="k">section</span> | ||
| 442 | </a> | 444 | </a> | ||
| 443 | </li> | 445 | </li> | ||
| 444 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 446 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 445 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 447 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 446 | <span class="lbl">merge requests</span> | 448 | <span class="lbl">merge requests</span> | ||
| 447 | <span class="k">section</span> | 449 | <span class="k">section</span> | ||
| 448 | </a> | 450 | </a> | ||
| 449 | </li> | 451 | </li> | ||
| 450 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 452 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 451 | - | <a href="/diffs/releases" tabindex="-1"> | 453 | + | <a role="presentation" data-href="/diffs/releases"> |
| 452 | <span class="lbl">releases</span> | 454 | <span class="lbl">releases</span> | ||
| 453 | <span class="k">section</span> | 455 | <span class="k">section</span> | ||
| 454 | </a> | 456 | </a> | ||
| 455 | </li> | 457 | </li> | ||
| 456 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 458 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 457 | - | <a href="/diffs/actions" tabindex="-1"> | 459 | + | <a role="presentation" data-href="/diffs/actions"> |
| 458 | <span class="lbl">actions</span> | 460 | <span class="lbl">actions</span> | ||
| 459 | <span class="k">section</span> | 461 | <span class="k">section</span> | ||
| 460 | </a> | 462 | </a> | ||
| 461 | </li> | 463 | </li> | ||
| 462 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 464 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 463 | - | <a href="/diffs/tree/main" tabindex="-1"> | 465 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 464 | <span class="lbl">main</span> | 466 | <span class="lbl">main</span> | ||
| 465 | <span class="k">branch</span> | 467 | <span class="k">branch</span> | ||
| 466 | </a> | 468 | </a> | ||
| 467 | </li> | 469 | </li> | ||
| 468 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 470 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 469 | - | <a href="/diffs/tree/side" tabindex="-1"> | 471 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 470 | <span class="lbl">side</span> | 472 | <span class="lbl">side</span> | ||
| 471 | <span class="k">branch</span> | 473 | <span class="k">branch</span> | ||
| 472 | </a> | 474 | </a> | ||
| 473 | </li> | 475 | </li> | ||
| 474 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 476 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 475 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 477 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 476 | <span class="lbl">v1.0.0</span> | 478 | <span class="lbl">v1.0.0</span> | ||
| 477 | <span class="k">tag</span> | 479 | <span class="k">tag</span> | ||
| 478 | </a> | 480 | </a> | ||
| 479 | </li> | 481 | </li> | ||
| 480 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 482 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 481 | - | <a href="#" data-fire="keys" tabindex="-1"> | 483 | + | <a role="presentation" data-fire="keys"> |
| 482 | <span class="lbl">turn single-key shortcuts off</span> | 484 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 483 | <span class="k">action</span> | 485 | <span class="k">action</span> | ||
| 484 | </a> | 486 | </a> | ||
M internal/app/testdata/web/commit-modify-split.html +19 -17
| @@ -349,18 +349,20 @@ And <b>html</b> & "quotes".</pre> | |||
| 349 | 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 350 | 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 351 | 351 | </footer> | |
| 352 | - | <div class="hint" role="status" aria-live="polite"> | |
| 353 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 352 | + | <div class="hint"> | |
| 353 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 354 | 354 | </span> | |
| 355 | + | <span role="status" aria-live="polite"> | |
| 355 | 356 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 356 | 357 | </span> | |
| 357 | 358 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 358 | 359 | </span> | |
| 360 | + | </span> | |
| 359 | 361 | </div> | |
| 360 | 362 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 361 | 363 | <div class="panel-head"> | |
| 362 | 364 | <h2>Keyboard shortcuts</h2> | |
| 363 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 365 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 364 | 366 | <kbd>esc</kbd> close</button> | |
| 365 | 367 | </div> | |
| 366 | 368 | <div class="keys-pref"> | |
| @@ -494,7 +496,7 @@ And <b>html</b> & "quotes".</pre> | |||
| 494 | 496 | <div class="panel-head"> | |
| 495 | 497 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 496 | 498 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 497 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 499 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 498 | 500 | <kbd>esc</kbd> | |
| 499 | 501 | </button> | |
| 500 | 502 | </div> | |
| @@ -529,79 +531,79 @@ And <b>html</b> & "quotes".</pre> | |||
| 529 | 531 | <div class="panel-head"> | |
| 530 | 532 | <label for="cmd-q" class="sr">go to</label> | |
| 531 | 533 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 532 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 534 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 533 | 535 | <kbd>esc</kbd> | |
| 534 | 536 | </button> | |
| 535 | 537 | </div> | |
| 536 | 538 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 537 | 539 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 538 | - | <a href="/" tabindex="-1"> | |
| 540 | + | <a role="presentation" data-href="/"> | |
| 539 | 541 | <span class="lbl">home</span> | |
| 540 | 542 | <span class="k">go</span> | |
| 541 | 543 | </a> | |
| 542 | 544 | </li> | |
| 543 | 545 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 544 | - | <a href="/diffs" tabindex="-1"> | |
| 546 | + | <a role="presentation" data-href="/diffs"> | |
| 545 | 547 | <span class="lbl">summary</span> | |
| 546 | 548 | <span class="k">section</span> | |
| 547 | 549 | </a> | |
| 548 | 550 | </li> | |
| 549 | 551 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 550 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 552 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 551 | 553 | <span class="lbl">files</span> | |
| 552 | 554 | <span class="k">section</span> | |
| 553 | 555 | </a> | |
| 554 | 556 | </li> | |
| 555 | 557 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 556 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 558 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 557 | 559 | <span class="lbl">commits</span> | |
| 558 | 560 | <span class="k">section</span> | |
| 559 | 561 | </a> | |
| 560 | 562 | </li> | |
| 561 | 563 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 562 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 564 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 563 | 565 | <span class="lbl">branches & tags</span> | |
| 564 | 566 | <span class="k">section</span> | |
| 565 | 567 | </a> | |
| 566 | 568 | </li> | |
| 567 | 569 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 568 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 570 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 569 | 571 | <span class="lbl">merge requests</span> | |
| 570 | 572 | <span class="k">section</span> | |
| 571 | 573 | </a> | |
| 572 | 574 | </li> | |
| 573 | 575 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 574 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 576 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 575 | 577 | <span class="lbl">releases</span> | |
| 576 | 578 | <span class="k">section</span> | |
| 577 | 579 | </a> | |
| 578 | 580 | </li> | |
| 579 | 581 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 580 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 582 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 581 | 583 | <span class="lbl">actions</span> | |
| 582 | 584 | <span class="k">section</span> | |
| 583 | 585 | </a> | |
| 584 | 586 | </li> | |
| 585 | 587 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 586 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 588 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 587 | 589 | <span class="lbl">main</span> | |
| 588 | 590 | <span class="k">branch</span> | |
| 589 | 591 | </a> | |
| 590 | 592 | </li> | |
| 591 | 593 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 592 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 594 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 593 | 595 | <span class="lbl">side</span> | |
| 594 | 596 | <span class="k">branch</span> | |
| 595 | 597 | </a> | |
| 596 | 598 | </li> | |
| 597 | 599 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 598 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 600 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 599 | 601 | <span class="lbl">v1.0.0</span> | |
| 600 | 602 | <span class="k">tag</span> | |
| 601 | 603 | </a> | |
| 602 | 604 | </li> | |
| 603 | 605 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 604 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 606 | + | <a role="presentation" data-fire="keys"> | |
| 605 | 607 | <span class="lbl">turn single-key shortcuts off</span> | |
| 606 | 608 | <span class="k">action</span> | |
| 607 | 609 | </a> | |
| @@ -349,18 +349,20 @@ And <b>html</b> & "quotes".</pre> | |||||
| 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 351 | </footer> | 351 | </footer> | ||
| 352 | - | <div class="hint" role="status" aria-live="polite"> | 352 | + | <div class="hint"> |
| 353 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 353 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 354 | </span> | 354 | </span> | ||
| 355 | + | <span role="status" aria-live="polite"> | |||
| 355 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 356 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 356 | </span> | 357 | </span> | ||
| 357 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 358 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 358 | </span> | 359 | </span> | ||
| 360 | + | </span> | |||
| 359 | </div> | 361 | </div> | ||
| 360 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 362 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 361 | <div class="panel-head"> | 363 | <div class="panel-head"> | ||
| 362 | <h2>Keyboard shortcuts</h2> | 364 | <h2>Keyboard shortcuts</h2> | ||
| 363 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 365 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 364 | <kbd>esc</kbd> close</button> | 366 | <kbd>esc</kbd> close</button> | ||
| 365 | </div> | 367 | </div> | ||
| 366 | <div class="keys-pref"> | 368 | <div class="keys-pref"> | ||
| @@ -494,7 +496,7 @@ And <b>html</b> & "quotes".</pre> | |||||
| 494 | <div class="panel-head"> | 496 | <div class="panel-head"> | ||
| 495 | <label for="refs-filter" class="sr">filter branches and tags</label> | 497 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 496 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 498 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 497 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 499 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 498 | <kbd>esc</kbd> | 500 | <kbd>esc</kbd> | ||
| 499 | </button> | 501 | </button> | ||
| 500 | </div> | 502 | </div> | ||
| @@ -529,79 +531,79 @@ And <b>html</b> & "quotes".</pre> | |||||
| 529 | <div class="panel-head"> | 531 | <div class="panel-head"> | ||
| 530 | <label for="cmd-q" class="sr">go to</label> | 532 | <label for="cmd-q" class="sr">go to</label> | ||
| 531 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 533 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 532 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 534 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 533 | <kbd>esc</kbd> | 535 | <kbd>esc</kbd> | ||
| 534 | </button> | 536 | </button> | ||
| 535 | </div> | 537 | </div> | ||
| 536 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 538 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 537 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 539 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 538 | - | <a href="/" tabindex="-1"> | 540 | + | <a role="presentation" data-href="/"> |
| 539 | <span class="lbl">home</span> | 541 | <span class="lbl">home</span> | ||
| 540 | <span class="k">go</span> | 542 | <span class="k">go</span> | ||
| 541 | </a> | 543 | </a> | ||
| 542 | </li> | 544 | </li> | ||
| 543 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 545 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 544 | - | <a href="/diffs" tabindex="-1"> | 546 | + | <a role="presentation" data-href="/diffs"> |
| 545 | <span class="lbl">summary</span> | 547 | <span class="lbl">summary</span> | ||
| 546 | <span class="k">section</span> | 548 | <span class="k">section</span> | ||
| 547 | </a> | 549 | </a> | ||
| 548 | </li> | 550 | </li> | ||
| 549 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 551 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 550 | - | <a href="/diffs/tree/main" tabindex="-1"> | 552 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 551 | <span class="lbl">files</span> | 553 | <span class="lbl">files</span> | ||
| 552 | <span class="k">section</span> | 554 | <span class="k">section</span> | ||
| 553 | </a> | 555 | </a> | ||
| 554 | </li> | 556 | </li> | ||
| 555 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 557 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 556 | - | <a href="/diffs/commits/main" tabindex="-1"> | 558 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 557 | <span class="lbl">commits</span> | 559 | <span class="lbl">commits</span> | ||
| 558 | <span class="k">section</span> | 560 | <span class="k">section</span> | ||
| 559 | </a> | 561 | </a> | ||
| 560 | </li> | 562 | </li> | ||
| 561 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 563 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 562 | - | <a href="/diffs/refs" tabindex="-1"> | 564 | + | <a role="presentation" data-href="/diffs/refs"> |
| 563 | <span class="lbl">branches & tags</span> | 565 | <span class="lbl">branches & tags</span> | ||
| 564 | <span class="k">section</span> | 566 | <span class="k">section</span> | ||
| 565 | </a> | 567 | </a> | ||
| 566 | </li> | 568 | </li> | ||
| 567 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 569 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 568 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 570 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 569 | <span class="lbl">merge requests</span> | 571 | <span class="lbl">merge requests</span> | ||
| 570 | <span class="k">section</span> | 572 | <span class="k">section</span> | ||
| 571 | </a> | 573 | </a> | ||
| 572 | </li> | 574 | </li> | ||
| 573 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 575 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 574 | - | <a href="/diffs/releases" tabindex="-1"> | 576 | + | <a role="presentation" data-href="/diffs/releases"> |
| 575 | <span class="lbl">releases</span> | 577 | <span class="lbl">releases</span> | ||
| 576 | <span class="k">section</span> | 578 | <span class="k">section</span> | ||
| 577 | </a> | 579 | </a> | ||
| 578 | </li> | 580 | </li> | ||
| 579 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 581 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 580 | - | <a href="/diffs/actions" tabindex="-1"> | 582 | + | <a role="presentation" data-href="/diffs/actions"> |
| 581 | <span class="lbl">actions</span> | 583 | <span class="lbl">actions</span> | ||
| 582 | <span class="k">section</span> | 584 | <span class="k">section</span> | ||
| 583 | </a> | 585 | </a> | ||
| 584 | </li> | 586 | </li> | ||
| 585 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 587 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 586 | - | <a href="/diffs/tree/main" tabindex="-1"> | 588 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 587 | <span class="lbl">main</span> | 589 | <span class="lbl">main</span> | ||
| 588 | <span class="k">branch</span> | 590 | <span class="k">branch</span> | ||
| 589 | </a> | 591 | </a> | ||
| 590 | </li> | 592 | </li> | ||
| 591 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 593 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 592 | - | <a href="/diffs/tree/side" tabindex="-1"> | 594 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 593 | <span class="lbl">side</span> | 595 | <span class="lbl">side</span> | ||
| 594 | <span class="k">branch</span> | 596 | <span class="k">branch</span> | ||
| 595 | </a> | 597 | </a> | ||
| 596 | </li> | 598 | </li> | ||
| 597 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 599 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 598 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 600 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 599 | <span class="lbl">v1.0.0</span> | 601 | <span class="lbl">v1.0.0</span> | ||
| 600 | <span class="k">tag</span> | 602 | <span class="k">tag</span> | ||
| 601 | </a> | 603 | </a> | ||
| 602 | </li> | 604 | </li> | ||
| 603 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 605 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 604 | - | <a href="#" data-fire="keys" tabindex="-1"> | 606 | + | <a role="presentation" data-fire="keys"> |
| 605 | <span class="lbl">turn single-key shortcuts off</span> | 607 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 606 | <span class="k">action</span> | 608 | <span class="k">action</span> | ||
| 607 | </a> | 609 | </a> | ||
M internal/app/testdata/web/commit-modify.html +19 -17
| @@ -349,18 +349,20 @@ And <b>html</b> & "quotes".</pre> | |||
| 349 | 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 350 | 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 351 | 351 | </footer> | |
| 352 | - | <div class="hint" role="status" aria-live="polite"> | |
| 353 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 352 | + | <div class="hint"> | |
| 353 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 354 | 354 | </span> | |
| 355 | + | <span role="status" aria-live="polite"> | |
| 355 | 356 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 356 | 357 | </span> | |
| 357 | 358 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 358 | 359 | </span> | |
| 360 | + | </span> | |
| 359 | 361 | </div> | |
| 360 | 362 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 361 | 363 | <div class="panel-head"> | |
| 362 | 364 | <h2>Keyboard shortcuts</h2> | |
| 363 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 365 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 364 | 366 | <kbd>esc</kbd> close</button> | |
| 365 | 367 | </div> | |
| 366 | 368 | <div class="keys-pref"> | |
| @@ -494,7 +496,7 @@ And <b>html</b> & "quotes".</pre> | |||
| 494 | 496 | <div class="panel-head"> | |
| 495 | 497 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 496 | 498 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 497 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 499 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 498 | 500 | <kbd>esc</kbd> | |
| 499 | 501 | </button> | |
| 500 | 502 | </div> | |
| @@ -529,79 +531,79 @@ And <b>html</b> & "quotes".</pre> | |||
| 529 | 531 | <div class="panel-head"> | |
| 530 | 532 | <label for="cmd-q" class="sr">go to</label> | |
| 531 | 533 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 532 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 534 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 533 | 535 | <kbd>esc</kbd> | |
| 534 | 536 | </button> | |
| 535 | 537 | </div> | |
| 536 | 538 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 537 | 539 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 538 | - | <a href="/" tabindex="-1"> | |
| 540 | + | <a role="presentation" data-href="/"> | |
| 539 | 541 | <span class="lbl">home</span> | |
| 540 | 542 | <span class="k">go</span> | |
| 541 | 543 | </a> | |
| 542 | 544 | </li> | |
| 543 | 545 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 544 | - | <a href="/diffs" tabindex="-1"> | |
| 546 | + | <a role="presentation" data-href="/diffs"> | |
| 545 | 547 | <span class="lbl">summary</span> | |
| 546 | 548 | <span class="k">section</span> | |
| 547 | 549 | </a> | |
| 548 | 550 | </li> | |
| 549 | 551 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 550 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 552 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 551 | 553 | <span class="lbl">files</span> | |
| 552 | 554 | <span class="k">section</span> | |
| 553 | 555 | </a> | |
| 554 | 556 | </li> | |
| 555 | 557 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 556 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 558 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 557 | 559 | <span class="lbl">commits</span> | |
| 558 | 560 | <span class="k">section</span> | |
| 559 | 561 | </a> | |
| 560 | 562 | </li> | |
| 561 | 563 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 562 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 564 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 563 | 565 | <span class="lbl">branches & tags</span> | |
| 564 | 566 | <span class="k">section</span> | |
| 565 | 567 | </a> | |
| 566 | 568 | </li> | |
| 567 | 569 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 568 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 570 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 569 | 571 | <span class="lbl">merge requests</span> | |
| 570 | 572 | <span class="k">section</span> | |
| 571 | 573 | </a> | |
| 572 | 574 | </li> | |
| 573 | 575 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 574 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 576 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 575 | 577 | <span class="lbl">releases</span> | |
| 576 | 578 | <span class="k">section</span> | |
| 577 | 579 | </a> | |
| 578 | 580 | </li> | |
| 579 | 581 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 580 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 582 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 581 | 583 | <span class="lbl">actions</span> | |
| 582 | 584 | <span class="k">section</span> | |
| 583 | 585 | </a> | |
| 584 | 586 | </li> | |
| 585 | 587 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 586 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 588 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 587 | 589 | <span class="lbl">main</span> | |
| 588 | 590 | <span class="k">branch</span> | |
| 589 | 591 | </a> | |
| 590 | 592 | </li> | |
| 591 | 593 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 592 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 594 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 593 | 595 | <span class="lbl">side</span> | |
| 594 | 596 | <span class="k">branch</span> | |
| 595 | 597 | </a> | |
| 596 | 598 | </li> | |
| 597 | 599 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 598 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 600 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 599 | 601 | <span class="lbl">v1.0.0</span> | |
| 600 | 602 | <span class="k">tag</span> | |
| 601 | 603 | </a> | |
| 602 | 604 | </li> | |
| 603 | 605 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 604 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 606 | + | <a role="presentation" data-fire="keys"> | |
| 605 | 607 | <span class="lbl">turn single-key shortcuts off</span> | |
| 606 | 608 | <span class="k">action</span> | |
| 607 | 609 | </a> | |
| @@ -349,18 +349,20 @@ And <b>html</b> & "quotes".</pre> | |||||
| 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 349 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 350 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 351 | </footer> | 351 | </footer> | ||
| 352 | - | <div class="hint" role="status" aria-live="polite"> | 352 | + | <div class="hint"> |
| 353 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 353 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 354 | </span> | 354 | </span> | ||
| 355 | + | <span role="status" aria-live="polite"> | |||
| 355 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 356 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 356 | </span> | 357 | </span> | ||
| 357 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 358 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 358 | </span> | 359 | </span> | ||
| 360 | + | </span> | |||
| 359 | </div> | 361 | </div> | ||
| 360 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 362 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 361 | <div class="panel-head"> | 363 | <div class="panel-head"> | ||
| 362 | <h2>Keyboard shortcuts</h2> | 364 | <h2>Keyboard shortcuts</h2> | ||
| 363 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 365 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 364 | <kbd>esc</kbd> close</button> | 366 | <kbd>esc</kbd> close</button> | ||
| 365 | </div> | 367 | </div> | ||
| 366 | <div class="keys-pref"> | 368 | <div class="keys-pref"> | ||
| @@ -494,7 +496,7 @@ And <b>html</b> & "quotes".</pre> | |||||
| 494 | <div class="panel-head"> | 496 | <div class="panel-head"> | ||
| 495 | <label for="refs-filter" class="sr">filter branches and tags</label> | 497 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 496 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 498 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 497 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 499 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 498 | <kbd>esc</kbd> | 500 | <kbd>esc</kbd> | ||
| 499 | </button> | 501 | </button> | ||
| 500 | </div> | 502 | </div> | ||
| @@ -529,79 +531,79 @@ And <b>html</b> & "quotes".</pre> | |||||
| 529 | <div class="panel-head"> | 531 | <div class="panel-head"> | ||
| 530 | <label for="cmd-q" class="sr">go to</label> | 532 | <label for="cmd-q" class="sr">go to</label> | ||
| 531 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 533 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 532 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 534 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 533 | <kbd>esc</kbd> | 535 | <kbd>esc</kbd> | ||
| 534 | </button> | 536 | </button> | ||
| 535 | </div> | 537 | </div> | ||
| 536 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 538 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 537 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 539 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 538 | - | <a href="/" tabindex="-1"> | 540 | + | <a role="presentation" data-href="/"> |
| 539 | <span class="lbl">home</span> | 541 | <span class="lbl">home</span> | ||
| 540 | <span class="k">go</span> | 542 | <span class="k">go</span> | ||
| 541 | </a> | 543 | </a> | ||
| 542 | </li> | 544 | </li> | ||
| 543 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 545 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 544 | - | <a href="/diffs" tabindex="-1"> | 546 | + | <a role="presentation" data-href="/diffs"> |
| 545 | <span class="lbl">summary</span> | 547 | <span class="lbl">summary</span> | ||
| 546 | <span class="k">section</span> | 548 | <span class="k">section</span> | ||
| 547 | </a> | 549 | </a> | ||
| 548 | </li> | 550 | </li> | ||
| 549 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 551 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 550 | - | <a href="/diffs/tree/main" tabindex="-1"> | 552 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 551 | <span class="lbl">files</span> | 553 | <span class="lbl">files</span> | ||
| 552 | <span class="k">section</span> | 554 | <span class="k">section</span> | ||
| 553 | </a> | 555 | </a> | ||
| 554 | </li> | 556 | </li> | ||
| 555 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 557 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 556 | - | <a href="/diffs/commits/main" tabindex="-1"> | 558 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 557 | <span class="lbl">commits</span> | 559 | <span class="lbl">commits</span> | ||
| 558 | <span class="k">section</span> | 560 | <span class="k">section</span> | ||
| 559 | </a> | 561 | </a> | ||
| 560 | </li> | 562 | </li> | ||
| 561 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 563 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 562 | - | <a href="/diffs/refs" tabindex="-1"> | 564 | + | <a role="presentation" data-href="/diffs/refs"> |
| 563 | <span class="lbl">branches & tags</span> | 565 | <span class="lbl">branches & tags</span> | ||
| 564 | <span class="k">section</span> | 566 | <span class="k">section</span> | ||
| 565 | </a> | 567 | </a> | ||
| 566 | </li> | 568 | </li> | ||
| 567 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 569 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 568 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 570 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 569 | <span class="lbl">merge requests</span> | 571 | <span class="lbl">merge requests</span> | ||
| 570 | <span class="k">section</span> | 572 | <span class="k">section</span> | ||
| 571 | </a> | 573 | </a> | ||
| 572 | </li> | 574 | </li> | ||
| 573 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 575 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 574 | - | <a href="/diffs/releases" tabindex="-1"> | 576 | + | <a role="presentation" data-href="/diffs/releases"> |
| 575 | <span class="lbl">releases</span> | 577 | <span class="lbl">releases</span> | ||
| 576 | <span class="k">section</span> | 578 | <span class="k">section</span> | ||
| 577 | </a> | 579 | </a> | ||
| 578 | </li> | 580 | </li> | ||
| 579 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 581 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 580 | - | <a href="/diffs/actions" tabindex="-1"> | 582 | + | <a role="presentation" data-href="/diffs/actions"> |
| 581 | <span class="lbl">actions</span> | 583 | <span class="lbl">actions</span> | ||
| 582 | <span class="k">section</span> | 584 | <span class="k">section</span> | ||
| 583 | </a> | 585 | </a> | ||
| 584 | </li> | 586 | </li> | ||
| 585 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 587 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 586 | - | <a href="/diffs/tree/main" tabindex="-1"> | 588 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 587 | <span class="lbl">main</span> | 589 | <span class="lbl">main</span> | ||
| 588 | <span class="k">branch</span> | 590 | <span class="k">branch</span> | ||
| 589 | </a> | 591 | </a> | ||
| 590 | </li> | 592 | </li> | ||
| 591 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 593 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 592 | - | <a href="/diffs/tree/side" tabindex="-1"> | 594 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 593 | <span class="lbl">side</span> | 595 | <span class="lbl">side</span> | ||
| 594 | <span class="k">branch</span> | 596 | <span class="k">branch</span> | ||
| 595 | </a> | 597 | </a> | ||
| 596 | </li> | 598 | </li> | ||
| 597 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 599 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 598 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 600 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 599 | <span class="lbl">v1.0.0</span> | 601 | <span class="lbl">v1.0.0</span> | ||
| 600 | <span class="k">tag</span> | 602 | <span class="k">tag</span> | ||
| 601 | </a> | 603 | </a> | ||
| 602 | </li> | 604 | </li> | ||
| 603 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 605 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 604 | - | <a href="#" data-fire="keys" tabindex="-1"> | 606 | + | <a role="presentation" data-fire="keys"> |
| 605 | <span class="lbl">turn single-key shortcuts off</span> | 607 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 606 | <span class="k">action</span> | 608 | <span class="k">action</span> | ||
| 607 | </a> | 609 | </a> | ||
M internal/app/testdata/web/commit-rename.html +19 -17
| @@ -253,18 +253,20 @@ | |||
| 253 | 253 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 254 | 254 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 255 | 255 | </footer> | |
| 256 | - | <div class="hint" role="status" aria-live="polite"> | |
| 257 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 256 | + | <div class="hint"> | |
| 257 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 258 | 258 | </span> | |
| 259 | + | <span role="status" aria-live="polite"> | |
| 259 | 260 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 260 | 261 | </span> | |
| 261 | 262 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 262 | 263 | </span> | |
| 264 | + | </span> | |
| 263 | 265 | </div> | |
| 264 | 266 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 265 | 267 | <div class="panel-head"> | |
| 266 | 268 | <h2>Keyboard shortcuts</h2> | |
| 267 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 269 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 268 | 270 | <kbd>esc</kbd> close</button> | |
| 269 | 271 | </div> | |
| 270 | 272 | <div class="keys-pref"> | |
| @@ -398,7 +400,7 @@ | |||
| 398 | 400 | <div class="panel-head"> | |
| 399 | 401 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 400 | 402 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 401 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 403 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 402 | 404 | <kbd>esc</kbd> | |
| 403 | 405 | </button> | |
| 404 | 406 | </div> | |
| @@ -433,79 +435,79 @@ | |||
| 433 | 435 | <div class="panel-head"> | |
| 434 | 436 | <label for="cmd-q" class="sr">go to</label> | |
| 435 | 437 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 436 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 438 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 437 | 439 | <kbd>esc</kbd> | |
| 438 | 440 | </button> | |
| 439 | 441 | </div> | |
| 440 | 442 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 441 | 443 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 442 | - | <a href="/" tabindex="-1"> | |
| 444 | + | <a role="presentation" data-href="/"> | |
| 443 | 445 | <span class="lbl">home</span> | |
| 444 | 446 | <span class="k">go</span> | |
| 445 | 447 | </a> | |
| 446 | 448 | </li> | |
| 447 | 449 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 448 | - | <a href="/diffs" tabindex="-1"> | |
| 450 | + | <a role="presentation" data-href="/diffs"> | |
| 449 | 451 | <span class="lbl">summary</span> | |
| 450 | 452 | <span class="k">section</span> | |
| 451 | 453 | </a> | |
| 452 | 454 | </li> | |
| 453 | 455 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 454 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 456 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 455 | 457 | <span class="lbl">files</span> | |
| 456 | 458 | <span class="k">section</span> | |
| 457 | 459 | </a> | |
| 458 | 460 | </li> | |
| 459 | 461 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 460 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 462 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 461 | 463 | <span class="lbl">commits</span> | |
| 462 | 464 | <span class="k">section</span> | |
| 463 | 465 | </a> | |
| 464 | 466 | </li> | |
| 465 | 467 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 466 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 468 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 467 | 469 | <span class="lbl">branches & tags</span> | |
| 468 | 470 | <span class="k">section</span> | |
| 469 | 471 | </a> | |
| 470 | 472 | </li> | |
| 471 | 473 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 472 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 474 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 473 | 475 | <span class="lbl">merge requests</span> | |
| 474 | 476 | <span class="k">section</span> | |
| 475 | 477 | </a> | |
| 476 | 478 | </li> | |
| 477 | 479 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 478 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 480 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 479 | 481 | <span class="lbl">releases</span> | |
| 480 | 482 | <span class="k">section</span> | |
| 481 | 483 | </a> | |
| 482 | 484 | </li> | |
| 483 | 485 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 484 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 486 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 485 | 487 | <span class="lbl">actions</span> | |
| 486 | 488 | <span class="k">section</span> | |
| 487 | 489 | </a> | |
| 488 | 490 | </li> | |
| 489 | 491 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 490 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 492 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 491 | 493 | <span class="lbl">main</span> | |
| 492 | 494 | <span class="k">branch</span> | |
| 493 | 495 | </a> | |
| 494 | 496 | </li> | |
| 495 | 497 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 496 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 498 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 497 | 499 | <span class="lbl">side</span> | |
| 498 | 500 | <span class="k">branch</span> | |
| 499 | 501 | </a> | |
| 500 | 502 | </li> | |
| 501 | 503 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 502 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 504 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 503 | 505 | <span class="lbl">v1.0.0</span> | |
| 504 | 506 | <span class="k">tag</span> | |
| 505 | 507 | </a> | |
| 506 | 508 | </li> | |
| 507 | 509 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 508 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 510 | + | <a role="presentation" data-fire="keys"> | |
| 509 | 511 | <span class="lbl">turn single-key shortcuts off</span> | |
| 510 | 512 | <span class="k">action</span> | |
| 511 | 513 | </a> | |
| @@ -253,18 +253,20 @@ | |||||
| 253 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 253 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 254 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 254 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 255 | </footer> | 255 | </footer> | ||
| 256 | - | <div class="hint" role="status" aria-live="polite"> | 256 | + | <div class="hint"> |
| 257 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 257 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 258 | </span> | 258 | </span> | ||
| 259 | + | <span role="status" aria-live="polite"> | |||
| 259 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 260 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 260 | </span> | 261 | </span> | ||
| 261 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 262 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 262 | </span> | 263 | </span> | ||
| 264 | + | </span> | |||
| 263 | </div> | 265 | </div> | ||
| 264 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 266 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 265 | <div class="panel-head"> | 267 | <div class="panel-head"> | ||
| 266 | <h2>Keyboard shortcuts</h2> | 268 | <h2>Keyboard shortcuts</h2> | ||
| 267 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 269 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 268 | <kbd>esc</kbd> close</button> | 270 | <kbd>esc</kbd> close</button> | ||
| 269 | </div> | 271 | </div> | ||
| 270 | <div class="keys-pref"> | 272 | <div class="keys-pref"> | ||
| @@ -398,7 +400,7 @@ | |||||
| 398 | <div class="panel-head"> | 400 | <div class="panel-head"> | ||
| 399 | <label for="refs-filter" class="sr">filter branches and tags</label> | 401 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 400 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 402 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 401 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 403 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 402 | <kbd>esc</kbd> | 404 | <kbd>esc</kbd> | ||
| 403 | </button> | 405 | </button> | ||
| 404 | </div> | 406 | </div> | ||
| @@ -433,79 +435,79 @@ | |||||
| 433 | <div class="panel-head"> | 435 | <div class="panel-head"> | ||
| 434 | <label for="cmd-q" class="sr">go to</label> | 436 | <label for="cmd-q" class="sr">go to</label> | ||
| 435 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 437 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 436 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 438 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 437 | <kbd>esc</kbd> | 439 | <kbd>esc</kbd> | ||
| 438 | </button> | 440 | </button> | ||
| 439 | </div> | 441 | </div> | ||
| 440 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 442 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 441 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 443 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 442 | - | <a href="/" tabindex="-1"> | 444 | + | <a role="presentation" data-href="/"> |
| 443 | <span class="lbl">home</span> | 445 | <span class="lbl">home</span> | ||
| 444 | <span class="k">go</span> | 446 | <span class="k">go</span> | ||
| 445 | </a> | 447 | </a> | ||
| 446 | </li> | 448 | </li> | ||
| 447 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 449 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 448 | - | <a href="/diffs" tabindex="-1"> | 450 | + | <a role="presentation" data-href="/diffs"> |
| 449 | <span class="lbl">summary</span> | 451 | <span class="lbl">summary</span> | ||
| 450 | <span class="k">section</span> | 452 | <span class="k">section</span> | ||
| 451 | </a> | 453 | </a> | ||
| 452 | </li> | 454 | </li> | ||
| 453 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 455 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 454 | - | <a href="/diffs/tree/main" tabindex="-1"> | 456 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 455 | <span class="lbl">files</span> | 457 | <span class="lbl">files</span> | ||
| 456 | <span class="k">section</span> | 458 | <span class="k">section</span> | ||
| 457 | </a> | 459 | </a> | ||
| 458 | </li> | 460 | </li> | ||
| 459 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 461 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 460 | - | <a href="/diffs/commits/main" tabindex="-1"> | 462 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 461 | <span class="lbl">commits</span> | 463 | <span class="lbl">commits</span> | ||
| 462 | <span class="k">section</span> | 464 | <span class="k">section</span> | ||
| 463 | </a> | 465 | </a> | ||
| 464 | </li> | 466 | </li> | ||
| 465 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 467 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 466 | - | <a href="/diffs/refs" tabindex="-1"> | 468 | + | <a role="presentation" data-href="/diffs/refs"> |
| 467 | <span class="lbl">branches & tags</span> | 469 | <span class="lbl">branches & tags</span> | ||
| 468 | <span class="k">section</span> | 470 | <span class="k">section</span> | ||
| 469 | </a> | 471 | </a> | ||
| 470 | </li> | 472 | </li> | ||
| 471 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 473 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 472 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 474 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 473 | <span class="lbl">merge requests</span> | 475 | <span class="lbl">merge requests</span> | ||
| 474 | <span class="k">section</span> | 476 | <span class="k">section</span> | ||
| 475 | </a> | 477 | </a> | ||
| 476 | </li> | 478 | </li> | ||
| 477 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 479 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 478 | - | <a href="/diffs/releases" tabindex="-1"> | 480 | + | <a role="presentation" data-href="/diffs/releases"> |
| 479 | <span class="lbl">releases</span> | 481 | <span class="lbl">releases</span> | ||
| 480 | <span class="k">section</span> | 482 | <span class="k">section</span> | ||
| 481 | </a> | 483 | </a> | ||
| 482 | </li> | 484 | </li> | ||
| 483 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 485 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 484 | - | <a href="/diffs/actions" tabindex="-1"> | 486 | + | <a role="presentation" data-href="/diffs/actions"> |
| 485 | <span class="lbl">actions</span> | 487 | <span class="lbl">actions</span> | ||
| 486 | <span class="k">section</span> | 488 | <span class="k">section</span> | ||
| 487 | </a> | 489 | </a> | ||
| 488 | </li> | 490 | </li> | ||
| 489 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 491 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 490 | - | <a href="/diffs/tree/main" tabindex="-1"> | 492 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 491 | <span class="lbl">main</span> | 493 | <span class="lbl">main</span> | ||
| 492 | <span class="k">branch</span> | 494 | <span class="k">branch</span> | ||
| 493 | </a> | 495 | </a> | ||
| 494 | </li> | 496 | </li> | ||
| 495 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 497 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 496 | - | <a href="/diffs/tree/side" tabindex="-1"> | 498 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 497 | <span class="lbl">side</span> | 499 | <span class="lbl">side</span> | ||
| 498 | <span class="k">branch</span> | 500 | <span class="k">branch</span> | ||
| 499 | </a> | 501 | </a> | ||
| 500 | </li> | 502 | </li> | ||
| 501 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 503 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 502 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 504 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 503 | <span class="lbl">v1.0.0</span> | 505 | <span class="lbl">v1.0.0</span> | ||
| 504 | <span class="k">tag</span> | 506 | <span class="k">tag</span> | ||
| 505 | </a> | 507 | </a> | ||
| 506 | </li> | 508 | </li> | ||
| 507 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 509 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 508 | - | <a href="#" data-fire="keys" tabindex="-1"> | 510 | + | <a role="presentation" data-fire="keys"> |
| 509 | <span class="lbl">turn single-key shortcuts off</span> | 511 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 510 | <span class="k">action</span> | 512 | <span class="k">action</span> | ||
| 511 | </a> | 513 | </a> | ||
M internal/app/testdata/web/commit-root.html +19 -17
| @@ -572,18 +572,20 @@ | |||
| 572 | 572 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 573 | 573 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 574 | 574 | </footer> | |
| 575 | - | <div class="hint" role="status" aria-live="polite"> | |
| 576 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 575 | + | <div class="hint"> | |
| 576 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 577 | 577 | </span> | |
| 578 | + | <span role="status" aria-live="polite"> | |
| 578 | 579 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 579 | 580 | </span> | |
| 580 | 581 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 581 | 582 | </span> | |
| 583 | + | </span> | |
| 582 | 584 | </div> | |
| 583 | 585 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 584 | 586 | <div class="panel-head"> | |
| 585 | 587 | <h2>Keyboard shortcuts</h2> | |
| 586 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 588 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 587 | 589 | <kbd>esc</kbd> close</button> | |
| 588 | 590 | </div> | |
| 589 | 591 | <div class="keys-pref"> | |
| @@ -717,7 +719,7 @@ | |||
| 717 | 719 | <div class="panel-head"> | |
| 718 | 720 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 719 | 721 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 720 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 722 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 721 | 723 | <kbd>esc</kbd> | |
| 722 | 724 | </button> | |
| 723 | 725 | </div> | |
| @@ -752,79 +754,79 @@ | |||
| 752 | 754 | <div class="panel-head"> | |
| 753 | 755 | <label for="cmd-q" class="sr">go to</label> | |
| 754 | 756 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 755 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 757 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 756 | 758 | <kbd>esc</kbd> | |
| 757 | 759 | </button> | |
| 758 | 760 | </div> | |
| 759 | 761 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 760 | 762 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 761 | - | <a href="/" tabindex="-1"> | |
| 763 | + | <a role="presentation" data-href="/"> | |
| 762 | 764 | <span class="lbl">home</span> | |
| 763 | 765 | <span class="k">go</span> | |
| 764 | 766 | </a> | |
| 765 | 767 | </li> | |
| 766 | 768 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 767 | - | <a href="/diffs" tabindex="-1"> | |
| 769 | + | <a role="presentation" data-href="/diffs"> | |
| 768 | 770 | <span class="lbl">summary</span> | |
| 769 | 771 | <span class="k">section</span> | |
| 770 | 772 | </a> | |
| 771 | 773 | </li> | |
| 772 | 774 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 773 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 775 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 774 | 776 | <span class="lbl">files</span> | |
| 775 | 777 | <span class="k">section</span> | |
| 776 | 778 | </a> | |
| 777 | 779 | </li> | |
| 778 | 780 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 779 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 781 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 780 | 782 | <span class="lbl">commits</span> | |
| 781 | 783 | <span class="k">section</span> | |
| 782 | 784 | </a> | |
| 783 | 785 | </li> | |
| 784 | 786 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 785 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 787 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 786 | 788 | <span class="lbl">branches & tags</span> | |
| 787 | 789 | <span class="k">section</span> | |
| 788 | 790 | </a> | |
| 789 | 791 | </li> | |
| 790 | 792 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 791 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 793 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 792 | 794 | <span class="lbl">merge requests</span> | |
| 793 | 795 | <span class="k">section</span> | |
| 794 | 796 | </a> | |
| 795 | 797 | </li> | |
| 796 | 798 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 797 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 799 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 798 | 800 | <span class="lbl">releases</span> | |
| 799 | 801 | <span class="k">section</span> | |
| 800 | 802 | </a> | |
| 801 | 803 | </li> | |
| 802 | 804 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 803 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 805 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 804 | 806 | <span class="lbl">actions</span> | |
| 805 | 807 | <span class="k">section</span> | |
| 806 | 808 | </a> | |
| 807 | 809 | </li> | |
| 808 | 810 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 809 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 811 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 810 | 812 | <span class="lbl">main</span> | |
| 811 | 813 | <span class="k">branch</span> | |
| 812 | 814 | </a> | |
| 813 | 815 | </li> | |
| 814 | 816 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 815 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 817 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 816 | 818 | <span class="lbl">side</span> | |
| 817 | 819 | <span class="k">branch</span> | |
| 818 | 820 | </a> | |
| 819 | 821 | </li> | |
| 820 | 822 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 821 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 823 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 822 | 824 | <span class="lbl">v1.0.0</span> | |
| 823 | 825 | <span class="k">tag</span> | |
| 824 | 826 | </a> | |
| 825 | 827 | </li> | |
| 826 | 828 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 827 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 829 | + | <a role="presentation" data-fire="keys"> | |
| 828 | 830 | <span class="lbl">turn single-key shortcuts off</span> | |
| 829 | 831 | <span class="k">action</span> | |
| 830 | 832 | </a> | |
| @@ -572,18 +572,20 @@ | |||||
| 572 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 572 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 573 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 573 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 574 | </footer> | 574 | </footer> | ||
| 575 | - | <div class="hint" role="status" aria-live="polite"> | 575 | + | <div class="hint"> |
| 576 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 576 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 577 | </span> | 577 | </span> | ||
| 578 | + | <span role="status" aria-live="polite"> | |||
| 578 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 579 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 579 | </span> | 580 | </span> | ||
| 580 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 581 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 581 | </span> | 582 | </span> | ||
| 583 | + | </span> | |||
| 582 | </div> | 584 | </div> | ||
| 583 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 585 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 584 | <div class="panel-head"> | 586 | <div class="panel-head"> | ||
| 585 | <h2>Keyboard shortcuts</h2> | 587 | <h2>Keyboard shortcuts</h2> | ||
| 586 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 588 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 587 | <kbd>esc</kbd> close</button> | 589 | <kbd>esc</kbd> close</button> | ||
| 588 | </div> | 590 | </div> | ||
| 589 | <div class="keys-pref"> | 591 | <div class="keys-pref"> | ||
| @@ -717,7 +719,7 @@ | |||||
| 717 | <div class="panel-head"> | 719 | <div class="panel-head"> | ||
| 718 | <label for="refs-filter" class="sr">filter branches and tags</label> | 720 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 719 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 721 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 720 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 722 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 721 | <kbd>esc</kbd> | 723 | <kbd>esc</kbd> | ||
| 722 | </button> | 724 | </button> | ||
| 723 | </div> | 725 | </div> | ||
| @@ -752,79 +754,79 @@ | |||||
| 752 | <div class="panel-head"> | 754 | <div class="panel-head"> | ||
| 753 | <label for="cmd-q" class="sr">go to</label> | 755 | <label for="cmd-q" class="sr">go to</label> | ||
| 754 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 756 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 755 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 757 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 756 | <kbd>esc</kbd> | 758 | <kbd>esc</kbd> | ||
| 757 | </button> | 759 | </button> | ||
| 758 | </div> | 760 | </div> | ||
| 759 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 761 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 760 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 762 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 761 | - | <a href="/" tabindex="-1"> | 763 | + | <a role="presentation" data-href="/"> |
| 762 | <span class="lbl">home</span> | 764 | <span class="lbl">home</span> | ||
| 763 | <span class="k">go</span> | 765 | <span class="k">go</span> | ||
| 764 | </a> | 766 | </a> | ||
| 765 | </li> | 767 | </li> | ||
| 766 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 768 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 767 | - | <a href="/diffs" tabindex="-1"> | 769 | + | <a role="presentation" data-href="/diffs"> |
| 768 | <span class="lbl">summary</span> | 770 | <span class="lbl">summary</span> | ||
| 769 | <span class="k">section</span> | 771 | <span class="k">section</span> | ||
| 770 | </a> | 772 | </a> | ||
| 771 | </li> | 773 | </li> | ||
| 772 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 774 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 773 | - | <a href="/diffs/tree/main" tabindex="-1"> | 775 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 774 | <span class="lbl">files</span> | 776 | <span class="lbl">files</span> | ||
| 775 | <span class="k">section</span> | 777 | <span class="k">section</span> | ||
| 776 | </a> | 778 | </a> | ||
| 777 | </li> | 779 | </li> | ||
| 778 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 780 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 779 | - | <a href="/diffs/commits/main" tabindex="-1"> | 781 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 780 | <span class="lbl">commits</span> | 782 | <span class="lbl">commits</span> | ||
| 781 | <span class="k">section</span> | 783 | <span class="k">section</span> | ||
| 782 | </a> | 784 | </a> | ||
| 783 | </li> | 785 | </li> | ||
| 784 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 786 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 785 | - | <a href="/diffs/refs" tabindex="-1"> | 787 | + | <a role="presentation" data-href="/diffs/refs"> |
| 786 | <span class="lbl">branches & tags</span> | 788 | <span class="lbl">branches & tags</span> | ||
| 787 | <span class="k">section</span> | 789 | <span class="k">section</span> | ||
| 788 | </a> | 790 | </a> | ||
| 789 | </li> | 791 | </li> | ||
| 790 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 792 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 791 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 793 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 792 | <span class="lbl">merge requests</span> | 794 | <span class="lbl">merge requests</span> | ||
| 793 | <span class="k">section</span> | 795 | <span class="k">section</span> | ||
| 794 | </a> | 796 | </a> | ||
| 795 | </li> | 797 | </li> | ||
| 796 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 798 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 797 | - | <a href="/diffs/releases" tabindex="-1"> | 799 | + | <a role="presentation" data-href="/diffs/releases"> |
| 798 | <span class="lbl">releases</span> | 800 | <span class="lbl">releases</span> | ||
| 799 | <span class="k">section</span> | 801 | <span class="k">section</span> | ||
| 800 | </a> | 802 | </a> | ||
| 801 | </li> | 803 | </li> | ||
| 802 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 804 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 803 | - | <a href="/diffs/actions" tabindex="-1"> | 805 | + | <a role="presentation" data-href="/diffs/actions"> |
| 804 | <span class="lbl">actions</span> | 806 | <span class="lbl">actions</span> | ||
| 805 | <span class="k">section</span> | 807 | <span class="k">section</span> | ||
| 806 | </a> | 808 | </a> | ||
| 807 | </li> | 809 | </li> | ||
| 808 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 810 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 809 | - | <a href="/diffs/tree/main" tabindex="-1"> | 811 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 810 | <span class="lbl">main</span> | 812 | <span class="lbl">main</span> | ||
| 811 | <span class="k">branch</span> | 813 | <span class="k">branch</span> | ||
| 812 | </a> | 814 | </a> | ||
| 813 | </li> | 815 | </li> | ||
| 814 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 816 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 815 | - | <a href="/diffs/tree/side" tabindex="-1"> | 817 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 816 | <span class="lbl">side</span> | 818 | <span class="lbl">side</span> | ||
| 817 | <span class="k">branch</span> | 819 | <span class="k">branch</span> | ||
| 818 | </a> | 820 | </a> | ||
| 819 | </li> | 821 | </li> | ||
| 820 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 822 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 821 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 823 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 822 | <span class="lbl">v1.0.0</span> | 824 | <span class="lbl">v1.0.0</span> | ||
| 823 | <span class="k">tag</span> | 825 | <span class="k">tag</span> | ||
| 824 | </a> | 826 | </a> | ||
| 825 | </li> | 827 | </li> | ||
| 826 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 828 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 827 | - | <a href="#" data-fire="keys" tabindex="-1"> | 829 | + | <a role="presentation" data-fire="keys"> |
| 828 | <span class="lbl">turn single-key shortcuts off</span> | 830 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 829 | <span class="k">action</span> | 831 | <span class="k">action</span> | ||
| 830 | </a> | 832 | </a> | ||
M internal/app/testdata/web/commit-trojan.html +19 -17
| @@ -401,18 +401,20 @@ | |||
| 401 | 401 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 402 | 402 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 403 | 403 | </footer> | |
| 404 | - | <div class="hint" role="status" aria-live="polite"> | |
| 405 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 404 | + | <div class="hint"> | |
| 405 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 406 | 406 | </span> | |
| 407 | + | <span role="status" aria-live="polite"> | |
| 407 | 408 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 408 | 409 | </span> | |
| 409 | 410 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 410 | 411 | </span> | |
| 412 | + | </span> | |
| 411 | 413 | </div> | |
| 412 | 414 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 413 | 415 | <div class="panel-head"> | |
| 414 | 416 | <h2>Keyboard shortcuts</h2> | |
| 415 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 417 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 416 | 418 | <kbd>esc</kbd> close</button> | |
| 417 | 419 | </div> | |
| 418 | 420 | <div class="keys-pref"> | |
| @@ -546,7 +548,7 @@ | |||
| 546 | 548 | <div class="panel-head"> | |
| 547 | 549 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 548 | 550 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 549 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 551 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 550 | 552 | <kbd>esc</kbd> | |
| 551 | 553 | </button> | |
| 552 | 554 | </div> | |
| @@ -581,79 +583,79 @@ | |||
| 581 | 583 | <div class="panel-head"> | |
| 582 | 584 | <label for="cmd-q" class="sr">go to</label> | |
| 583 | 585 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 584 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 586 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 585 | 587 | <kbd>esc</kbd> | |
| 586 | 588 | </button> | |
| 587 | 589 | </div> | |
| 588 | 590 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 589 | 591 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 590 | - | <a href="/" tabindex="-1"> | |
| 592 | + | <a role="presentation" data-href="/"> | |
| 591 | 593 | <span class="lbl">home</span> | |
| 592 | 594 | <span class="k">go</span> | |
| 593 | 595 | </a> | |
| 594 | 596 | </li> | |
| 595 | 597 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 596 | - | <a href="/diffs" tabindex="-1"> | |
| 598 | + | <a role="presentation" data-href="/diffs"> | |
| 597 | 599 | <span class="lbl">summary</span> | |
| 598 | 600 | <span class="k">section</span> | |
| 599 | 601 | </a> | |
| 600 | 602 | </li> | |
| 601 | 603 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 602 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 604 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 603 | 605 | <span class="lbl">files</span> | |
| 604 | 606 | <span class="k">section</span> | |
| 605 | 607 | </a> | |
| 606 | 608 | </li> | |
| 607 | 609 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 608 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 610 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 609 | 611 | <span class="lbl">commits</span> | |
| 610 | 612 | <span class="k">section</span> | |
| 611 | 613 | </a> | |
| 612 | 614 | </li> | |
| 613 | 615 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 614 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 616 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 615 | 617 | <span class="lbl">branches & tags</span> | |
| 616 | 618 | <span class="k">section</span> | |
| 617 | 619 | </a> | |
| 618 | 620 | </li> | |
| 619 | 621 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 620 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 622 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 621 | 623 | <span class="lbl">merge requests</span> | |
| 622 | 624 | <span class="k">section</span> | |
| 623 | 625 | </a> | |
| 624 | 626 | </li> | |
| 625 | 627 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 626 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 628 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 627 | 629 | <span class="lbl">releases</span> | |
| 628 | 630 | <span class="k">section</span> | |
| 629 | 631 | </a> | |
| 630 | 632 | </li> | |
| 631 | 633 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 632 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 634 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 633 | 635 | <span class="lbl">actions</span> | |
| 634 | 636 | <span class="k">section</span> | |
| 635 | 637 | </a> | |
| 636 | 638 | </li> | |
| 637 | 639 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 638 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 640 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 639 | 641 | <span class="lbl">main</span> | |
| 640 | 642 | <span class="k">branch</span> | |
| 641 | 643 | </a> | |
| 642 | 644 | </li> | |
| 643 | 645 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 644 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 646 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 645 | 647 | <span class="lbl">side</span> | |
| 646 | 648 | <span class="k">branch</span> | |
| 647 | 649 | </a> | |
| 648 | 650 | </li> | |
| 649 | 651 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 650 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 652 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 651 | 653 | <span class="lbl">v1.0.0</span> | |
| 652 | 654 | <span class="k">tag</span> | |
| 653 | 655 | </a> | |
| 654 | 656 | </li> | |
| 655 | 657 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 656 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 658 | + | <a role="presentation" data-fire="keys"> | |
| 657 | 659 | <span class="lbl">turn single-key shortcuts off</span> | |
| 658 | 660 | <span class="k">action</span> | |
| 659 | 661 | </a> | |
| @@ -401,18 +401,20 @@ | |||||
| 401 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 401 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 402 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 402 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 403 | </footer> | 403 | </footer> | ||
| 404 | - | <div class="hint" role="status" aria-live="polite"> | 404 | + | <div class="hint"> |
| 405 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 405 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 406 | </span> | 406 | </span> | ||
| 407 | + | <span role="status" aria-live="polite"> | |||
| 407 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 408 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 408 | </span> | 409 | </span> | ||
| 409 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 410 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 410 | </span> | 411 | </span> | ||
| 412 | + | </span> | |||
| 411 | </div> | 413 | </div> | ||
| 412 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 414 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 413 | <div class="panel-head"> | 415 | <div class="panel-head"> | ||
| 414 | <h2>Keyboard shortcuts</h2> | 416 | <h2>Keyboard shortcuts</h2> | ||
| 415 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 417 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 416 | <kbd>esc</kbd> close</button> | 418 | <kbd>esc</kbd> close</button> | ||
| 417 | </div> | 419 | </div> | ||
| 418 | <div class="keys-pref"> | 420 | <div class="keys-pref"> | ||
| @@ -546,7 +548,7 @@ | |||||
| 546 | <div class="panel-head"> | 548 | <div class="panel-head"> | ||
| 547 | <label for="refs-filter" class="sr">filter branches and tags</label> | 549 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 548 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 550 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 549 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 551 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 550 | <kbd>esc</kbd> | 552 | <kbd>esc</kbd> | ||
| 551 | </button> | 553 | </button> | ||
| 552 | </div> | 554 | </div> | ||
| @@ -581,79 +583,79 @@ | |||||
| 581 | <div class="panel-head"> | 583 | <div class="panel-head"> | ||
| 582 | <label for="cmd-q" class="sr">go to</label> | 584 | <label for="cmd-q" class="sr">go to</label> | ||
| 583 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 585 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 584 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 586 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 585 | <kbd>esc</kbd> | 587 | <kbd>esc</kbd> | ||
| 586 | </button> | 588 | </button> | ||
| 587 | </div> | 589 | </div> | ||
| 588 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 590 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 589 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 591 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 590 | - | <a href="/" tabindex="-1"> | 592 | + | <a role="presentation" data-href="/"> |
| 591 | <span class="lbl">home</span> | 593 | <span class="lbl">home</span> | ||
| 592 | <span class="k">go</span> | 594 | <span class="k">go</span> | ||
| 593 | </a> | 595 | </a> | ||
| 594 | </li> | 596 | </li> | ||
| 595 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 597 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 596 | - | <a href="/diffs" tabindex="-1"> | 598 | + | <a role="presentation" data-href="/diffs"> |
| 597 | <span class="lbl">summary</span> | 599 | <span class="lbl">summary</span> | ||
| 598 | <span class="k">section</span> | 600 | <span class="k">section</span> | ||
| 599 | </a> | 601 | </a> | ||
| 600 | </li> | 602 | </li> | ||
| 601 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 603 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 602 | - | <a href="/diffs/tree/main" tabindex="-1"> | 604 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 603 | <span class="lbl">files</span> | 605 | <span class="lbl">files</span> | ||
| 604 | <span class="k">section</span> | 606 | <span class="k">section</span> | ||
| 605 | </a> | 607 | </a> | ||
| 606 | </li> | 608 | </li> | ||
| 607 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 609 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 608 | - | <a href="/diffs/commits/main" tabindex="-1"> | 610 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 609 | <span class="lbl">commits</span> | 611 | <span class="lbl">commits</span> | ||
| 610 | <span class="k">section</span> | 612 | <span class="k">section</span> | ||
| 611 | </a> | 613 | </a> | ||
| 612 | </li> | 614 | </li> | ||
| 613 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 615 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 614 | - | <a href="/diffs/refs" tabindex="-1"> | 616 | + | <a role="presentation" data-href="/diffs/refs"> |
| 615 | <span class="lbl">branches & tags</span> | 617 | <span class="lbl">branches & tags</span> | ||
| 616 | <span class="k">section</span> | 618 | <span class="k">section</span> | ||
| 617 | </a> | 619 | </a> | ||
| 618 | </li> | 620 | </li> | ||
| 619 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 621 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 620 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 622 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 621 | <span class="lbl">merge requests</span> | 623 | <span class="lbl">merge requests</span> | ||
| 622 | <span class="k">section</span> | 624 | <span class="k">section</span> | ||
| 623 | </a> | 625 | </a> | ||
| 624 | </li> | 626 | </li> | ||
| 625 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 627 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 626 | - | <a href="/diffs/releases" tabindex="-1"> | 628 | + | <a role="presentation" data-href="/diffs/releases"> |
| 627 | <span class="lbl">releases</span> | 629 | <span class="lbl">releases</span> | ||
| 628 | <span class="k">section</span> | 630 | <span class="k">section</span> | ||
| 629 | </a> | 631 | </a> | ||
| 630 | </li> | 632 | </li> | ||
| 631 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 633 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 632 | - | <a href="/diffs/actions" tabindex="-1"> | 634 | + | <a role="presentation" data-href="/diffs/actions"> |
| 633 | <span class="lbl">actions</span> | 635 | <span class="lbl">actions</span> | ||
| 634 | <span class="k">section</span> | 636 | <span class="k">section</span> | ||
| 635 | </a> | 637 | </a> | ||
| 636 | </li> | 638 | </li> | ||
| 637 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 639 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 638 | - | <a href="/diffs/tree/main" tabindex="-1"> | 640 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 639 | <span class="lbl">main</span> | 641 | <span class="lbl">main</span> | ||
| 640 | <span class="k">branch</span> | 642 | <span class="k">branch</span> | ||
| 641 | </a> | 643 | </a> | ||
| 642 | </li> | 644 | </li> | ||
| 643 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 645 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 644 | - | <a href="/diffs/tree/side" tabindex="-1"> | 646 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 645 | <span class="lbl">side</span> | 647 | <span class="lbl">side</span> | ||
| 646 | <span class="k">branch</span> | 648 | <span class="k">branch</span> | ||
| 647 | </a> | 649 | </a> | ||
| 648 | </li> | 650 | </li> | ||
| 649 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 651 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 650 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 652 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 651 | <span class="lbl">v1.0.0</span> | 653 | <span class="lbl">v1.0.0</span> | ||
| 652 | <span class="k">tag</span> | 654 | <span class="k">tag</span> | ||
| 653 | </a> | 655 | </a> | ||
| 654 | </li> | 656 | </li> | ||
| 655 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 657 | <li id="cmd-o11" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 656 | - | <a href="#" data-fire="keys" tabindex="-1"> | 658 | + | <a role="presentation" data-fire="keys"> |
| 657 | <span class="lbl">turn single-key shortcuts off</span> | 659 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 658 | <span class="k">action</span> | 660 | <span class="k">action</span> | ||
| 659 | </a> | 661 | </a> | ||
M internal/app/testdata/web/commits-page2.html +18 -16
| @@ -168,18 +168,20 @@ | |||
| 168 | 168 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 169 | 169 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 170 | 170 | </footer> | |
| 171 | - | <div class="hint" role="status" aria-live="polite"> | |
| 172 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 171 | + | <div class="hint"> | |
| 172 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 173 | 173 | </span> | |
| 174 | + | <span role="status" aria-live="polite"> | |
| 174 | 175 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 175 | 176 | </span> | |
| 176 | 177 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 177 | 178 | </span> | |
| 179 | + | </span> | |
| 178 | 180 | </div> | |
| 179 | 181 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 180 | 182 | <div class="panel-head"> | |
| 181 | 183 | <h2>Keyboard shortcuts</h2> | |
| 182 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 184 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 183 | 185 | <kbd>esc</kbd> close</button> | |
| 184 | 186 | </div> | |
| 185 | 187 | <div class="keys-pref"> | |
| @@ -313,7 +315,7 @@ | |||
| 313 | 315 | <div class="panel-head"> | |
| 314 | 316 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 315 | 317 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 316 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 318 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 317 | 319 | <kbd>esc</kbd> | |
| 318 | 320 | </button> | |
| 319 | 321 | </div> | |
| @@ -340,73 +342,73 @@ | |||
| 340 | 342 | <div class="panel-head"> | |
| 341 | 343 | <label for="cmd-q" class="sr">go to</label> | |
| 342 | 344 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 343 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 345 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 344 | 346 | <kbd>esc</kbd> | |
| 345 | 347 | </button> | |
| 346 | 348 | </div> | |
| 347 | 349 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 348 | 350 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 349 | - | <a href="/" tabindex="-1"> | |
| 351 | + | <a role="presentation" data-href="/"> | |
| 350 | 352 | <span class="lbl">home</span> | |
| 351 | 353 | <span class="k">go</span> | |
| 352 | 354 | </a> | |
| 353 | 355 | </li> | |
| 354 | 356 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 355 | - | <a href="/long" tabindex="-1"> | |
| 357 | + | <a role="presentation" data-href="/long"> | |
| 356 | 358 | <span class="lbl">summary</span> | |
| 357 | 359 | <span class="k">section</span> | |
| 358 | 360 | </a> | |
| 359 | 361 | </li> | |
| 360 | 362 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 361 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 363 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 362 | 364 | <span class="lbl">files</span> | |
| 363 | 365 | <span class="k">section</span> | |
| 364 | 366 | </a> | |
| 365 | 367 | </li> | |
| 366 | 368 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 367 | - | <a href="/long/commits/main" tabindex="-1"> | |
| 369 | + | <a role="presentation" data-href="/long/commits/main"> | |
| 368 | 370 | <span class="lbl">commits</span> | |
| 369 | 371 | <span class="k">section</span> | |
| 370 | 372 | </a> | |
| 371 | 373 | </li> | |
| 372 | 374 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 373 | - | <a href="/long/refs" tabindex="-1"> | |
| 375 | + | <a role="presentation" data-href="/long/refs"> | |
| 374 | 376 | <span class="lbl">branches & tags</span> | |
| 375 | 377 | <span class="k">section</span> | |
| 376 | 378 | </a> | |
| 377 | 379 | </li> | |
| 378 | 380 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 379 | - | <a href="/long/merge-requests" tabindex="-1"> | |
| 381 | + | <a role="presentation" data-href="/long/merge-requests"> | |
| 380 | 382 | <span class="lbl">merge requests</span> | |
| 381 | 383 | <span class="k">section</span> | |
| 382 | 384 | </a> | |
| 383 | 385 | </li> | |
| 384 | 386 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 385 | - | <a href="/long/releases" tabindex="-1"> | |
| 387 | + | <a role="presentation" data-href="/long/releases"> | |
| 386 | 388 | <span class="lbl">releases</span> | |
| 387 | 389 | <span class="k">section</span> | |
| 388 | 390 | </a> | |
| 389 | 391 | </li> | |
| 390 | 392 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 391 | - | <a href="/long/actions" tabindex="-1"> | |
| 393 | + | <a role="presentation" data-href="/long/actions"> | |
| 392 | 394 | <span class="lbl">actions</span> | |
| 393 | 395 | <span class="k">section</span> | |
| 394 | 396 | </a> | |
| 395 | 397 | </li> | |
| 396 | 398 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 397 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 399 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 398 | 400 | <span class="lbl">main</span> | |
| 399 | 401 | <span class="k">branch</span> | |
| 400 | 402 | </a> | |
| 401 | 403 | </li> | |
| 402 | 404 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | |
| 403 | - | <a href="/diffs" tabindex="-1"> | |
| 405 | + | <a role="presentation" data-href="/diffs"> | |
| 404 | 406 | <span class="lbl">diffs</span> | |
| 405 | 407 | <span class="k">repo</span> | |
| 406 | 408 | </a> | |
| 407 | 409 | </li> | |
| 408 | 410 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 409 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 411 | + | <a role="presentation" data-fire="keys"> | |
| 410 | 412 | <span class="lbl">turn single-key shortcuts off</span> | |
| 411 | 413 | <span class="k">action</span> | |
| 412 | 414 | </a> | |
| @@ -168,18 +168,20 @@ | |||||
| 168 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 168 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 169 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 169 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 170 | </footer> | 170 | </footer> | ||
| 171 | - | <div class="hint" role="status" aria-live="polite"> | 171 | + | <div class="hint"> |
| 172 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 172 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 173 | </span> | 173 | </span> | ||
| 174 | + | <span role="status" aria-live="polite"> | |||
| 174 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 175 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 175 | </span> | 176 | </span> | ||
| 176 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 177 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 177 | </span> | 178 | </span> | ||
| 179 | + | </span> | |||
| 178 | </div> | 180 | </div> | ||
| 179 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 181 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 180 | <div class="panel-head"> | 182 | <div class="panel-head"> | ||
| 181 | <h2>Keyboard shortcuts</h2> | 183 | <h2>Keyboard shortcuts</h2> | ||
| 182 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 184 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 183 | <kbd>esc</kbd> close</button> | 185 | <kbd>esc</kbd> close</button> | ||
| 184 | </div> | 186 | </div> | ||
| 185 | <div class="keys-pref"> | 187 | <div class="keys-pref"> | ||
| @@ -313,7 +315,7 @@ | |||||
| 313 | <div class="panel-head"> | 315 | <div class="panel-head"> | ||
| 314 | <label for="refs-filter" class="sr">filter branches and tags</label> | 316 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 315 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 317 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 316 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 318 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 317 | <kbd>esc</kbd> | 319 | <kbd>esc</kbd> | ||
| 318 | </button> | 320 | </button> | ||
| 319 | </div> | 321 | </div> | ||
| @@ -340,73 +342,73 @@ | |||||
| 340 | <div class="panel-head"> | 342 | <div class="panel-head"> | ||
| 341 | <label for="cmd-q" class="sr">go to</label> | 343 | <label for="cmd-q" class="sr">go to</label> | ||
| 342 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 344 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 343 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 345 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 344 | <kbd>esc</kbd> | 346 | <kbd>esc</kbd> | ||
| 345 | </button> | 347 | </button> | ||
| 346 | </div> | 348 | </div> | ||
| 347 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 349 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 348 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 350 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 349 | - | <a href="/" tabindex="-1"> | 351 | + | <a role="presentation" data-href="/"> |
| 350 | <span class="lbl">home</span> | 352 | <span class="lbl">home</span> | ||
| 351 | <span class="k">go</span> | 353 | <span class="k">go</span> | ||
| 352 | </a> | 354 | </a> | ||
| 353 | </li> | 355 | </li> | ||
| 354 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 356 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 355 | - | <a href="/long" tabindex="-1"> | 357 | + | <a role="presentation" data-href="/long"> |
| 356 | <span class="lbl">summary</span> | 358 | <span class="lbl">summary</span> | ||
| 357 | <span class="k">section</span> | 359 | <span class="k">section</span> | ||
| 358 | </a> | 360 | </a> | ||
| 359 | </li> | 361 | </li> | ||
| 360 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 362 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 361 | - | <a href="/long/tree/main" tabindex="-1"> | 363 | + | <a role="presentation" data-href="/long/tree/main"> |
| 362 | <span class="lbl">files</span> | 364 | <span class="lbl">files</span> | ||
| 363 | <span class="k">section</span> | 365 | <span class="k">section</span> | ||
| 364 | </a> | 366 | </a> | ||
| 365 | </li> | 367 | </li> | ||
| 366 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 368 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 367 | - | <a href="/long/commits/main" tabindex="-1"> | 369 | + | <a role="presentation" data-href="/long/commits/main"> |
| 368 | <span class="lbl">commits</span> | 370 | <span class="lbl">commits</span> | ||
| 369 | <span class="k">section</span> | 371 | <span class="k">section</span> | ||
| 370 | </a> | 372 | </a> | ||
| 371 | </li> | 373 | </li> | ||
| 372 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 374 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 373 | - | <a href="/long/refs" tabindex="-1"> | 375 | + | <a role="presentation" data-href="/long/refs"> |
| 374 | <span class="lbl">branches & tags</span> | 376 | <span class="lbl">branches & tags</span> | ||
| 375 | <span class="k">section</span> | 377 | <span class="k">section</span> | ||
| 376 | </a> | 378 | </a> | ||
| 377 | </li> | 379 | </li> | ||
| 378 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 380 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 379 | - | <a href="/long/merge-requests" tabindex="-1"> | 381 | + | <a role="presentation" data-href="/long/merge-requests"> |
| 380 | <span class="lbl">merge requests</span> | 382 | <span class="lbl">merge requests</span> | ||
| 381 | <span class="k">section</span> | 383 | <span class="k">section</span> | ||
| 382 | </a> | 384 | </a> | ||
| 383 | </li> | 385 | </li> | ||
| 384 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 386 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 385 | - | <a href="/long/releases" tabindex="-1"> | 387 | + | <a role="presentation" data-href="/long/releases"> |
| 386 | <span class="lbl">releases</span> | 388 | <span class="lbl">releases</span> | ||
| 387 | <span class="k">section</span> | 389 | <span class="k">section</span> | ||
| 388 | </a> | 390 | </a> | ||
| 389 | </li> | 391 | </li> | ||
| 390 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 392 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 391 | - | <a href="/long/actions" tabindex="-1"> | 393 | + | <a role="presentation" data-href="/long/actions"> |
| 392 | <span class="lbl">actions</span> | 394 | <span class="lbl">actions</span> | ||
| 393 | <span class="k">section</span> | 395 | <span class="k">section</span> | ||
| 394 | </a> | 396 | </a> | ||
| 395 | </li> | 397 | </li> | ||
| 396 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 398 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 397 | - | <a href="/long/tree/main" tabindex="-1"> | 399 | + | <a role="presentation" data-href="/long/tree/main"> |
| 398 | <span class="lbl">main</span> | 400 | <span class="lbl">main</span> | ||
| 399 | <span class="k">branch</span> | 401 | <span class="k">branch</span> | ||
| 400 | </a> | 402 | </a> | ||
| 401 | </li> | 403 | </li> | ||
| 402 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | 404 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | ||
| 403 | - | <a href="/diffs" tabindex="-1"> | 405 | + | <a role="presentation" data-href="/diffs"> |
| 404 | <span class="lbl">diffs</span> | 406 | <span class="lbl">diffs</span> | ||
| 405 | <span class="k">repo</span> | 407 | <span class="k">repo</span> | ||
| 406 | </a> | 408 | </a> | ||
| 407 | </li> | 409 | </li> | ||
| 408 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 410 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 409 | - | <a href="#" data-fire="keys" tabindex="-1"> | 411 | + | <a role="presentation" data-fire="keys"> |
| 410 | <span class="lbl">turn single-key shortcuts off</span> | 412 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 411 | <span class="k">action</span> | 413 | <span class="k">action</span> | ||
| 412 | </a> | 414 | </a> | ||
M internal/app/testdata/web/commits-path.html +18 -16
| @@ -183,18 +183,20 @@ | |||
| 183 | 183 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 184 | 184 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 185 | 185 | </footer> | |
| 186 | - | <div class="hint" role="status" aria-live="polite"> | |
| 187 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 186 | + | <div class="hint"> | |
| 187 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 188 | 188 | </span> | |
| 189 | + | <span role="status" aria-live="polite"> | |
| 189 | 190 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 190 | 191 | </span> | |
| 191 | 192 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 192 | 193 | </span> | |
| 194 | + | </span> | |
| 193 | 195 | </div> | |
| 194 | 196 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 195 | 197 | <div class="panel-head"> | |
| 196 | 198 | <h2>Keyboard shortcuts</h2> | |
| 197 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 199 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 198 | 200 | <kbd>esc</kbd> close</button> | |
| 199 | 201 | </div> | |
| 200 | 202 | <div class="keys-pref"> | |
| @@ -328,7 +330,7 @@ | |||
| 328 | 330 | <div class="panel-head"> | |
| 329 | 331 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 330 | 332 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 331 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 333 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 332 | 334 | <kbd>esc</kbd> | |
| 333 | 335 | </button> | |
| 334 | 336 | </div> | |
| @@ -355,73 +357,73 @@ | |||
| 355 | 357 | <div class="panel-head"> | |
| 356 | 358 | <label for="cmd-q" class="sr">go to</label> | |
| 357 | 359 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 358 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 360 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 359 | 361 | <kbd>esc</kbd> | |
| 360 | 362 | </button> | |
| 361 | 363 | </div> | |
| 362 | 364 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 363 | 365 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 364 | - | <a href="/" tabindex="-1"> | |
| 366 | + | <a role="presentation" data-href="/"> | |
| 365 | 367 | <span class="lbl">home</span> | |
| 366 | 368 | <span class="k">go</span> | |
| 367 | 369 | </a> | |
| 368 | 370 | </li> | |
| 369 | 371 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 370 | - | <a href="/long" tabindex="-1"> | |
| 372 | + | <a role="presentation" data-href="/long"> | |
| 371 | 373 | <span class="lbl">summary</span> | |
| 372 | 374 | <span class="k">section</span> | |
| 373 | 375 | </a> | |
| 374 | 376 | </li> | |
| 375 | 377 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 376 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 378 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 377 | 379 | <span class="lbl">files</span> | |
| 378 | 380 | <span class="k">section</span> | |
| 379 | 381 | </a> | |
| 380 | 382 | </li> | |
| 381 | 383 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 382 | - | <a href="/long/commits/main" tabindex="-1"> | |
| 384 | + | <a role="presentation" data-href="/long/commits/main"> | |
| 383 | 385 | <span class="lbl">commits</span> | |
| 384 | 386 | <span class="k">section</span> | |
| 385 | 387 | </a> | |
| 386 | 388 | </li> | |
| 387 | 389 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 388 | - | <a href="/long/refs" tabindex="-1"> | |
| 390 | + | <a role="presentation" data-href="/long/refs"> | |
| 389 | 391 | <span class="lbl">branches & tags</span> | |
| 390 | 392 | <span class="k">section</span> | |
| 391 | 393 | </a> | |
| 392 | 394 | </li> | |
| 393 | 395 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 394 | - | <a href="/long/merge-requests" tabindex="-1"> | |
| 396 | + | <a role="presentation" data-href="/long/merge-requests"> | |
| 395 | 397 | <span class="lbl">merge requests</span> | |
| 396 | 398 | <span class="k">section</span> | |
| 397 | 399 | </a> | |
| 398 | 400 | </li> | |
| 399 | 401 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 400 | - | <a href="/long/releases" tabindex="-1"> | |
| 402 | + | <a role="presentation" data-href="/long/releases"> | |
| 401 | 403 | <span class="lbl">releases</span> | |
| 402 | 404 | <span class="k">section</span> | |
| 403 | 405 | </a> | |
| 404 | 406 | </li> | |
| 405 | 407 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 406 | - | <a href="/long/actions" tabindex="-1"> | |
| 408 | + | <a role="presentation" data-href="/long/actions"> | |
| 407 | 409 | <span class="lbl">actions</span> | |
| 408 | 410 | <span class="k">section</span> | |
| 409 | 411 | </a> | |
| 410 | 412 | </li> | |
| 411 | 413 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 412 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 414 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 413 | 415 | <span class="lbl">main</span> | |
| 414 | 416 | <span class="k">branch</span> | |
| 415 | 417 | </a> | |
| 416 | 418 | </li> | |
| 417 | 419 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | |
| 418 | - | <a href="/diffs" tabindex="-1"> | |
| 420 | + | <a role="presentation" data-href="/diffs"> | |
| 419 | 421 | <span class="lbl">diffs</span> | |
| 420 | 422 | <span class="k">repo</span> | |
| 421 | 423 | </a> | |
| 422 | 424 | </li> | |
| 423 | 425 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 424 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 426 | + | <a role="presentation" data-fire="keys"> | |
| 425 | 427 | <span class="lbl">turn single-key shortcuts off</span> | |
| 426 | 428 | <span class="k">action</span> | |
| 427 | 429 | </a> | |
| @@ -183,18 +183,20 @@ | |||||
| 183 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 183 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 184 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 184 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 185 | </footer> | 185 | </footer> | ||
| 186 | - | <div class="hint" role="status" aria-live="polite"> | 186 | + | <div class="hint"> |
| 187 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 187 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 188 | </span> | 188 | </span> | ||
| 189 | + | <span role="status" aria-live="polite"> | |||
| 189 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 190 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 190 | </span> | 191 | </span> | ||
| 191 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 192 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 192 | </span> | 193 | </span> | ||
| 194 | + | </span> | |||
| 193 | </div> | 195 | </div> | ||
| 194 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 196 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 195 | <div class="panel-head"> | 197 | <div class="panel-head"> | ||
| 196 | <h2>Keyboard shortcuts</h2> | 198 | <h2>Keyboard shortcuts</h2> | ||
| 197 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 199 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 198 | <kbd>esc</kbd> close</button> | 200 | <kbd>esc</kbd> close</button> | ||
| 199 | </div> | 201 | </div> | ||
| 200 | <div class="keys-pref"> | 202 | <div class="keys-pref"> | ||
| @@ -328,7 +330,7 @@ | |||||
| 328 | <div class="panel-head"> | 330 | <div class="panel-head"> | ||
| 329 | <label for="refs-filter" class="sr">filter branches and tags</label> | 331 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 330 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 332 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 331 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 333 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 332 | <kbd>esc</kbd> | 334 | <kbd>esc</kbd> | ||
| 333 | </button> | 335 | </button> | ||
| 334 | </div> | 336 | </div> | ||
| @@ -355,73 +357,73 @@ | |||||
| 355 | <div class="panel-head"> | 357 | <div class="panel-head"> | ||
| 356 | <label for="cmd-q" class="sr">go to</label> | 358 | <label for="cmd-q" class="sr">go to</label> | ||
| 357 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 359 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 358 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 360 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 359 | <kbd>esc</kbd> | 361 | <kbd>esc</kbd> | ||
| 360 | </button> | 362 | </button> | ||
| 361 | </div> | 363 | </div> | ||
| 362 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 364 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 363 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 365 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 364 | - | <a href="/" tabindex="-1"> | 366 | + | <a role="presentation" data-href="/"> |
| 365 | <span class="lbl">home</span> | 367 | <span class="lbl">home</span> | ||
| 366 | <span class="k">go</span> | 368 | <span class="k">go</span> | ||
| 367 | </a> | 369 | </a> | ||
| 368 | </li> | 370 | </li> | ||
| 369 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 371 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 370 | - | <a href="/long" tabindex="-1"> | 372 | + | <a role="presentation" data-href="/long"> |
| 371 | <span class="lbl">summary</span> | 373 | <span class="lbl">summary</span> | ||
| 372 | <span class="k">section</span> | 374 | <span class="k">section</span> | ||
| 373 | </a> | 375 | </a> | ||
| 374 | </li> | 376 | </li> | ||
| 375 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 377 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 376 | - | <a href="/long/tree/main" tabindex="-1"> | 378 | + | <a role="presentation" data-href="/long/tree/main"> |
| 377 | <span class="lbl">files</span> | 379 | <span class="lbl">files</span> | ||
| 378 | <span class="k">section</span> | 380 | <span class="k">section</span> | ||
| 379 | </a> | 381 | </a> | ||
| 380 | </li> | 382 | </li> | ||
| 381 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 383 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 382 | - | <a href="/long/commits/main" tabindex="-1"> | 384 | + | <a role="presentation" data-href="/long/commits/main"> |
| 383 | <span class="lbl">commits</span> | 385 | <span class="lbl">commits</span> | ||
| 384 | <span class="k">section</span> | 386 | <span class="k">section</span> | ||
| 385 | </a> | 387 | </a> | ||
| 386 | </li> | 388 | </li> | ||
| 387 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 389 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 388 | - | <a href="/long/refs" tabindex="-1"> | 390 | + | <a role="presentation" data-href="/long/refs"> |
| 389 | <span class="lbl">branches & tags</span> | 391 | <span class="lbl">branches & tags</span> | ||
| 390 | <span class="k">section</span> | 392 | <span class="k">section</span> | ||
| 391 | </a> | 393 | </a> | ||
| 392 | </li> | 394 | </li> | ||
| 393 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 395 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 394 | - | <a href="/long/merge-requests" tabindex="-1"> | 396 | + | <a role="presentation" data-href="/long/merge-requests"> |
| 395 | <span class="lbl">merge requests</span> | 397 | <span class="lbl">merge requests</span> | ||
| 396 | <span class="k">section</span> | 398 | <span class="k">section</span> | ||
| 397 | </a> | 399 | </a> | ||
| 398 | </li> | 400 | </li> | ||
| 399 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 401 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 400 | - | <a href="/long/releases" tabindex="-1"> | 402 | + | <a role="presentation" data-href="/long/releases"> |
| 401 | <span class="lbl">releases</span> | 403 | <span class="lbl">releases</span> | ||
| 402 | <span class="k">section</span> | 404 | <span class="k">section</span> | ||
| 403 | </a> | 405 | </a> | ||
| 404 | </li> | 406 | </li> | ||
| 405 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 407 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 406 | - | <a href="/long/actions" tabindex="-1"> | 408 | + | <a role="presentation" data-href="/long/actions"> |
| 407 | <span class="lbl">actions</span> | 409 | <span class="lbl">actions</span> | ||
| 408 | <span class="k">section</span> | 410 | <span class="k">section</span> | ||
| 409 | </a> | 411 | </a> | ||
| 410 | </li> | 412 | </li> | ||
| 411 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 413 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 412 | - | <a href="/long/tree/main" tabindex="-1"> | 414 | + | <a role="presentation" data-href="/long/tree/main"> |
| 413 | <span class="lbl">main</span> | 415 | <span class="lbl">main</span> | ||
| 414 | <span class="k">branch</span> | 416 | <span class="k">branch</span> | ||
| 415 | </a> | 417 | </a> | ||
| 416 | </li> | 418 | </li> | ||
| 417 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | 419 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | ||
| 418 | - | <a href="/diffs" tabindex="-1"> | 420 | + | <a role="presentation" data-href="/diffs"> |
| 419 | <span class="lbl">diffs</span> | 421 | <span class="lbl">diffs</span> | ||
| 420 | <span class="k">repo</span> | 422 | <span class="k">repo</span> | ||
| 421 | </a> | 423 | </a> | ||
| 422 | </li> | 424 | </li> | ||
| 423 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 425 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 424 | - | <a href="#" data-fire="keys" tabindex="-1"> | 426 | + | <a role="presentation" data-fire="keys"> |
| 425 | <span class="lbl">turn single-key shortcuts off</span> | 427 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 426 | <span class="k">action</span> | 428 | <span class="k">action</span> | ||
| 427 | </a> | 429 | </a> | ||
M internal/app/testdata/web/commits-root.html +19 -17
| @@ -965,14 +965,16 @@ | |||
| 965 | 965 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 966 | 966 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 967 | 967 | </footer> | |
| 968 | - | <div class="hint" role="status" aria-live="polite"> | |
| 969 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 968 | + | <div class="hint"> | |
| 969 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 970 | 970 | </span> | |
| 971 | + | <span role="status" aria-live="polite"> | |
| 971 | 972 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 972 | 973 | </span> | |
| 973 | 974 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 974 | 975 | </span> | |
| 975 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Along&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 976 | + | </span> | |
| 977 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Along&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 976 | 978 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | |
| 977 | 979 | htmx:sse:error -> ermiteLive.error(event.detail.status); | |
| 978 | 980 | htmx:sse:before:connection -> ermiteLive.gate(event); | |
| @@ -984,7 +986,7 @@ | |||
| 984 | 986 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 985 | 987 | <div class="panel-head"> | |
| 986 | 988 | <h2>Keyboard shortcuts</h2> | |
| 987 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 989 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 988 | 990 | <kbd>esc</kbd> close</button> | |
| 989 | 991 | </div> | |
| 990 | 992 | <div class="keys-pref"> | |
| @@ -1118,7 +1120,7 @@ | |||
| 1118 | 1120 | <div class="panel-head"> | |
| 1119 | 1121 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 1120 | 1122 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 1121 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 1123 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 1122 | 1124 | <kbd>esc</kbd> | |
| 1123 | 1125 | </button> | |
| 1124 | 1126 | </div> | |
| @@ -1145,73 +1147,73 @@ | |||
| 1145 | 1147 | <div class="panel-head"> | |
| 1146 | 1148 | <label for="cmd-q" class="sr">go to</label> | |
| 1147 | 1149 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 1148 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 1150 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 1149 | 1151 | <kbd>esc</kbd> | |
| 1150 | 1152 | </button> | |
| 1151 | 1153 | </div> | |
| 1152 | 1154 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 1153 | 1155 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 1154 | - | <a href="/" tabindex="-1"> | |
| 1156 | + | <a role="presentation" data-href="/"> | |
| 1155 | 1157 | <span class="lbl">home</span> | |
| 1156 | 1158 | <span class="k">go</span> | |
| 1157 | 1159 | </a> | |
| 1158 | 1160 | </li> | |
| 1159 | 1161 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 1160 | - | <a href="/long" tabindex="-1"> | |
| 1162 | + | <a role="presentation" data-href="/long"> | |
| 1161 | 1163 | <span class="lbl">summary</span> | |
| 1162 | 1164 | <span class="k">section</span> | |
| 1163 | 1165 | </a> | |
| 1164 | 1166 | </li> | |
| 1165 | 1167 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 1166 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 1168 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 1167 | 1169 | <span class="lbl">files</span> | |
| 1168 | 1170 | <span class="k">section</span> | |
| 1169 | 1171 | </a> | |
| 1170 | 1172 | </li> | |
| 1171 | 1173 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 1172 | - | <a href="/long/commits/main" tabindex="-1"> | |
| 1174 | + | <a role="presentation" data-href="/long/commits/main"> | |
| 1173 | 1175 | <span class="lbl">commits</span> | |
| 1174 | 1176 | <span class="k">section</span> | |
| 1175 | 1177 | </a> | |
| 1176 | 1178 | </li> | |
| 1177 | 1179 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 1178 | - | <a href="/long/refs" tabindex="-1"> | |
| 1180 | + | <a role="presentation" data-href="/long/refs"> | |
| 1179 | 1181 | <span class="lbl">branches & tags</span> | |
| 1180 | 1182 | <span class="k">section</span> | |
| 1181 | 1183 | </a> | |
| 1182 | 1184 | </li> | |
| 1183 | 1185 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 1184 | - | <a href="/long/merge-requests" tabindex="-1"> | |
| 1186 | + | <a role="presentation" data-href="/long/merge-requests"> | |
| 1185 | 1187 | <span class="lbl">merge requests</span> | |
| 1186 | 1188 | <span class="k">section</span> | |
| 1187 | 1189 | </a> | |
| 1188 | 1190 | </li> | |
| 1189 | 1191 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 1190 | - | <a href="/long/releases" tabindex="-1"> | |
| 1192 | + | <a role="presentation" data-href="/long/releases"> | |
| 1191 | 1193 | <span class="lbl">releases</span> | |
| 1192 | 1194 | <span class="k">section</span> | |
| 1193 | 1195 | </a> | |
| 1194 | 1196 | </li> | |
| 1195 | 1197 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 1196 | - | <a href="/long/actions" tabindex="-1"> | |
| 1198 | + | <a role="presentation" data-href="/long/actions"> | |
| 1197 | 1199 | <span class="lbl">actions</span> | |
| 1198 | 1200 | <span class="k">section</span> | |
| 1199 | 1201 | </a> | |
| 1200 | 1202 | </li> | |
| 1201 | 1203 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 1202 | - | <a href="/long/tree/main" tabindex="-1"> | |
| 1204 | + | <a role="presentation" data-href="/long/tree/main"> | |
| 1203 | 1205 | <span class="lbl">main</span> | |
| 1204 | 1206 | <span class="k">branch</span> | |
| 1205 | 1207 | </a> | |
| 1206 | 1208 | </li> | |
| 1207 | 1209 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | |
| 1208 | - | <a href="/diffs" tabindex="-1"> | |
| 1210 | + | <a role="presentation" data-href="/diffs"> | |
| 1209 | 1211 | <span class="lbl">diffs</span> | |
| 1210 | 1212 | <span class="k">repo</span> | |
| 1211 | 1213 | </a> | |
| 1212 | 1214 | </li> | |
| 1213 | 1215 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 1214 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 1216 | + | <a role="presentation" data-fire="keys"> | |
| 1215 | 1217 | <span class="lbl">turn single-key shortcuts off</span> | |
| 1216 | 1218 | <span class="k">action</span> | |
| 1217 | 1219 | </a> | |
| @@ -965,14 +965,16 @@ | |||||
| 965 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 965 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 966 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 966 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 967 | </footer> | 967 | </footer> | ||
| 968 | - | <div class="hint" role="status" aria-live="polite"> | 968 | + | <div class="hint"> |
| 969 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 969 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 970 | </span> | 970 | </span> | ||
| 971 | + | <span role="status" aria-live="polite"> | |||
| 971 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 972 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 972 | </span> | 973 | </span> | ||
| 973 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 974 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 974 | </span> | 975 | </span> | ||
| 975 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Along&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | 976 | + | </span> |
| 977 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Along&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |||
| 976 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | 978 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | ||
| 977 | htmx:sse:error -> ermiteLive.error(event.detail.status); | 979 | htmx:sse:error -> ermiteLive.error(event.detail.status); | ||
| 978 | htmx:sse:before:connection -> ermiteLive.gate(event); | 980 | htmx:sse:before:connection -> ermiteLive.gate(event); | ||
| @@ -984,7 +986,7 @@ | |||||
| 984 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 986 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 985 | <div class="panel-head"> | 987 | <div class="panel-head"> | ||
| 986 | <h2>Keyboard shortcuts</h2> | 988 | <h2>Keyboard shortcuts</h2> | ||
| 987 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 989 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 988 | <kbd>esc</kbd> close</button> | 990 | <kbd>esc</kbd> close</button> | ||
| 989 | </div> | 991 | </div> | ||
| 990 | <div class="keys-pref"> | 992 | <div class="keys-pref"> | ||
| @@ -1118,7 +1120,7 @@ | |||||
| 1118 | <div class="panel-head"> | 1120 | <div class="panel-head"> | ||
| 1119 | <label for="refs-filter" class="sr">filter branches and tags</label> | 1121 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 1120 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 1122 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 1121 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 1123 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 1122 | <kbd>esc</kbd> | 1124 | <kbd>esc</kbd> | ||
| 1123 | </button> | 1125 | </button> | ||
| 1124 | </div> | 1126 | </div> | ||
| @@ -1145,73 +1147,73 @@ | |||||
| 1145 | <div class="panel-head"> | 1147 | <div class="panel-head"> | ||
| 1146 | <label for="cmd-q" class="sr">go to</label> | 1148 | <label for="cmd-q" class="sr">go to</label> | ||
| 1147 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 1149 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 1148 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 1150 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 1149 | <kbd>esc</kbd> | 1151 | <kbd>esc</kbd> | ||
| 1150 | </button> | 1152 | </button> | ||
| 1151 | </div> | 1153 | </div> | ||
| 1152 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 1154 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 1153 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 1155 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 1154 | - | <a href="/" tabindex="-1"> | 1156 | + | <a role="presentation" data-href="/"> |
| 1155 | <span class="lbl">home</span> | 1157 | <span class="lbl">home</span> | ||
| 1156 | <span class="k">go</span> | 1158 | <span class="k">go</span> | ||
| 1157 | </a> | 1159 | </a> | ||
| 1158 | </li> | 1160 | </li> | ||
| 1159 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 1161 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 1160 | - | <a href="/long" tabindex="-1"> | 1162 | + | <a role="presentation" data-href="/long"> |
| 1161 | <span class="lbl">summary</span> | 1163 | <span class="lbl">summary</span> | ||
| 1162 | <span class="k">section</span> | 1164 | <span class="k">section</span> | ||
| 1163 | </a> | 1165 | </a> | ||
| 1164 | </li> | 1166 | </li> | ||
| 1165 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 1167 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 1166 | - | <a href="/long/tree/main" tabindex="-1"> | 1168 | + | <a role="presentation" data-href="/long/tree/main"> |
| 1167 | <span class="lbl">files</span> | 1169 | <span class="lbl">files</span> | ||
| 1168 | <span class="k">section</span> | 1170 | <span class="k">section</span> | ||
| 1169 | </a> | 1171 | </a> | ||
| 1170 | </li> | 1172 | </li> | ||
| 1171 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 1173 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 1172 | - | <a href="/long/commits/main" tabindex="-1"> | 1174 | + | <a role="presentation" data-href="/long/commits/main"> |
| 1173 | <span class="lbl">commits</span> | 1175 | <span class="lbl">commits</span> | ||
| 1174 | <span class="k">section</span> | 1176 | <span class="k">section</span> | ||
| 1175 | </a> | 1177 | </a> | ||
| 1176 | </li> | 1178 | </li> | ||
| 1177 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 1179 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 1178 | - | <a href="/long/refs" tabindex="-1"> | 1180 | + | <a role="presentation" data-href="/long/refs"> |
| 1179 | <span class="lbl">branches & tags</span> | 1181 | <span class="lbl">branches & tags</span> | ||
| 1180 | <span class="k">section</span> | 1182 | <span class="k">section</span> | ||
| 1181 | </a> | 1183 | </a> | ||
| 1182 | </li> | 1184 | </li> | ||
| 1183 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 1185 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 1184 | - | <a href="/long/merge-requests" tabindex="-1"> | 1186 | + | <a role="presentation" data-href="/long/merge-requests"> |
| 1185 | <span class="lbl">merge requests</span> | 1187 | <span class="lbl">merge requests</span> | ||
| 1186 | <span class="k">section</span> | 1188 | <span class="k">section</span> | ||
| 1187 | </a> | 1189 | </a> | ||
| 1188 | </li> | 1190 | </li> | ||
| 1189 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 1191 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 1190 | - | <a href="/long/releases" tabindex="-1"> | 1192 | + | <a role="presentation" data-href="/long/releases"> |
| 1191 | <span class="lbl">releases</span> | 1193 | <span class="lbl">releases</span> | ||
| 1192 | <span class="k">section</span> | 1194 | <span class="k">section</span> | ||
| 1193 | </a> | 1195 | </a> | ||
| 1194 | </li> | 1196 | </li> | ||
| 1195 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 1197 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 1196 | - | <a href="/long/actions" tabindex="-1"> | 1198 | + | <a role="presentation" data-href="/long/actions"> |
| 1197 | <span class="lbl">actions</span> | 1199 | <span class="lbl">actions</span> | ||
| 1198 | <span class="k">section</span> | 1200 | <span class="k">section</span> | ||
| 1199 | </a> | 1201 | </a> | ||
| 1200 | </li> | 1202 | </li> | ||
| 1201 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 1203 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 1202 | - | <a href="/long/tree/main" tabindex="-1"> | 1204 | + | <a role="presentation" data-href="/long/tree/main"> |
| 1203 | <span class="lbl">main</span> | 1205 | <span class="lbl">main</span> | ||
| 1204 | <span class="k">branch</span> | 1206 | <span class="k">branch</span> | ||
| 1205 | </a> | 1207 | </a> | ||
| 1206 | </li> | 1208 | </li> | ||
| 1207 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | 1209 | <li id="cmd-o9" role="option" aria-selected="false" data-k="repo diffs"> | ||
| 1208 | - | <a href="/diffs" tabindex="-1"> | 1210 | + | <a role="presentation" data-href="/diffs"> |
| 1209 | <span class="lbl">diffs</span> | 1211 | <span class="lbl">diffs</span> | ||
| 1210 | <span class="k">repo</span> | 1212 | <span class="k">repo</span> | ||
| 1211 | </a> | 1213 | </a> | ||
| 1212 | </li> | 1214 | </li> | ||
| 1213 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 1215 | <li id="cmd-o10" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 1214 | - | <a href="#" data-fire="keys" tabindex="-1"> | 1216 | + | <a role="presentation" data-fire="keys"> |
| 1215 | <span class="lbl">turn single-key shortcuts off</span> | 1217 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 1216 | <span class="k">action</span> | 1218 | <span class="k">action</span> | ||
| 1217 | </a> | 1219 | </a> | ||
M internal/app/testdata/web/commits-small.html +21 -19
| @@ -310,14 +310,16 @@ | |||
| 310 | 310 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 311 | 311 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 312 | 312 | </footer> | |
| 313 | - | <div class="hint" role="status" aria-live="polite"> | |
| 314 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 313 | + | <div class="hint"> | |
| 314 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 315 | 315 | </span> | |
| 316 | + | <span role="status" aria-live="polite"> | |
| 316 | 317 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 317 | 318 | </span> | |
| 318 | 319 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 319 | 320 | </span> | |
| 320 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Adiffs&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 321 | + | </span> | |
| 322 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Adiffs&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 321 | 323 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | |
| 322 | 324 | htmx:sse:error -> ermiteLive.error(event.detail.status); | |
| 323 | 325 | htmx:sse:before:connection -> ermiteLive.gate(event); | |
| @@ -329,7 +331,7 @@ | |||
| 329 | 331 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 330 | 332 | <div class="panel-head"> | |
| 331 | 333 | <h2>Keyboard shortcuts</h2> | |
| 332 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 334 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 333 | 335 | <kbd>esc</kbd> close</button> | |
| 334 | 336 | </div> | |
| 335 | 337 | <div class="keys-pref"> | |
| @@ -463,7 +465,7 @@ | |||
| 463 | 465 | <div class="panel-head"> | |
| 464 | 466 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 465 | 467 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 466 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 468 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 467 | 469 | <kbd>esc</kbd> | |
| 468 | 470 | </button> | |
| 469 | 471 | </div> | |
| @@ -498,85 +500,85 @@ | |||
| 498 | 500 | <div class="panel-head"> | |
| 499 | 501 | <label for="cmd-q" class="sr">go to</label> | |
| 500 | 502 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 501 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 503 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 502 | 504 | <kbd>esc</kbd> | |
| 503 | 505 | </button> | |
| 504 | 506 | </div> | |
| 505 | 507 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 506 | 508 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 507 | - | <a href="/" tabindex="-1"> | |
| 509 | + | <a role="presentation" data-href="/"> | |
| 508 | 510 | <span class="lbl">home</span> | |
| 509 | 511 | <span class="k">go</span> | |
| 510 | 512 | </a> | |
| 511 | 513 | </li> | |
| 512 | 514 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 513 | - | <a href="/diffs" tabindex="-1"> | |
| 515 | + | <a role="presentation" data-href="/diffs"> | |
| 514 | 516 | <span class="lbl">summary</span> | |
| 515 | 517 | <span class="k">section</span> | |
| 516 | 518 | </a> | |
| 517 | 519 | </li> | |
| 518 | 520 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 519 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 521 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 520 | 522 | <span class="lbl">files</span> | |
| 521 | 523 | <span class="k">section</span> | |
| 522 | 524 | </a> | |
| 523 | 525 | </li> | |
| 524 | 526 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 525 | - | <a href="/diffs/commits/main" tabindex="-1"> | |
| 527 | + | <a role="presentation" data-href="/diffs/commits/main"> | |
| 526 | 528 | <span class="lbl">commits</span> | |
| 527 | 529 | <span class="k">section</span> | |
| 528 | 530 | </a> | |
| 529 | 531 | </li> | |
| 530 | 532 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 531 | - | <a href="/diffs/refs" tabindex="-1"> | |
| 533 | + | <a role="presentation" data-href="/diffs/refs"> | |
| 532 | 534 | <span class="lbl">branches & tags</span> | |
| 533 | 535 | <span class="k">section</span> | |
| 534 | 536 | </a> | |
| 535 | 537 | </li> | |
| 536 | 538 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 537 | - | <a href="/diffs/merge-requests" tabindex="-1"> | |
| 539 | + | <a role="presentation" data-href="/diffs/merge-requests"> | |
| 538 | 540 | <span class="lbl">merge requests</span> | |
| 539 | 541 | <span class="k">section</span> | |
| 540 | 542 | </a> | |
| 541 | 543 | </li> | |
| 542 | 544 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 543 | - | <a href="/diffs/releases" tabindex="-1"> | |
| 545 | + | <a role="presentation" data-href="/diffs/releases"> | |
| 544 | 546 | <span class="lbl">releases</span> | |
| 545 | 547 | <span class="k">section</span> | |
| 546 | 548 | </a> | |
| 547 | 549 | </li> | |
| 548 | 550 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 549 | - | <a href="/diffs/actions" tabindex="-1"> | |
| 551 | + | <a role="presentation" data-href="/diffs/actions"> | |
| 550 | 552 | <span class="lbl">actions</span> | |
| 551 | 553 | <span class="k">section</span> | |
| 552 | 554 | </a> | |
| 553 | 555 | </li> | |
| 554 | 556 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | |
| 555 | - | <a href="/diffs/tree/main" tabindex="-1"> | |
| 557 | + | <a role="presentation" data-href="/diffs/tree/main"> | |
| 556 | 558 | <span class="lbl">main</span> | |
| 557 | 559 | <span class="k">branch</span> | |
| 558 | 560 | </a> | |
| 559 | 561 | </li> | |
| 560 | 562 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | |
| 561 | - | <a href="/diffs/tree/side" tabindex="-1"> | |
| 563 | + | <a role="presentation" data-href="/diffs/tree/side"> | |
| 562 | 564 | <span class="lbl">side</span> | |
| 563 | 565 | <span class="k">branch</span> | |
| 564 | 566 | </a> | |
| 565 | 567 | </li> | |
| 566 | 568 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | |
| 567 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | |
| 569 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> | |
| 568 | 570 | <span class="lbl">v1.0.0</span> | |
| 569 | 571 | <span class="k">tag</span> | |
| 570 | 572 | </a> | |
| 571 | 573 | </li> | |
| 572 | 574 | <li id="cmd-o11" role="option" aria-selected="false" data-k="repo long"> | |
| 573 | - | <a href="/long" tabindex="-1"> | |
| 575 | + | <a role="presentation" data-href="/long"> | |
| 574 | 576 | <span class="lbl">long</span> | |
| 575 | 577 | <span class="k">repo</span> | |
| 576 | 578 | </a> | |
| 577 | 579 | </li> | |
| 578 | 580 | <li id="cmd-o12" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 579 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 581 | + | <a role="presentation" data-fire="keys"> | |
| 580 | 582 | <span class="lbl">turn single-key shortcuts off</span> | |
| 581 | 583 | <span class="k">action</span> | |
| 582 | 584 | </a> | |
| @@ -310,14 +310,16 @@ | |||||
| 310 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 310 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 311 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 311 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 312 | </footer> | 312 | </footer> | ||
| 313 | - | <div class="hint" role="status" aria-live="polite"> | 313 | + | <div class="hint"> |
| 314 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 314 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 315 | </span> | 315 | </span> | ||
| 316 | + | <span role="status" aria-live="polite"> | |||
| 316 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 317 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 317 | </span> | 318 | </span> | ||
| 318 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 319 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 319 | </span> | 320 | </span> | ||
| 320 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Adiffs&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | 321 | + | </span> |
| 322 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Adiffs&view=commits&ref=main&head=SHA40" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |||
| 321 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | 323 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | ||
| 322 | htmx:sse:error -> ermiteLive.error(event.detail.status); | 324 | htmx:sse:error -> ermiteLive.error(event.detail.status); | ||
| 323 | htmx:sse:before:connection -> ermiteLive.gate(event); | 325 | htmx:sse:before:connection -> ermiteLive.gate(event); | ||
| @@ -329,7 +331,7 @@ | |||||
| 329 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 331 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 330 | <div class="panel-head"> | 332 | <div class="panel-head"> | ||
| 331 | <h2>Keyboard shortcuts</h2> | 333 | <h2>Keyboard shortcuts</h2> | ||
| 332 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 334 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 333 | <kbd>esc</kbd> close</button> | 335 | <kbd>esc</kbd> close</button> | ||
| 334 | </div> | 336 | </div> | ||
| 335 | <div class="keys-pref"> | 337 | <div class="keys-pref"> | ||
| @@ -463,7 +465,7 @@ | |||||
| 463 | <div class="panel-head"> | 465 | <div class="panel-head"> | ||
| 464 | <label for="refs-filter" class="sr">filter branches and tags</label> | 466 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 465 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 467 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 466 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 468 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 467 | <kbd>esc</kbd> | 469 | <kbd>esc</kbd> | ||
| 468 | </button> | 470 | </button> | ||
| 469 | </div> | 471 | </div> | ||
| @@ -498,85 +500,85 @@ | |||||
| 498 | <div class="panel-head"> | 500 | <div class="panel-head"> | ||
| 499 | <label for="cmd-q" class="sr">go to</label> | 501 | <label for="cmd-q" class="sr">go to</label> | ||
| 500 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 502 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 501 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 503 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 502 | <kbd>esc</kbd> | 504 | <kbd>esc</kbd> | ||
| 503 | </button> | 505 | </button> | ||
| 504 | </div> | 506 | </div> | ||
| 505 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 507 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 506 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 508 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 507 | - | <a href="/" tabindex="-1"> | 509 | + | <a role="presentation" data-href="/"> |
| 508 | <span class="lbl">home</span> | 510 | <span class="lbl">home</span> | ||
| 509 | <span class="k">go</span> | 511 | <span class="k">go</span> | ||
| 510 | </a> | 512 | </a> | ||
| 511 | </li> | 513 | </li> | ||
| 512 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 514 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 513 | - | <a href="/diffs" tabindex="-1"> | 515 | + | <a role="presentation" data-href="/diffs"> |
| 514 | <span class="lbl">summary</span> | 516 | <span class="lbl">summary</span> | ||
| 515 | <span class="k">section</span> | 517 | <span class="k">section</span> | ||
| 516 | </a> | 518 | </a> | ||
| 517 | </li> | 519 | </li> | ||
| 518 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 520 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 519 | - | <a href="/diffs/tree/main" tabindex="-1"> | 521 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 520 | <span class="lbl">files</span> | 522 | <span class="lbl">files</span> | ||
| 521 | <span class="k">section</span> | 523 | <span class="k">section</span> | ||
| 522 | </a> | 524 | </a> | ||
| 523 | </li> | 525 | </li> | ||
| 524 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 526 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 525 | - | <a href="/diffs/commits/main" tabindex="-1"> | 527 | + | <a role="presentation" data-href="/diffs/commits/main"> |
| 526 | <span class="lbl">commits</span> | 528 | <span class="lbl">commits</span> | ||
| 527 | <span class="k">section</span> | 529 | <span class="k">section</span> | ||
| 528 | </a> | 530 | </a> | ||
| 529 | </li> | 531 | </li> | ||
| 530 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 532 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 531 | - | <a href="/diffs/refs" tabindex="-1"> | 533 | + | <a role="presentation" data-href="/diffs/refs"> |
| 532 | <span class="lbl">branches & tags</span> | 534 | <span class="lbl">branches & tags</span> | ||
| 533 | <span class="k">section</span> | 535 | <span class="k">section</span> | ||
| 534 | </a> | 536 | </a> | ||
| 535 | </li> | 537 | </li> | ||
| 536 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 538 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 537 | - | <a href="/diffs/merge-requests" tabindex="-1"> | 539 | + | <a role="presentation" data-href="/diffs/merge-requests"> |
| 538 | <span class="lbl">merge requests</span> | 540 | <span class="lbl">merge requests</span> | ||
| 539 | <span class="k">section</span> | 541 | <span class="k">section</span> | ||
| 540 | </a> | 542 | </a> | ||
| 541 | </li> | 543 | </li> | ||
| 542 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 544 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 543 | - | <a href="/diffs/releases" tabindex="-1"> | 545 | + | <a role="presentation" data-href="/diffs/releases"> |
| 544 | <span class="lbl">releases</span> | 546 | <span class="lbl">releases</span> | ||
| 545 | <span class="k">section</span> | 547 | <span class="k">section</span> | ||
| 546 | </a> | 548 | </a> | ||
| 547 | </li> | 549 | </li> | ||
| 548 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 550 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 549 | - | <a href="/diffs/actions" tabindex="-1"> | 551 | + | <a role="presentation" data-href="/diffs/actions"> |
| 550 | <span class="lbl">actions</span> | 552 | <span class="lbl">actions</span> | ||
| 551 | <span class="k">section</span> | 553 | <span class="k">section</span> | ||
| 552 | </a> | 554 | </a> | ||
| 553 | </li> | 555 | </li> | ||
| 554 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | 556 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch main"> | ||
| 555 | - | <a href="/diffs/tree/main" tabindex="-1"> | 557 | + | <a role="presentation" data-href="/diffs/tree/main"> |
| 556 | <span class="lbl">main</span> | 558 | <span class="lbl">main</span> | ||
| 557 | <span class="k">branch</span> | 559 | <span class="k">branch</span> | ||
| 558 | </a> | 560 | </a> | ||
| 559 | </li> | 561 | </li> | ||
| 560 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | 562 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch side"> | ||
| 561 | - | <a href="/diffs/tree/side" tabindex="-1"> | 563 | + | <a role="presentation" data-href="/diffs/tree/side"> |
| 562 | <span class="lbl">side</span> | 564 | <span class="lbl">side</span> | ||
| 563 | <span class="k">branch</span> | 565 | <span class="k">branch</span> | ||
| 564 | </a> | 566 | </a> | ||
| 565 | </li> | 567 | </li> | ||
| 566 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | 568 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v1.0.0"> | ||
| 567 | - | <a href="/diffs/tree/v1.0.0" tabindex="-1"> | 569 | + | <a role="presentation" data-href="/diffs/tree/v1.0.0"> |
| 568 | <span class="lbl">v1.0.0</span> | 570 | <span class="lbl">v1.0.0</span> | ||
| 569 | <span class="k">tag</span> | 571 | <span class="k">tag</span> | ||
| 570 | </a> | 572 | </a> | ||
| 571 | </li> | 573 | </li> | ||
| 572 | <li id="cmd-o11" role="option" aria-selected="false" data-k="repo long"> | 574 | <li id="cmd-o11" role="option" aria-selected="false" data-k="repo long"> | ||
| 573 | - | <a href="/long" tabindex="-1"> | 575 | + | <a role="presentation" data-href="/long"> |
| 574 | <span class="lbl">long</span> | 576 | <span class="lbl">long</span> | ||
| 575 | <span class="k">repo</span> | 577 | <span class="k">repo</span> | ||
| 576 | </a> | 578 | </a> | ||
| 577 | </li> | 579 | </li> | ||
| 578 | <li id="cmd-o12" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 580 | <li id="cmd-o12" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 579 | - | <a href="#" data-fire="keys" tabindex="-1"> | 581 | + | <a role="presentation" data-fire="keys"> |
| 580 | <span class="lbl">turn single-key shortcuts off</span> | 582 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 581 | <span class="k">action</span> | 583 | <span class="k">action</span> | ||
| 582 | </a> | 584 | </a> | ||
M internal/app/testdata/web/empty.html +9 -7
| @@ -86,18 +86,20 @@ | |||
| 86 | 86 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 87 | 87 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 88 | 88 | </footer> | |
| 89 | - | <div class="hint" role="status" aria-live="polite"> | |
| 90 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 89 | + | <div class="hint"> | |
| 90 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 91 | 91 | </span> | |
| 92 | + | <span role="status" aria-live="polite"> | |
| 92 | 93 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 93 | 94 | </span> | |
| 94 | 95 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 95 | 96 | </span> | |
| 97 | + | </span> | |
| 96 | 98 | </div> | |
| 97 | 99 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 98 | 100 | <div class="panel-head"> | |
| 99 | 101 | <h2>Keyboard shortcuts</h2> | |
| 100 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 102 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 101 | 103 | <kbd>esc</kbd> close</button> | |
| 102 | 104 | </div> | |
| 103 | 105 | <div class="keys-pref"> | |
| @@ -231,25 +233,25 @@ | |||
| 231 | 233 | <div class="panel-head"> | |
| 232 | 234 | <label for="cmd-q" class="sr">go to</label> | |
| 233 | 235 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 234 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 236 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 235 | 237 | <kbd>esc</kbd> | |
| 236 | 238 | </button> | |
| 237 | 239 | </div> | |
| 238 | 240 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 239 | 241 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 240 | - | <a href="/" tabindex="-1"> | |
| 242 | + | <a role="presentation" data-href="/"> | |
| 241 | 243 | <span class="lbl">home</span> | |
| 242 | 244 | <span class="k">go</span> | |
| 243 | 245 | </a> | |
| 244 | 246 | </li> | |
| 245 | 247 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo demo"> | |
| 246 | - | <a href="/demo" tabindex="-1"> | |
| 248 | + | <a role="presentation" data-href="/demo"> | |
| 247 | 249 | <span class="lbl">demo</span> | |
| 248 | 250 | <span class="k">repo</span> | |
| 249 | 251 | </a> | |
| 250 | 252 | </li> | |
| 251 | 253 | <li id="cmd-o2" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 252 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 254 | + | <a role="presentation" data-fire="keys"> | |
| 253 | 255 | <span class="lbl">turn single-key shortcuts off</span> | |
| 254 | 256 | <span class="k">action</span> | |
| 255 | 257 | </a> | |
| @@ -86,18 +86,20 @@ | |||||
| 86 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 86 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 87 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 87 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 88 | </footer> | 88 | </footer> | ||
| 89 | - | <div class="hint" role="status" aria-live="polite"> | 89 | + | <div class="hint"> |
| 90 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 90 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 91 | </span> | 91 | </span> | ||
| 92 | + | <span role="status" aria-live="polite"> | |||
| 92 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 93 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 93 | </span> | 94 | </span> | ||
| 94 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 95 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 95 | </span> | 96 | </span> | ||
| 97 | + | </span> | |||
| 96 | </div> | 98 | </div> | ||
| 97 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 99 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 98 | <div class="panel-head"> | 100 | <div class="panel-head"> | ||
| 99 | <h2>Keyboard shortcuts</h2> | 101 | <h2>Keyboard shortcuts</h2> | ||
| 100 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 102 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 101 | <kbd>esc</kbd> close</button> | 103 | <kbd>esc</kbd> close</button> | ||
| 102 | </div> | 104 | </div> | ||
| 103 | <div class="keys-pref"> | 105 | <div class="keys-pref"> | ||
| @@ -231,25 +233,25 @@ | |||||
| 231 | <div class="panel-head"> | 233 | <div class="panel-head"> | ||
| 232 | <label for="cmd-q" class="sr">go to</label> | 234 | <label for="cmd-q" class="sr">go to</label> | ||
| 233 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 235 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 234 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 236 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 235 | <kbd>esc</kbd> | 237 | <kbd>esc</kbd> | ||
| 236 | </button> | 238 | </button> | ||
| 237 | </div> | 239 | </div> | ||
| 238 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 240 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 239 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 241 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 240 | - | <a href="/" tabindex="-1"> | 242 | + | <a role="presentation" data-href="/"> |
| 241 | <span class="lbl">home</span> | 243 | <span class="lbl">home</span> | ||
| 242 | <span class="k">go</span> | 244 | <span class="k">go</span> | ||
| 243 | </a> | 245 | </a> | ||
| 244 | </li> | 246 | </li> | ||
| 245 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo demo"> | 247 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo demo"> | ||
| 246 | - | <a href="/demo" tabindex="-1"> | 248 | + | <a role="presentation" data-href="/demo"> |
| 247 | <span class="lbl">demo</span> | 249 | <span class="lbl">demo</span> | ||
| 248 | <span class="k">repo</span> | 250 | <span class="k">repo</span> | ||
| 249 | </a> | 251 | </a> | ||
| 250 | </li> | 252 | </li> | ||
| 251 | <li id="cmd-o2" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 253 | <li id="cmd-o2" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 252 | - | <a href="#" data-fire="keys" tabindex="-1"> | 254 | + | <a role="presentation" data-fire="keys"> |
| 253 | <span class="lbl">turn single-key shortcuts off</span> | 255 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 254 | <span class="k">action</span> | 256 | <span class="k">action</span> | ||
| 255 | </a> | 257 | </a> | ||
M internal/app/testdata/web/home.html +11 -9
| @@ -182,14 +182,16 @@ | |||
| 182 | 182 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 183 | 183 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 184 | 184 | </footer> | |
| 185 | - | <div class="hint" role="status" aria-live="polite"> | |
| 186 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 185 | + | <div class="hint"> | |
| 186 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 187 | 187 | </span> | |
| 188 | + | <span role="status" aria-live="polite"> | |
| 188 | 189 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 189 | 190 | </span> | |
| 190 | 191 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 191 | 192 | </span> | |
| 192 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=home" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 193 | + | </span> | |
| 194 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=home" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 193 | 195 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | |
| 194 | 196 | htmx:sse:error -> ermiteLive.error(event.detail.status); | |
| 195 | 197 | htmx:sse:before:connection -> ermiteLive.gate(event); | |
| @@ -201,7 +203,7 @@ | |||
| 201 | 203 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 202 | 204 | <div class="panel-head"> | |
| 203 | 205 | <h2>Keyboard shortcuts</h2> | |
| 204 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 206 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 205 | 207 | <kbd>esc</kbd> close</button> | |
| 206 | 208 | </div> | |
| 207 | 209 | <div class="keys-pref"> | |
| @@ -335,31 +337,31 @@ | |||
| 335 | 337 | <div class="panel-head"> | |
| 336 | 338 | <label for="cmd-q" class="sr">go to</label> | |
| 337 | 339 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 338 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 340 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 339 | 341 | <kbd>esc</kbd> | |
| 340 | 342 | </button> | |
| 341 | 343 | </div> | |
| 342 | 344 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 343 | 345 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 344 | - | <a href="/" tabindex="-1"> | |
| 346 | + | <a role="presentation" data-href="/"> | |
| 345 | 347 | <span class="lbl">home</span> | |
| 346 | 348 | <span class="k">go</span> | |
| 347 | 349 | </a> | |
| 348 | 350 | </li> | |
| 349 | 351 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo quiet"> | |
| 350 | - | <a href="/quiet" tabindex="-1"> | |
| 352 | + | <a role="presentation" data-href="/quiet"> | |
| 351 | 353 | <span class="lbl">quiet</span> | |
| 352 | 354 | <span class="k">repo</span> | |
| 353 | 355 | </a> | |
| 354 | 356 | </li> | |
| 355 | 357 | <li id="cmd-o2" role="option" aria-selected="false" data-k="repo demo"> | |
| 356 | - | <a href="/demo" tabindex="-1"> | |
| 358 | + | <a role="presentation" data-href="/demo"> | |
| 357 | 359 | <span class="lbl">demo</span> | |
| 358 | 360 | <span class="k">repo</span> | |
| 359 | 361 | </a> | |
| 360 | 362 | </li> | |
| 361 | 363 | <li id="cmd-o3" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 362 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 364 | + | <a role="presentation" data-fire="keys"> | |
| 363 | 365 | <span class="lbl">turn single-key shortcuts off</span> | |
| 364 | 366 | <span class="k">action</span> | |
| 365 | 367 | </a> | |
| @@ -182,14 +182,16 @@ | |||||
| 182 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 182 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 183 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 183 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 184 | </footer> | 184 | </footer> | ||
| 185 | - | <div class="hint" role="status" aria-live="polite"> | 185 | + | <div class="hint"> |
| 186 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 186 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 187 | </span> | 187 | </span> | ||
| 188 | + | <span role="status" aria-live="polite"> | |||
| 188 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 189 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 189 | </span> | 190 | </span> | ||
| 190 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 191 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 191 | </span> | 192 | </span> | ||
| 192 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=home" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | 193 | + | </span> |
| 194 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=home" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |||
| 193 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | 195 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | ||
| 194 | htmx:sse:error -> ermiteLive.error(event.detail.status); | 196 | htmx:sse:error -> ermiteLive.error(event.detail.status); | ||
| 195 | htmx:sse:before:connection -> ermiteLive.gate(event); | 197 | htmx:sse:before:connection -> ermiteLive.gate(event); | ||
| @@ -201,7 +203,7 @@ | |||||
| 201 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 203 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 202 | <div class="panel-head"> | 204 | <div class="panel-head"> | ||
| 203 | <h2>Keyboard shortcuts</h2> | 205 | <h2>Keyboard shortcuts</h2> | ||
| 204 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 206 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 205 | <kbd>esc</kbd> close</button> | 207 | <kbd>esc</kbd> close</button> | ||
| 206 | </div> | 208 | </div> | ||
| 207 | <div class="keys-pref"> | 209 | <div class="keys-pref"> | ||
| @@ -335,31 +337,31 @@ | |||||
| 335 | <div class="panel-head"> | 337 | <div class="panel-head"> | ||
| 336 | <label for="cmd-q" class="sr">go to</label> | 338 | <label for="cmd-q" class="sr">go to</label> | ||
| 337 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 339 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 338 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 340 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 339 | <kbd>esc</kbd> | 341 | <kbd>esc</kbd> | ||
| 340 | </button> | 342 | </button> | ||
| 341 | </div> | 343 | </div> | ||
| 342 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 344 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 343 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 345 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 344 | - | <a href="/" tabindex="-1"> | 346 | + | <a role="presentation" data-href="/"> |
| 345 | <span class="lbl">home</span> | 347 | <span class="lbl">home</span> | ||
| 346 | <span class="k">go</span> | 348 | <span class="k">go</span> | ||
| 347 | </a> | 349 | </a> | ||
| 348 | </li> | 350 | </li> | ||
| 349 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo quiet"> | 351 | <li id="cmd-o1" role="option" aria-selected="false" data-k="repo quiet"> | ||
| 350 | - | <a href="/quiet" tabindex="-1"> | 352 | + | <a role="presentation" data-href="/quiet"> |
| 351 | <span class="lbl">quiet</span> | 353 | <span class="lbl">quiet</span> | ||
| 352 | <span class="k">repo</span> | 354 | <span class="k">repo</span> | ||
| 353 | </a> | 355 | </a> | ||
| 354 | </li> | 356 | </li> | ||
| 355 | <li id="cmd-o2" role="option" aria-selected="false" data-k="repo demo"> | 357 | <li id="cmd-o2" role="option" aria-selected="false" data-k="repo demo"> | ||
| 356 | - | <a href="/demo" tabindex="-1"> | 358 | + | <a role="presentation" data-href="/demo"> |
| 357 | <span class="lbl">demo</span> | 359 | <span class="lbl">demo</span> | ||
| 358 | <span class="k">repo</span> | 360 | <span class="k">repo</span> | ||
| 359 | </a> | 361 | </a> | ||
| 360 | </li> | 362 | </li> | ||
| 361 | <li id="cmd-o3" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 363 | <li id="cmd-o3" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 362 | - | <a href="#" data-fire="keys" tabindex="-1"> | 364 | + | <a role="presentation" data-fire="keys"> |
| 363 | <span class="lbl">turn single-key shortcuts off</span> | 365 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 364 | <span class="k">action</span> | 366 | <span class="k">action</span> | ||
| 365 | </a> | 367 | </a> | ||
M internal/app/testdata/web/not-found-page.html +8 -6
| @@ -75,18 +75,20 @@ | |||
| 75 | 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 76 | 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 77 | 77 | </footer> | |
| 78 | - | <div class="hint" role="status" aria-live="polite"> | |
| 79 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 78 | + | <div class="hint"> | |
| 79 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 80 | 80 | </span> | |
| 81 | + | <span role="status" aria-live="polite"> | |
| 81 | 82 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 82 | 83 | </span> | |
| 83 | 84 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 84 | 85 | </span> | |
| 86 | + | </span> | |
| 85 | 87 | </div> | |
| 86 | 88 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 87 | 89 | <div class="panel-head"> | |
| 88 | 90 | <h2>Keyboard shortcuts</h2> | |
| 89 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 91 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 90 | 92 | <kbd>esc</kbd> close</button> | |
| 91 | 93 | </div> | |
| 92 | 94 | <div class="keys-pref"> | |
| @@ -220,19 +222,19 @@ | |||
| 220 | 222 | <div class="panel-head"> | |
| 221 | 223 | <label for="cmd-q" class="sr">go to</label> | |
| 222 | 224 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 223 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 225 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 224 | 226 | <kbd>esc</kbd> | |
| 225 | 227 | </button> | |
| 226 | 228 | </div> | |
| 227 | 229 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 228 | 230 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 229 | - | <a href="/" tabindex="-1"> | |
| 231 | + | <a role="presentation" data-href="/"> | |
| 230 | 232 | <span class="lbl">home</span> | |
| 231 | 233 | <span class="k">go</span> | |
| 232 | 234 | </a> | |
| 233 | 235 | </li> | |
| 234 | 236 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 235 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 237 | + | <a role="presentation" data-fire="keys"> | |
| 236 | 238 | <span class="lbl">turn single-key shortcuts off</span> | |
| 237 | 239 | <span class="k">action</span> | |
| 238 | 240 | </a> | |
| @@ -75,18 +75,20 @@ | |||||
| 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 77 | </footer> | 77 | </footer> | ||
| 78 | - | <div class="hint" role="status" aria-live="polite"> | 78 | + | <div class="hint"> |
| 79 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 79 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 80 | </span> | 80 | </span> | ||
| 81 | + | <span role="status" aria-live="polite"> | |||
| 81 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 82 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 82 | </span> | 83 | </span> | ||
| 83 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 84 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 84 | </span> | 85 | </span> | ||
| 86 | + | </span> | |||
| 85 | </div> | 87 | </div> | ||
| 86 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 88 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 87 | <div class="panel-head"> | 89 | <div class="panel-head"> | ||
| 88 | <h2>Keyboard shortcuts</h2> | 90 | <h2>Keyboard shortcuts</h2> | ||
| 89 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 91 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 90 | <kbd>esc</kbd> close</button> | 92 | <kbd>esc</kbd> close</button> | ||
| 91 | </div> | 93 | </div> | ||
| 92 | <div class="keys-pref"> | 94 | <div class="keys-pref"> | ||
| @@ -220,19 +222,19 @@ | |||||
| 220 | <div class="panel-head"> | 222 | <div class="panel-head"> | ||
| 221 | <label for="cmd-q" class="sr">go to</label> | 223 | <label for="cmd-q" class="sr">go to</label> | ||
| 222 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 224 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 223 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 225 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 224 | <kbd>esc</kbd> | 226 | <kbd>esc</kbd> | ||
| 225 | </button> | 227 | </button> | ||
| 226 | </div> | 228 | </div> | ||
| 227 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 229 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 228 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 230 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 229 | - | <a href="/" tabindex="-1"> | 231 | + | <a role="presentation" data-href="/"> |
| 230 | <span class="lbl">home</span> | 232 | <span class="lbl">home</span> | ||
| 231 | <span class="k">go</span> | 233 | <span class="k">go</span> | ||
| 232 | </a> | 234 | </a> | ||
| 233 | </li> | 235 | </li> | ||
| 234 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 236 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 235 | - | <a href="#" data-fire="keys" tabindex="-1"> | 237 | + | <a role="presentation" data-fire="keys"> |
| 236 | <span class="lbl">turn single-key shortcuts off</span> | 238 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 237 | <span class="k">action</span> | 239 | <span class="k">action</span> | ||
| 238 | </a> | 240 | </a> | ||
M internal/app/testdata/web/not-found.html +8 -6
| @@ -75,18 +75,20 @@ | |||
| 75 | 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 76 | 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 77 | 77 | </footer> | |
| 78 | - | <div class="hint" role="status" aria-live="polite"> | |
| 79 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 78 | + | <div class="hint"> | |
| 79 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 80 | 80 | </span> | |
| 81 | + | <span role="status" aria-live="polite"> | |
| 81 | 82 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 82 | 83 | </span> | |
| 83 | 84 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 84 | 85 | </span> | |
| 86 | + | </span> | |
| 85 | 87 | </div> | |
| 86 | 88 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 87 | 89 | <div class="panel-head"> | |
| 88 | 90 | <h2>Keyboard shortcuts</h2> | |
| 89 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 91 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 90 | 92 | <kbd>esc</kbd> close</button> | |
| 91 | 93 | </div> | |
| 92 | 94 | <div class="keys-pref"> | |
| @@ -220,19 +222,19 @@ | |||
| 220 | 222 | <div class="panel-head"> | |
| 221 | 223 | <label for="cmd-q" class="sr">go to</label> | |
| 222 | 224 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 223 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 225 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 224 | 226 | <kbd>esc</kbd> | |
| 225 | 227 | </button> | |
| 226 | 228 | </div> | |
| 227 | 229 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 228 | 230 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 229 | - | <a href="/" tabindex="-1"> | |
| 231 | + | <a role="presentation" data-href="/"> | |
| 230 | 232 | <span class="lbl">home</span> | |
| 231 | 233 | <span class="k">go</span> | |
| 232 | 234 | </a> | |
| 233 | 235 | </li> | |
| 234 | 236 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 235 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 237 | + | <a role="presentation" data-fire="keys"> | |
| 236 | 238 | <span class="lbl">turn single-key shortcuts off</span> | |
| 237 | 239 | <span class="k">action</span> | |
| 238 | 240 | </a> | |
| @@ -75,18 +75,20 @@ | |||||
| 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 75 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 76 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 77 | </footer> | 77 | </footer> | ||
| 78 | - | <div class="hint" role="status" aria-live="polite"> | 78 | + | <div class="hint"> |
| 79 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 79 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 80 | </span> | 80 | </span> | ||
| 81 | + | <span role="status" aria-live="polite"> | |||
| 81 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 82 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 82 | </span> | 83 | </span> | ||
| 83 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 84 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 84 | </span> | 85 | </span> | ||
| 86 | + | </span> | |||
| 85 | </div> | 87 | </div> | ||
| 86 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 88 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 87 | <div class="panel-head"> | 89 | <div class="panel-head"> | ||
| 88 | <h2>Keyboard shortcuts</h2> | 90 | <h2>Keyboard shortcuts</h2> | ||
| 89 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 91 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 90 | <kbd>esc</kbd> close</button> | 92 | <kbd>esc</kbd> close</button> | ||
| 91 | </div> | 93 | </div> | ||
| 92 | <div class="keys-pref"> | 94 | <div class="keys-pref"> | ||
| @@ -220,19 +222,19 @@ | |||||
| 220 | <div class="panel-head"> | 222 | <div class="panel-head"> | ||
| 221 | <label for="cmd-q" class="sr">go to</label> | 223 | <label for="cmd-q" class="sr">go to</label> | ||
| 222 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 224 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 223 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 225 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 224 | <kbd>esc</kbd> | 226 | <kbd>esc</kbd> | ||
| 225 | </button> | 227 | </button> | ||
| 226 | </div> | 228 | </div> | ||
| 227 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 229 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 228 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 230 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 229 | - | <a href="/" tabindex="-1"> | 231 | + | <a role="presentation" data-href="/"> |
| 230 | <span class="lbl">home</span> | 232 | <span class="lbl">home</span> | ||
| 231 | <span class="k">go</span> | 233 | <span class="k">go</span> | ||
| 232 | </a> | 234 | </a> | ||
| 233 | </li> | 235 | </li> | ||
| 234 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 236 | <li id="cmd-o1" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 235 | - | <a href="#" data-fire="keys" tabindex="-1"> | 237 | + | <a role="presentation" data-fire="keys"> |
| 236 | <span class="lbl">turn single-key shortcuts off</span> | 238 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 237 | <span class="k">action</span> | 239 | <span class="k">action</span> | ||
| 238 | </a> | 240 | </a> | ||
M internal/app/testdata/web/refs.html +22 -20
| @@ -192,14 +192,16 @@ | |||
| 192 | 192 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | |
| 193 | 193 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | |
| 194 | 194 | </footer> | |
| 195 | - | <div class="hint" role="status" aria-live="polite"> | |
| 196 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 195 | + | <div class="hint"> | |
| 196 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> | |
| 197 | 197 | </span> | |
| 198 | + | <span role="status" aria-live="polite"> | |
| 198 | 199 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | |
| 199 | 200 | </span> | |
| 200 | 201 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | |
| 201 | 202 | </span> | |
| 202 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Ademo&view=refs" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 203 | + | </span> | |
| 204 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Ademo&view=refs" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |
| 203 | 205 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | |
| 204 | 206 | htmx:sse:error -> ermiteLive.error(event.detail.status); | |
| 205 | 207 | htmx:sse:before:connection -> ermiteLive.gate(event); | |
| @@ -211,7 +213,7 @@ | |||
| 211 | 213 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | |
| 212 | 214 | <div class="panel-head"> | |
| 213 | 215 | <h2>Keyboard shortcuts</h2> | |
| 214 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 216 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 215 | 217 | <kbd>esc</kbd> close</button> | |
| 216 | 218 | </div> | |
| 217 | 219 | <div class="keys-pref"> | |
| @@ -345,7 +347,7 @@ | |||
| 345 | 347 | <div class="panel-head"> | |
| 346 | 348 | <label for="refs-filter" class="sr">filter branches and tags</label> | |
| 347 | 349 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | |
| 348 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 350 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 349 | 351 | <kbd>esc</kbd> | |
| 350 | 352 | </button> | |
| 351 | 353 | </div> | |
| @@ -384,91 +386,91 @@ | |||
| 384 | 386 | <div class="panel-head"> | |
| 385 | 387 | <label for="cmd-q" class="sr">go to</label> | |
| 386 | 388 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | |
| 387 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | |
| 389 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> | |
| 388 | 390 | <kbd>esc</kbd> | |
| 389 | 391 | </button> | |
| 390 | 392 | </div> | |
| 391 | 393 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | |
| 392 | 394 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | |
| 393 | - | <a href="/" tabindex="-1"> | |
| 395 | + | <a role="presentation" data-href="/"> | |
| 394 | 396 | <span class="lbl">home</span> | |
| 395 | 397 | <span class="k">go</span> | |
| 396 | 398 | </a> | |
| 397 | 399 | </li> | |
| 398 | 400 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | |
| 399 | - | <a href="/demo" tabindex="-1"> | |
| 401 | + | <a role="presentation" data-href="/demo"> | |
| 400 | 402 | <span class="lbl">summary</span> | |
| 401 | 403 | <span class="k">section</span> | |
| 402 | 404 | </a> | |
| 403 | 405 | </li> | |
| 404 | 406 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | |
| 405 | - | <a href="/demo/tree/main" tabindex="-1"> | |
| 407 | + | <a role="presentation" data-href="/demo/tree/main"> | |
| 406 | 408 | <span class="lbl">files</span> | |
| 407 | 409 | <span class="k">section</span> | |
| 408 | 410 | </a> | |
| 409 | 411 | </li> | |
| 410 | 412 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | |
| 411 | - | <a href="/demo/commits/main" tabindex="-1"> | |
| 413 | + | <a role="presentation" data-href="/demo/commits/main"> | |
| 412 | 414 | <span class="lbl">commits</span> | |
| 413 | 415 | <span class="k">section</span> | |
| 414 | 416 | </a> | |
| 415 | 417 | </li> | |
| 416 | 418 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | |
| 417 | - | <a href="/demo/refs" tabindex="-1"> | |
| 419 | + | <a role="presentation" data-href="/demo/refs"> | |
| 418 | 420 | <span class="lbl">branches & tags</span> | |
| 419 | 421 | <span class="k">section</span> | |
| 420 | 422 | </a> | |
| 421 | 423 | </li> | |
| 422 | 424 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | |
| 423 | - | <a href="/demo/merge-requests" tabindex="-1"> | |
| 425 | + | <a role="presentation" data-href="/demo/merge-requests"> | |
| 424 | 426 | <span class="lbl">merge requests</span> | |
| 425 | 427 | <span class="k">section</span> | |
| 426 | 428 | </a> | |
| 427 | 429 | </li> | |
| 428 | 430 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | |
| 429 | - | <a href="/demo/releases" tabindex="-1"> | |
| 431 | + | <a role="presentation" data-href="/demo/releases"> | |
| 430 | 432 | <span class="lbl">releases</span> | |
| 431 | 433 | <span class="k">section</span> | |
| 432 | 434 | </a> | |
| 433 | 435 | </li> | |
| 434 | 436 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | |
| 435 | - | <a href="/demo/actions" tabindex="-1"> | |
| 437 | + | <a role="presentation" data-href="/demo/actions"> | |
| 436 | 438 | <span class="lbl">actions</span> | |
| 437 | 439 | <span class="k">section</span> | |
| 438 | 440 | </a> | |
| 439 | 441 | </li> | |
| 440 | 442 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | |
| 441 | - | <a href="/demo/tree/feature/x" tabindex="-1"> | |
| 443 | + | <a role="presentation" data-href="/demo/tree/feature/x"> | |
| 442 | 444 | <span class="lbl">feature/x</span> | |
| 443 | 445 | <span class="k">branch</span> | |
| 444 | 446 | </a> | |
| 445 | 447 | </li> | |
| 446 | 448 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | |
| 447 | - | <a href="/demo/tree/main" tabindex="-1"> | |
| 449 | + | <a role="presentation" data-href="/demo/tree/main"> | |
| 448 | 450 | <span class="lbl">main</span> | |
| 449 | 451 | <span class="k">branch</span> | |
| 450 | 452 | </a> | |
| 451 | 453 | </li> | |
| 452 | 454 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v0.1.0"> | |
| 453 | - | <a href="/demo/tree/v0.1.0" tabindex="-1"> | |
| 455 | + | <a role="presentation" data-href="/demo/tree/v0.1.0"> | |
| 454 | 456 | <span class="lbl">v0.1.0</span> | |
| 455 | 457 | <span class="k">tag</span> | |
| 456 | 458 | </a> | |
| 457 | 459 | </li> | |
| 458 | 460 | <li id="cmd-o11" role="option" aria-selected="false" data-k="tag v0.2.0"> | |
| 459 | - | <a href="/demo/tree/v0.2.0" tabindex="-1"> | |
| 461 | + | <a role="presentation" data-href="/demo/tree/v0.2.0"> | |
| 460 | 462 | <span class="lbl">v0.2.0</span> | |
| 461 | 463 | <span class="k">tag</span> | |
| 462 | 464 | </a> | |
| 463 | 465 | </li> | |
| 464 | 466 | <li id="cmd-o12" role="option" aria-selected="false" data-k="repo quiet"> | |
| 465 | - | <a href="/quiet" tabindex="-1"> | |
| 467 | + | <a role="presentation" data-href="/quiet"> | |
| 466 | 468 | <span class="lbl">quiet</span> | |
| 467 | 469 | <span class="k">repo</span> | |
| 468 | 470 | </a> | |
| 469 | 471 | </li> | |
| 470 | 472 | <li id="cmd-o13" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | |
| 471 | - | <a href="#" data-fire="keys" tabindex="-1"> | |
| 473 | + | <a role="presentation" data-fire="keys"> | |
| 472 | 474 | <span class="lbl">turn single-key shortcuts off</span> | |
| 473 | 475 | <span class="k">action</span> | |
| 474 | 476 | </a> | |
| @@ -192,14 +192,16 @@ | |||||
| 192 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | 192 | <button type="button" class="foot-keys" data-js data-fire="help" aria-haspopup="dialog" aria-controls="panel-help" aria-keyshortcuts="?"> | ||
| 193 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | 193 | <kbd aria-hidden="true">?</kbd> keyboard shortcuts</button> | ||
| 194 | </footer> | 194 | </footer> | ||
| 195 | - | <div class="hint" role="status" aria-live="polite"> | 195 | + | <div class="hint"> |
| 196 | - | <span class="hint-nav" :text="document.body.dataset.nav || ''"> | 196 | + | <span aria-hidden="true" class="hint-nav" :text="document.body.dataset.nav || ''"> |
| 197 | </span> | 197 | </span> | ||
| 198 | + | <span role="status" aria-live="polite"> | |||
| 198 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | 199 | <span class="hint-sel" :text="document.body.dataset.sel ? document.body.dataset.sel + ' · y permalink' : ''"> | ||
| 199 | </span> | 200 | </span> | ||
| 200 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | 201 | <span class="hint-flash" :text="document.body.dataset.flash || ''"> | ||
| 201 | </span> | 202 | </span> | ||
| 202 | - | <span class="hint-live" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Ademo&view=refs" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | 203 | + | </span> |
| 204 | + | <span class="hint-live" role="status" data-state="connecting" hx-sse:connect="/-/events?topic=repo%3Ademo&view=refs" hx-swap="none" :text="data.state === 'offline' ? 'live updates paused' : ''" hx-on="htmx:sse:after:connection -> ermiteLive.back(); | |||
| 203 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | 205 | htmx:sse:close, htmx:sse:error -> ermiteLive.lost(); | ||
| 204 | htmx:sse:error -> ermiteLive.error(event.detail.status); | 206 | htmx:sse:error -> ermiteLive.error(event.detail.status); | ||
| 205 | htmx:sse:before:connection -> ermiteLive.gate(event); | 207 | htmx:sse:before:connection -> ermiteLive.gate(event); | ||
| @@ -211,7 +213,7 @@ | |||||
| 211 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | 213 | <dialog id="panel-help" class="panel modal" aria-label="Keyboard shortcuts" hx-on:keydown="event.key === 'Escape' && (event.preventDefault(), this.close())" hx-on:click="event.target === this && this.close()"> | ||
| 212 | <div class="panel-head"> | 214 | <div class="panel-head"> | ||
| 213 | <h2>Keyboard shortcuts</h2> | 215 | <h2>Keyboard shortcuts</h2> | ||
| 214 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 216 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 215 | <kbd>esc</kbd> close</button> | 217 | <kbd>esc</kbd> close</button> | ||
| 216 | </div> | 218 | </div> | ||
| 217 | <div class="keys-pref"> | 219 | <div class="keys-pref"> | ||
| @@ -345,7 +347,7 @@ | |||||
| 345 | <div class="panel-head"> | 347 | <div class="panel-head"> | ||
| 346 | <label for="refs-filter" class="sr">filter branches and tags</label> | 348 | <label for="refs-filter" class="sr">filter branches and tags</label> | ||
| 347 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | 349 | <input id="refs-filter" type="search" placeholder="Switch branch or tag…" autocomplete="off" data-pick="#panel-refs li" hx-on:input="ermite.filter(this)"> | ||
| 348 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 350 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 349 | <kbd>esc</kbd> | 351 | <kbd>esc</kbd> | ||
| 350 | </button> | 352 | </button> | ||
| 351 | </div> | 353 | </div> | ||
| @@ -384,91 +386,91 @@ | |||||
| 384 | <div class="panel-head"> | 386 | <div class="panel-head"> | ||
| 385 | <label for="cmd-q" class="sr">go to</label> | 387 | <label for="cmd-q" class="sr">go to</label> | ||
| 386 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | 388 | <input id="cmd-q" type="search" placeholder="Go to a section, branch, tag, file or repository…" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="cmd-list" aria-activedescendant="cmd-o0" hx-on:input="ermite.cmdFilter(this); ermiteFinder.palette(this)" hx-on:keydown="ermite.cmdKey(event)"> | ||
| 387 | - | <button type="button" class="panel-x" aria-label="Close" hx-on:click="closest('dialog').close()"> | 389 | + | <button type="button" class="panel-x" aria-label="Close (esc)" hx-on:click="closest('dialog').close()"> |
| 388 | <kbd>esc</kbd> | 390 | <kbd>esc</kbd> | ||
| 389 | </button> | 391 | </button> | ||
| 390 | </div> | 392 | </div> | ||
| 391 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | 393 | <ul id="cmd-list" class="cmd-list" role="listbox" aria-label="Targets"> | ||
| 392 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | 394 | <li id="cmd-o0" role="option" aria-selected="true" data-k="go home" data-cursor> | ||
| 393 | - | <a href="/" tabindex="-1"> | 395 | + | <a role="presentation" data-href="/"> |
| 394 | <span class="lbl">home</span> | 396 | <span class="lbl">home</span> | ||
| 395 | <span class="k">go</span> | 397 | <span class="k">go</span> | ||
| 396 | </a> | 398 | </a> | ||
| 397 | </li> | 399 | </li> | ||
| 398 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | 400 | <li id="cmd-o1" role="option" aria-selected="false" data-k="section summary"> | ||
| 399 | - | <a href="/demo" tabindex="-1"> | 401 | + | <a role="presentation" data-href="/demo"> |
| 400 | <span class="lbl">summary</span> | 402 | <span class="lbl">summary</span> | ||
| 401 | <span class="k">section</span> | 403 | <span class="k">section</span> | ||
| 402 | </a> | 404 | </a> | ||
| 403 | </li> | 405 | </li> | ||
| 404 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | 406 | <li id="cmd-o2" role="option" aria-selected="false" data-k="section files"> | ||
| 405 | - | <a href="/demo/tree/main" tabindex="-1"> | 407 | + | <a role="presentation" data-href="/demo/tree/main"> |
| 406 | <span class="lbl">files</span> | 408 | <span class="lbl">files</span> | ||
| 407 | <span class="k">section</span> | 409 | <span class="k">section</span> | ||
| 408 | </a> | 410 | </a> | ||
| 409 | </li> | 411 | </li> | ||
| 410 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | 412 | <li id="cmd-o3" role="option" aria-selected="false" data-k="section commits"> | ||
| 411 | - | <a href="/demo/commits/main" tabindex="-1"> | 413 | + | <a role="presentation" data-href="/demo/commits/main"> |
| 412 | <span class="lbl">commits</span> | 414 | <span class="lbl">commits</span> | ||
| 413 | <span class="k">section</span> | 415 | <span class="k">section</span> | ||
| 414 | </a> | 416 | </a> | ||
| 415 | </li> | 417 | </li> | ||
| 416 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | 418 | <li id="cmd-o4" role="option" aria-selected="false" data-k="section branches & tags"> | ||
| 417 | - | <a href="/demo/refs" tabindex="-1"> | 419 | + | <a role="presentation" data-href="/demo/refs"> |
| 418 | <span class="lbl">branches & tags</span> | 420 | <span class="lbl">branches & tags</span> | ||
| 419 | <span class="k">section</span> | 421 | <span class="k">section</span> | ||
| 420 | </a> | 422 | </a> | ||
| 421 | </li> | 423 | </li> | ||
| 422 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | 424 | <li id="cmd-o5" role="option" aria-selected="false" data-k="section merge requests"> | ||
| 423 | - | <a href="/demo/merge-requests" tabindex="-1"> | 425 | + | <a role="presentation" data-href="/demo/merge-requests"> |
| 424 | <span class="lbl">merge requests</span> | 426 | <span class="lbl">merge requests</span> | ||
| 425 | <span class="k">section</span> | 427 | <span class="k">section</span> | ||
| 426 | </a> | 428 | </a> | ||
| 427 | </li> | 429 | </li> | ||
| 428 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | 430 | <li id="cmd-o6" role="option" aria-selected="false" data-k="section releases"> | ||
| 429 | - | <a href="/demo/releases" tabindex="-1"> | 431 | + | <a role="presentation" data-href="/demo/releases"> |
| 430 | <span class="lbl">releases</span> | 432 | <span class="lbl">releases</span> | ||
| 431 | <span class="k">section</span> | 433 | <span class="k">section</span> | ||
| 432 | </a> | 434 | </a> | ||
| 433 | </li> | 435 | </li> | ||
| 434 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | 436 | <li id="cmd-o7" role="option" aria-selected="false" data-k="section actions"> | ||
| 435 | - | <a href="/demo/actions" tabindex="-1"> | 437 | + | <a role="presentation" data-href="/demo/actions"> |
| 436 | <span class="lbl">actions</span> | 438 | <span class="lbl">actions</span> | ||
| 437 | <span class="k">section</span> | 439 | <span class="k">section</span> | ||
| 438 | </a> | 440 | </a> | ||
| 439 | </li> | 441 | </li> | ||
| 440 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | 442 | <li id="cmd-o8" role="option" aria-selected="false" data-k="branch feature/x"> | ||
| 441 | - | <a href="/demo/tree/feature/x" tabindex="-1"> | 443 | + | <a role="presentation" data-href="/demo/tree/feature/x"> |
| 442 | <span class="lbl">feature/x</span> | 444 | <span class="lbl">feature/x</span> | ||
| 443 | <span class="k">branch</span> | 445 | <span class="k">branch</span> | ||
| 444 | </a> | 446 | </a> | ||
| 445 | </li> | 447 | </li> | ||
| 446 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | 448 | <li id="cmd-o9" role="option" aria-selected="false" data-k="branch main"> | ||
| 447 | - | <a href="/demo/tree/main" tabindex="-1"> | 449 | + | <a role="presentation" data-href="/demo/tree/main"> |
| 448 | <span class="lbl">main</span> | 450 | <span class="lbl">main</span> | ||
| 449 | <span class="k">branch</span> | 451 | <span class="k">branch</span> | ||
| 450 | </a> | 452 | </a> | ||
| 451 | </li> | 453 | </li> | ||
| 452 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v0.1.0"> | 454 | <li id="cmd-o10" role="option" aria-selected="false" data-k="tag v0.1.0"> | ||
| 453 | - | <a href="/demo/tree/v0.1.0" tabindex="-1"> | 455 | + | <a role="presentation" data-href="/demo/tree/v0.1.0"> |
| 454 | <span class="lbl">v0.1.0</span> | 456 | <span class="lbl">v0.1.0</span> | ||
| 455 | <span class="k">tag</span> | 457 | <span class="k">tag</span> | ||
| 456 | </a> | 458 | </a> | ||
| 457 | </li> | 459 | </li> | ||
| 458 | <li id="cmd-o11" role="option" aria-selected="false" data-k="tag v0.2.0"> | 460 | <li id="cmd-o11" role="option" aria-selected="false" data-k="tag v0.2.0"> | ||
| 459 | - | <a href="/demo/tree/v0.2.0" tabindex="-1"> | 461 | + | <a role="presentation" data-href="/demo/tree/v0.2.0"> |
| 460 | <span class="lbl">v0.2.0</span> | 462 | <span class="lbl">v0.2.0</span> | ||
| 461 | <span class="k">tag</span> | 463 | <span class="k">tag</span> | ||
| 462 | </a> | 464 | </a> | ||
| 463 | </li> | 465 | </li> | ||
| 464 | <li id="cmd-o12" role="option" aria-selected="false" data-k="repo quiet"> | 466 | <li id="cmd-o12" role="option" aria-selected="false" data-k="repo quiet"> | ||
| 465 | - | <a href="/quiet" tabindex="-1"> | 467 | + | <a role="presentation" data-href="/quiet"> |
| 466 | <span class="lbl">quiet</span> | 468 | <span class="lbl">quiet</span> | ||
| 467 | <span class="k">repo</span> | 469 | <span class="k">repo</span> | ||
| 468 | </a> | 470 | </a> | ||
| 469 | </li> | 471 | </li> | ||
| 470 | <li id="cmd-o13" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | 472 | <li id="cmd-o13" role="option" aria-selected="false" data-k="action turn single-key shortcuts on off keyboard"> | ||
| 471 | - | <a href="#" data-fire="keys" tabindex="-1"> | 473 | + | <a role="presentation" data-fire="keys"> |
| 472 | <span class="lbl">turn single-key shortcuts off</span> | 474 | <span class="lbl">turn single-key shortcuts off</span> | ||
| 473 | <span class="k">action</span> | 475 | <span class="k">action</span> | ||
| 474 | </a> | 476 | </a> | ||
M internal/app/testdata/web/summary.html +22 -20
M internal/app/testdata/web/tree-nested.html +21 -19
M internal/app/testdata/web/tree-root.html +21 -19
M internal/app/testdata/web/tree-slash-ref.html +21 -19
M internal/app/testdata/web/tree-subdir.html +21 -19
Comments0 open / 0
no comments yet.