aboutsummaryrefslogtreecommitdiffhomepage
path: root/markup
diff options
context:
space:
mode:
authorrhymes <[email protected]>2021-07-15 16:48:39 +0200
committerGitHub <[email protected]>2021-07-15 16:48:39 +0200
commitf27e542442d19436f1428cc22bb03aca398d37a7 (patch)
tree9f3b53dc99405d4bcd4957a4ada4bd0077d5818c /markup
parentae6cf93c84c3584b111f4b9fa3fb4e3f63d37915 (diff)
downloadhugo-f27e542442d19436f1428cc22bb03aca398d37a7.tar.gz
hugo-f27e542442d19436f1428cc22bb03aca398d37a7.zip
markup: Add tabindex="0" to default <pre> wrapper
Currently the generated `<pre>` element isn't fully accessible as it can't be focused by keyboard users. To make this fully accessible, the attribute `tabindex="0"` should be added to the `<pre>` tag. Closes #7194
Diffstat (limited to 'markup')
-rw-r--r--markup/goldmark/convert_test.go6
-rw-r--r--markup/highlight/highlight.go2
-rw-r--r--markup/highlight/highlight_test.go8
3 files changed, 8 insertions, 8 deletions
diff --git a/markup/goldmark/convert_test.go b/markup/goldmark/convert_test.go
index 6e6b0009f..f2c6efedd 100644
--- a/markup/goldmark/convert_test.go
+++ b/markup/goldmark/convert_test.go
@@ -154,7 +154,7 @@ description
c.Assert(got, qt.Contains, `<h2 id="神真美好-2">神真美好</h2>`, qt.Commentf(got))
// Code fences
- c.Assert(got, qt.Contains, "<div class=\"highlight\"><pre class=\"chroma\"><code class=\"language-bash\" data-lang=\"bash\">LINE1\n</code></pre></div>")
+ c.Assert(got, qt.Contains, "<div class=\"highlight\"><pre tabindex=\"0\" class=\"chroma\"><code class=\"language-bash\" data-lang=\"bash\">LINE1\n</code></pre></div>")
c.Assert(got, qt.Contains, "Code Fences No Lexer</h2>\n<pre><code class=\"language-moo\" data-lang=\"moo\">LINE1\n</code></pre>")
// Extensions
@@ -389,7 +389,7 @@ LINE5
result := convertForConfig(c, cfg, `echo "Hugo Rocks!"`, "bash")
// TODO(bep) there is a whitespace mismatch (\n) between this and the highlight template func.
- c.Assert(result, qt.Equals, `<div class="highlight"><pre class="chroma"><code class="language-bash" data-lang="bash"><span class="nb">echo</span> <span class="s2">&#34;Hugo Rocks!&#34;</span>
+ c.Assert(result, qt.Equals, `<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-bash" data-lang="bash"><span class="nb">echo</span> <span class="s2">&#34;Hugo Rocks!&#34;</span>
</code></pre></div>`)
result = convertForConfig(c, cfg, `echo "Hugo Rocks!"`, "unknown")
c.Assert(result, qt.Equals, "<pre><code class=\"language-unknown\" data-lang=\"unknown\">echo &quot;Hugo Rocks!&quot;\n</code></pre>")
@@ -400,7 +400,7 @@ LINE5
cfg.NoClasses = false
result := convertForConfig(c, cfg, lines, `bash {linenos=table,hl_lines=[2 "4-5"],linenostart=3}`)
- c.Assert(result, qt.Contains, "<div class=\"highlight\"><div class=\"chroma\">\n<table class=\"lntable\"><tr><td class=\"lntd\">\n<pre class=\"chroma\"><code><span class")
+ c.Assert(result, qt.Contains, "<div class=\"highlight\"><div class=\"chroma\">\n<table class=\"lntable\"><tr><td class=\"lntd\">\n<pre tabindex=\"0\" class=\"chroma\"><code><span class")
c.Assert(result, qt.Contains, "<span class=\"hl\"><span class=\"lnt\">4")
result = convertForConfig(c, cfg, lines, "bash {linenos=inline,hl_lines=[2]}")
diff --git a/markup/highlight/highlight.go b/markup/highlight/highlight.go
index 4727843cc..772244a91 100644
--- a/markup/highlight/highlight.go
+++ b/markup/highlight/highlight.go
@@ -123,7 +123,7 @@ type preWrapper struct {
func (p preWrapper) Start(code bool, styleAttr string) string {
w := &strings.Builder{}
- fmt.Fprintf(w, "<pre%s>", styleAttr)
+ fmt.Fprintf(w, `<pre tabindex="0"%s>`, styleAttr)
var language string
if code {
language = p.language
diff --git a/markup/highlight/highlight_test.go b/markup/highlight/highlight_test.go
index eb8ba3e96..f68df629a 100644
--- a/markup/highlight/highlight_test.go
+++ b/markup/highlight/highlight_test.go
@@ -43,9 +43,9 @@ User-Agent: foo
h := New(cfg)
result, _ := h.Highlight(`echo "Hugo Rocks!"`, "bash", "")
- c.Assert(result, qt.Equals, `<div class="highlight"><pre class="chroma"><code class="language-bash" data-lang="bash"><span class="nb">echo</span> <span class="s2">&#34;Hugo Rocks!&#34;</span></code></pre></div>`)
+ c.Assert(result, qt.Equals, `<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-bash" data-lang="bash"><span class="nb">echo</span> <span class="s2">&#34;Hugo Rocks!&#34;</span></code></pre></div>`)
result, _ = h.Highlight(`echo "Hugo Rocks!"`, "unknown", "")
- c.Assert(result, qt.Equals, `<pre><code class="language-unknown" data-lang="unknown">echo &#34;Hugo Rocks!&#34;</code></pre>`)
+ c.Assert(result, qt.Equals, `<pre tabindex="0"><code class="language-unknown" data-lang="unknown">echo &#34;Hugo Rocks!&#34;</code></pre>`)
})
c.Run("Highlight lines, default config", func(c *qt.C) {
@@ -54,7 +54,7 @@ User-Agent: foo
h := New(cfg)
result, _ := h.Highlight(lines, "bash", "linenos=table,hl_lines=2 4-5,linenostart=3")
- c.Assert(result, qt.Contains, "<div class=\"highlight\"><div class=\"chroma\">\n<table class=\"lntable\"><tr><td class=\"lntd\">\n<pre class=\"chroma\"><code><span class")
+ c.Assert(result, qt.Contains, "<div class=\"highlight\"><div class=\"chroma\">\n<table class=\"lntable\"><tr><td class=\"lntd\">\n<pre tabindex=\"0\" class=\"chroma\"><code><span class")
c.Assert(result, qt.Contains, "<span class=\"hl\"><span class=\"lnt\">4")
result, _ = h.Highlight(lines, "bash", "linenos=inline,hl_lines=2")
@@ -113,7 +113,7 @@ User-Agent: foo
h := New(cfg)
result, _ := h.Highlight(lines, "", "")
- c.Assert(result, qt.Equals, "<pre><code>LINE1\nLINE2\nLINE3\nLINE4\nLINE5\n</code></pre>")
+ c.Assert(result, qt.Equals, "<pre tabindex=\"0\"><code>LINE1\nLINE2\nLINE3\nLINE4\nLINE5\n</code></pre>")
})
c.Run("No language, guess syntax", func(c *qt.C) {