Skip to content

Fix code copy and clarify javascript#1969

Merged
zachcasper merged 2 commits into
edgefrom
code-block-js
Jul 22, 2026
Merged

Fix code copy and clarify javascript#1969
zachcasper merged 2 commits into
edgefrom
code-block-js

Conversation

@zachcasper

Copy link
Copy Markdown
Collaborator

Fix code-block copy button and remove broken clarity.js reference

Fixes #1954
Fixes #1953

Summary

This PR fixes two related front-end bugs in the docs body/footer scripts:

  1. Copy-code button not working (Copy code button not working #1954)
  2. clarity.js 404 in the console (Docs body is trying to load clarity.js but it doesn't exist #1953)

#1954 – Copy code button

Problem: A legacy custom script (copy-code-button.js) injected a copy icon
into every code block. Its accompanying CSS was never actually imported, so on
hover the icon rendered inline (pushing the block down) and collided with Docsy's
built-in click-to-copy button, causing misalignment and a flashing "Copy to
clipboard" tooltip. After removing that script, a second issue surfaced: the
native Docsy button uses a dark color (--bs-tertiary-color), which is nearly
invisible against the dark Monokai code-block background until hovered.

Fix:

  • Removed the legacy copy-code-button.js and its <script> tag, relying on
    Docsy's built-in click-to-copy button.
  • Removed the orphaned, unused .copy-icon rules from _code.scss.
  • Added a small override so the copy button uses a light color, keeping it
    visible in the top-right corner of every code block at all times.

#1953 – clarity.js 404

Problem: body-end.html referenced /js/clarity.js, which does not exist in
the repo, producing a 404 in the browser console on every page.

Fix:

  • Removed the dead <script src="/js/clarity.js"> reference. Microsoft Clarity
    analytics is unaffected — it is already loaded via the official Clarity snippet
    in head-end.html.
  • Added a comment documenting that body-end.html is intentionally empty.

Changes

  • docs/layouts/partials/hooks/body-end.html – removed both stale scripts; added explanatory comment
  • docs/static/js/copy-code-button.js – deleted
  • docs/assets/scss/_code.scss – removed unused .copy-icon rules
  • docs/assets/scss/_styles_project.scss – light-color override for the native copy button

Testing

  • Ran a clean production build (hugo --gc --minify) — succeeds with no errors.
  • Verified in a local hugo server on /quick-start/:
    • Copy button is visible (white, top-right) on all code blocks without hovering.
    • Clicking copies the code and shows the "Copied!" tooltip.
    • No clarity.js 404 in the browser console; Clarity still loads from head-end.html.

Signed-off-by: Zach Casper <zachcasper@microsoft.com>
@github-actions

Copy link
Copy Markdown

Dependency Review

✅ No vulnerabilities or license issues or OpenSSF Scorecard issues found.

Scanned Files

None

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR removes legacy/inoperative front-end assets from the docs site and adjusts styling so Docsy’s built-in code-block copy button remains visible on dark-highlighted code blocks, while also eliminating a broken clarity.js reference.

Changes:

  • Removed the legacy custom copy-code script and its associated (now-unused) CSS.
  • Removed the stale /js/clarity.js reference and documented that body-end.html is intentionally empty.
  • Added an SCSS override to make Docsy’s built-in click-to-copy button visible on dark code blocks.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File Description
docs/static/js/copy-code-button.js Deleted legacy copy-button injection script that conflicted with Docsy’s built-in behavior.
docs/layouts/partials/hooks/body-end.html Removed stale script includes and replaced with an explanatory Hugo comment.
docs/assets/scss/_code.scss Removed unused .copy-icon styling tied to the deleted legacy script.
docs/assets/scss/_styles_project.scss Added styling override to keep the built-in copy button visible on dark code blocks.
Comments suppressed due to low confidence (1)

docs/layouts/partials/hooks/body-end.html:8

  • This partial is described as “intentionally empty”, but it currently emits blank lines (whitespace) after the Hugo comment. If the goal is to ensure the body-end hook produces zero output, use Hugo’s whitespace-trimming delimiters and remove trailing blank lines.
{{/*
  Docsy "body-end" hook: markup injected just before </body>.
  Intentionally empty. Analytics (Microsoft Clarity) is loaded from the
  "head-end.html" hook, and code-block copy buttons are provided by Docsy's
  built-in click-to-copy feature, so no scripts are needed here.
*/}}



💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Signed-off-by: Zach Casper <zachcasper@microsoft.com>
@zachcasper
zachcasper merged commit 5cd7e5d into edge Jul 22, 2026
11 checks passed
@zachcasper
zachcasper deleted the code-block-js branch July 22, 2026 16:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants