From 4e9189312424abbb8133db8ca24dd06c46308e1c Mon Sep 17 00:00:00 2001
From: Jason Nakai <106776019+jasnakai@users.noreply.github.com>
Date: Wed, 3 Jan 2024 17:00:14 +0000
Subject: [PATCH 1/4] Updated the headingLink HTML for the permalinks. This
update fixes the accessibility issues.
---
config/headingLinks.js | 8 ++------
1 file changed, 2 insertions(+), 6 deletions(-)
diff --git a/config/headingLinks.js b/config/headingLinks.js
index 5e961340..af35c9c7 100644
--- a/config/headingLinks.js
+++ b/config/headingLinks.js
@@ -46,18 +46,14 @@ const headingLinks = (slug, _, state, index) => {
const headingLink = {
type: 'html_block',
content: `
-
+
+ aria-label="Permalink for this section">
-
`,
};
From fa7ea4d77e4f42ad9411dbb7caaf6400599ba21d Mon Sep 17 00:00:00 2001
From: Jason Nakai <106776019+jasnakai@users.noreply.github.com>
Date: Wed, 3 Jan 2024 15:52:23 -0700
Subject: [PATCH 2/4] Removed unused headingText.
---
config/headingLinks.js | 1 -
1 file changed, 1 deletion(-)
diff --git a/config/headingLinks.js b/config/headingLinks.js
index af35c9c7..6bff0197 100644
--- a/config/headingLinks.js
+++ b/config/headingLinks.js
@@ -32,7 +32,6 @@ const headingLinks = (slug, _, state, index) => {
// immediately after the heading element, so... we can just grab the next
// item in the list of tokens.
const headingContent = state.tokens[index + 1];
- const headingText = getText(headingContent);
// We also need to find the index of the element that closes the header. We'll
// put our link stuff right before that.
From 098f4038671b06b6c028cfa636ca61d68bdffa3a Mon Sep 17 00:00:00 2001
From: Jason Nakai <106776019+jasnakai@users.noreply.github.com>
Date: Thu, 4 Jan 2024 10:03:29 -0700
Subject: [PATCH 3/4] Removed unused code. Also updagte the heading-link
partial.
---
_includes/heading-link.html | 16 +++++++---------
config/headingLinks.js | 17 -----------------
2 files changed, 7 insertions(+), 26 deletions(-)
diff --git a/_includes/heading-link.html b/_includes/heading-link.html
index 3df621aa..839b7b5c 100644
--- a/_includes/heading-link.html
+++ b/_includes/heading-link.html
@@ -3,12 +3,10 @@
Add this partial within the heading you want to link.
Heading id must be the same as the slug passed to this partial.
{% endcomment %}
-
-
-
-
-
+
+
+
diff --git a/config/headingLinks.js b/config/headingLinks.js
index 6bff0197..7233ed7a 100644
--- a/config/headingLinks.js
+++ b/config/headingLinks.js
@@ -1,23 +1,6 @@
/* eslint no-restricted-syntax: 0 */
/** eslint doesn't like iterators/generators */
// From https://github.com/18F/handbook/blob/ddf9f29bce09d6c7ac1d0f2f33a99b75bc5c8223/config/headingLinks.js
-//
-// Given a Markdown node, recursively find all of the child text nodes and
-// append them together. This will produce a similar result to the .innerText
-// property of DOM elements.
-const getText = (node) => {
- const texts = [];
-
- for (const child of node.children ?? []) {
- if (child.type === 'text') {
- texts.push(child.content);
- } else {
- texts.push(getText(child));
- }
- }
-
- return texts.join('');
-};
// https://www.npmjs.com/package/markdown-it-anchor#custom-permalink
//
From fa2abff1033df227e823ef122a0749ea142c6461 Mon Sep 17 00:00:00 2001
From: Jason Nakai <106776019+jasnakai@users.noreply.github.com>
Date: Thu, 4 Jan 2024 10:14:07 -0700
Subject: [PATCH 4/4] Removing unused code.
---
config/headingLinks.js | 6 ------
1 file changed, 6 deletions(-)
diff --git a/config/headingLinks.js b/config/headingLinks.js
index 7233ed7a..2c2d85ce 100644
--- a/config/headingLinks.js
+++ b/config/headingLinks.js
@@ -9,12 +9,6 @@
// * state | a complete tree of the Markdown document as parsed by markdown-it
// * index | the index of the token in the state of the current heading
const headingLinks = (slug, _, state, index) => {
- // Heading elements do not have children in Markdown. Instead, they have a
- // sibling whose type is "inline." That inline element has children that
- // represent the contents of the heading. The "inline" element always comes
- // immediately after the heading element, so... we can just grab the next
- // item in the list of tokens.
- const headingContent = state.tokens[index + 1];
// We also need to find the index of the element that closes the header. We'll
// put our link stuff right before that.