feat: add anchor links to section headings for easier sharing - #79
Merged
Conversation
Agent-Logs-Url: https://github.com/nitrocode/token-deathclock/sessions/7d801f72-9ab0-4d7a-b9e0-25405e22f213 Co-authored-by: nitrocode <7775707+nitrocode@users.noreply.github.com>
Copilotcreated this pull request from a session on behalf of nitrocodeApril 26, 2026 15:30 View session
nitrocode
marked this pull request as ready for review
April 26, 2026 15:30
Contributor
📝 WalkthroughWalkthroughI pity the fool — this PR adds a DOM helper that injects self-referential anchors into Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Suggested reviewers
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/js/08-static-renders.js`:
- Around line 95-106: renderSectionAnchors is appending identical anchors every
call and giving them the same aria-label; update it so before creating a new
anchor it checks the heading (h2) for an existing element with class
'section-anchor' and skips creating a duplicate, and set a distinct accessible
name on the anchor (e.g., use the section id or the h2 text in the aria-label
like "Link to section: <section id or heading text>") so each link is unique and
accessible; locate the logic inside renderSectionAnchors and update
creation/labeling behavior for elements with class 'section-anchor'.
In `@styles/base.css`:
- Around line 64-67: The section anchor is only revealed on hover/focus
(selectors: h2:hover .section-anchor and .section-anchor:focus), which hides it
on touch devices; update the rules to also show the anchor when the heading
receives keyboard focus (use h2:focus-within .section-anchor) and add a
touch-device rule using a media query (e.g., `@media` (hover: none) or (pointer:
coarse)) to make .section-anchor visible (opacity: 1) on touch devices so
anchors are discoverable. Ensure you modify the selectors around
.section-anchor, h2:hover .section-anchor and add the media-query fallback so
both keyboard and touch users can see the link.
In `@tests/e2e/death-clock.spec.js`:
- Around line 294-304: The current tests ('section headings have anchor links
rendered' and 'section anchor href matches the section id') only check existence
and a single anchor; update them to assert a 1:1 mapping by iterating over all
elements returned by page.locator('section[id]') and for each section: read its
id (section.getAttribute('id')), ensure it contains exactly one child anchor
matching the selector 'h2 .section-anchor' (or fail if none/multiple), and
assert that that anchor's href equals `#${id}`; modify the tests (or replace
both with a single test) to implement these per-section checks using the section
locator and per-section queries to prevent flakiness.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 4b81c43b-d486-4fd0-92f0-f6ad6b923738
📒 Files selected for processing (6)
script.jssrc/js/08-static-renders.jssrc/js/21-boot.jsstyles.cssstyles/base.csstests/e2e/death-clock.spec.js
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
nitrocode
commented
Apr 26, 2026
Owner
@copilot resolve the merge conflicts in this pull request |
…nks-to-sections # Conflicts: # script.js # styles.css Co-authored-by: nitrocode <7775707+nitrocode@users.noreply.github.com>
ContributorAuthor
Resolved in a9a6c54. The conflicts were modify/delete on Warning Firewall rules blocked me from connecting to one or more addresses (expand for details)I tried to connect to the following addresses, but was blocked by firewall rules:
If you need me to access, download, or install something from one of these locations, you can either:
|
Contributor
👁️ PR Preview
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@## main #79 +/- ##
=========================================
Coverage 100.00% 100.00% =========================================
Files 1 1 Lines 233 233 Branches 107 107 =========================================
Hits 233 233
Flags with carried forward coverage won't be shown. Click here to find out more. Continue to review full report in Codecov by Sentry.
🚀 New features to boost your workflow:
|
…bility Agent-Logs-Url: https://github.com/nitrocode/token-deathclock/sessions/8397f1a8-7c39-467d-8c62-872805eb9304 Co-authored-by: nitrocode <7775707+nitrocode@users.noreply.github.com>
Agent-Logs-Url: https://github.com/nitrocode/token-deathclock/sessions/20127361-a643-4004-9394-31e5f585a8a9 Co-authored-by: nitrocode <7775707+nitrocode@users.noreply.github.com>
nitrocode
commented
Apr 26, 2026
Owner
@coderabbitai review |
Contributor
✅ Actions performedReview triggered.
|
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@styles/base.css`:
- Around line 52-73: You added/changed styles in styles/base.css (notably the
.section-anchor rules) but did not regenerate the compiled stylesheet; run the
CSS build step (npm run build:css) to produce the updated styles.css so the new
selectors are included in the build, then verify the generated file contains the
.section-anchor rules and commit the regenerated artifact.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
Uh oh!
There was an error while loading. Please reload this page.
nitrocode
enabled auto-merge (squash)
April 26, 2026 16:15
Uh oh!
There was an error while loading. Please reload this page.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
styles/base.css— missingh2:focus-withinand@media (hover: none)rulesh2:focus-within .section-anchorselector@media (hover: none)block to keep section anchors visible on touch devicesSummary by CodeRabbit
Release Notes
New Features
Style