docs: add Node.js SDK references and website validation tests - #199
Merged
Conversation
- Add Node.js SDK section to README Runtime SDKs with install and code examples - Update features table, comparison table, and What's Next to reflect shipped status - Add Node.js/TypeScript tab to HowItWorks step 03 on the website
Contributor
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughReplaced the TypeScript SDK tab with a Node.js/TypeScript example in the HowItWorks component, updated translations and their type, removed build-time changelog injection and its typing, added Node.js SDK docs and installation instructions, rewrote top-level CHANGELOG into an index, improved website UI/scrolling/video behavior, and added Vitest suites for changelog and i18n validation. ChangesWebsite UI, typings & build
Changelogs, SDK documentation & installation
Tests: changelogs and i18n validation
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labelsenhancement 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Code Review
This pull request updates the documentation and website to include the newly released Node.js SDK. The changes include adding installation instructions and code examples to the README, updating the feature comparison table, and adding a TypeScript code snippet to the website's 'How It Works' component. A review comment identified a missing import in one of the README code examples that would cause a reference error when using the fluent builder API.
macalbert
changed the title
Contributor
There was a problem hiding this comment.
Pull request overview
Adds Node.js SDK visibility to public docs by updating the main README and the website “How it works” code samples.
Changes:
- Added a Node.js/TypeScript SDK code tab to the website “How it works” component.
- Updated README feature/comparison tables and roadmap messaging to include the Node.js SDK.
- Added a new README “Node.js SDK” section with install + usage examples and an examples link.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/website/src/components/HowItWorks.astro | Adds a TypeScript/Node.js SDK tab and example usage snippet to the tabbed code block. |
| README.md | Adds Node.js SDK references (features table, comparison table, roadmap) and a Node.js SDK install/usage section. |
macalbert
changed the title
Also clarify pr-sync skill to use final diff vs base as source of truth for PR body.
…nd review-response instructions
- Fix cli.md AddEnvilder snippet (remove incorrect provider param) - Fix sdk-dotnet changelog: netstandard2.0, not .NET 8.0/9.0 - Fix Node.js SDK links in README to point to src/sdks/nodejs/ - Fix Python version in CONTRIBUTING (3.10+, not 3.12+) - Add Node.js SDK v0.1.0, .NET v0.2.0, Python v0.3.2 to main CHANGELOG - Create src/sdks/nodejs/README.md with full Quick Start and API Reference - Add go/ and java/ placeholders to CONTRIBUTING project structure - Add Node.js SDK section to requirements-installation.md - Remove push reference from GHA README (GHA is pull-only) - Add scope header to cli.md clarifying it covers CLI+GHA only - Update Unreleased section in CHANGELOG with recent SDK releases - Clarify .NET SDK README prerequisites (netstandard2.0-compatible)
macalbert
changed the title
macalbert
changed the title
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/website/src/components/CodeBlock.astro (1)
97-110:⚠️ Potential issue | 🟠 Major | ⚡ Quick winCopy button visually obscured by the fade indicator when code overflows.
Both
.copy-btnand.codeblock-body::afterdeclarez-index: 1. Because::afterpseudo-elements paint after all children in the same stacking level, the fade gradient sits on top of the copy button. The copy button sits atright: var(--space-sm)(~8 px), well within the 32 px fade area — so the button icon is visually dimmed by the gradient exactly when the code block is wide enough to need copying.
pointer-events: nonekeeps clicks working, but the visual feedback (button visibility) is degraded in the common overflow case.🔧 Proposed fix — bump copy button z-index above the fade layer
.copy-btn { position: absolute; top: var(--space-sm); right: var(--space-sm); background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-muted); padding: 4px; cursor: pointer; opacity: 0; transition: opacity 0.2s, color 0.2s, background 0.2s; - z-index: 1; + z-index: 2; line-height: 0; }Also applies to: 144-168
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/website/src/components/CodeBlock.astro` around lines 97 - 110, The copy button is visually obscured by the overflow fade because both .copy-btn and .codeblock-body::after use z-index: 1; update the stacking so the button sits above the fade by increasing .copy-btn's z-index (e.g., set z-index to a higher value like 2 or any value greater than the fade layer) or lower the ::after z-index accordingly; ensure you modify the .copy-btn rule (and verify the .codeblock-body::after rule if present) so the copy button renders visually above the fade while preserving pointer-events behavior and positioning.src/website/src/i18n/en.ts (1)
405-416:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winRoadmap planned-items order is inconsistent with
ca.tsandes.ts.In
en.ts, "Exec mode (--exec)" (⚡) appears at position 11, followed by "GCP Secret Manager" (☁️) at position 12. In bothca.tsandes.tsthe order is reversed: GCP comes first, then Exec mode. Because the roadmap component renders these arrays in order, English users see a different priority sequence than Catalan/Spanish users.🔧 Proposed fix — align `en.ts` with `ca.ts` / `es.ts` ordering
- { - status: 'planned', - label: '⚡', - title: 'Exec mode (--exec)', - description: - 'Inject secrets into child process without writing to disk', - }, { status: 'planned', label: '☁️', title: 'GCP Secret Manager', description: 'Third cloud provider. Completes the multi-cloud trident', }, + { + status: 'planned', + label: '⚡', + title: 'Exec mode (--exec)', + description: + 'Inject secrets into child process without writing to disk', + },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/website/src/i18n/en.ts` around lines 405 - 416, Swap the two planned roadmap entries in src/website/src/i18n/en.ts so their order matches ca.ts and es.ts: locate the objects with title "Exec mode (--exec)" (label '⚡', status 'planned') and "GCP Secret Manager" (label '☁️', status 'planned') and reorder them so "GCP Secret Manager" comes before "Exec mode (--exec)"; ensure no other fields are modified and the array order is preserved for the roadmap component.
🧹 Nitpick comments (1)
tests/website/i18n/completeness.test.ts (1)
17-18: 💤 Low value
extractKeysrecords only array length — cannot detect cross-locale item-ordering drift.Line 18:
keys.push(${path}[length:${value.length}])verifies that arrays have matching lengths, but it silently accepts arrays with the same length but different element ordering. As noted inen.tsvsca.ts/es.ts, the roadmap planned items are already in different orders across locales, which this test will not catch.This is a design trade-off worth documenting with a comment so future contributors understand the intentional scope limitation.
📝 Suggested inline comment
} else if (Array.isArray(value)) { + // Records length only; element ordering differences across locales are not detected. keys.push(`${path}[length:${value.length}]`);🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@tests/website/i18n/completeness.test.ts` around lines 17 - 18, The array handling in extractKeys currently records only array length via keys.push(`${path}[length:${value.length}]`), which won't detect same-length arrays with reordered elements; add an inline comment immediately above that line in the extractKeys function stating this is an intentional limitation (we only check length, not element order) and note why (to avoid false positives for locale-specific ordering) so future contributors understand the scope and can adjust if stricter ordering checks are later required.
🤖 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/website/src/components/DemoVideo.astro`:
- Around line 23-30: The <video> element in DemoVideo.astro currently autoplays
and loops (src="/Envilder-demo.mp4", autoplay, loop, playsinline, muted) which
violates WCAG pause/stop requirements and ignores the user's
prefers-reduced-motion setting; add the controls attribute to the <video> to
provide pause/stop UI, and add an inline script in the DemoVideo.astro component
that queries window.matchMedia('(prefers-reduced-motion: reduce)') on load and,
if matched, pauses the video and removes or prevents autoplay (e.g., call
pause() and remove the autoplay attribute or set autoplay=false on the video
element referenced via document.querySelector or a ref), ensuring the script
runs only on the client.
---
Outside diff comments:
In `@src/website/src/components/CodeBlock.astro`:
- Around line 97-110: The copy button is visually obscured by the overflow fade
because both .copy-btn and .codeblock-body::after use z-index: 1; update the
stacking so the button sits above the fade by increasing .copy-btn's z-index
(e.g., set z-index to a higher value like 2 or any value greater than the fade
layer) or lower the ::after z-index accordingly; ensure you modify the .copy-btn
rule (and verify the .codeblock-body::after rule if present) so the copy button
renders visually above the fade while preserving pointer-events behavior and
positioning.
In `@src/website/src/i18n/en.ts`:
- Around line 405-416: Swap the two planned roadmap entries in
src/website/src/i18n/en.ts so their order matches ca.ts and es.ts: locate the
objects with title "Exec mode (--exec)" (label '⚡', status 'planned') and "GCP
Secret Manager" (label '☁️', status 'planned') and reorder them so "GCP Secret
Manager" comes before "Exec mode (--exec)"; ensure no other fields are modified
and the array order is preserved for the roadmap component.
---
Nitpick comments:
In `@tests/website/i18n/completeness.test.ts`:
- Around line 17-18: The array handling in extractKeys currently records only
array length via keys.push(`${path}[length:${value.length}]`), which won't
detect same-length arrays with reordered elements; add an inline comment
immediately above that line in the extractKeys function stating this is an
intentional limitation (we only check length, not element order) and note why
(to avoid false positives for locale-specific ordering) so future contributors
understand the scope and can adjust if stricter ordering checks are later
required.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: b592d13e-d096-4754-9eee-3930d94082f7
⛔ Files ignored due to path filters (4)
.github/skills/common-testing-conventions/SKILL.mdis excluded by none and included by none.github/skills/dotnet-testing/SKILL.mdis excluded by none and included by none.github/skills/typescript-testing/SKILL.mdis excluded by none and included by nonesrc/website/public/Envilder-demo.mp4is excluded by!**/*.mp4and included bysrc/**
📒 Files selected for processing (18)
docs/CHANGELOG.mddocs/changelogs/cli.mdsrc/website/src/components/CodeBlock.astrosrc/website/src/components/DemoVideo.astrosrc/website/src/components/DocsContent.astrosrc/website/src/components/GitHubAction.astrosrc/website/src/components/HowItWorks.astrosrc/website/src/components/Sdks.astrosrc/website/src/i18n/ca.tssrc/website/src/i18n/en.tssrc/website/src/i18n/es.tssrc/website/src/layouts/BaseLayout.astrosrc/website/src/pages/ca/changelog.astrosrc/website/src/pages/changelog.astrosrc/website/src/pages/es/changelog.astrosrc/website/src/styles/global.csstests/website/changelogs/version-consistency.test.tstests/website/i18n/completeness.test.ts
✅ Files skipped from review due to trivial changes (9)
- src/website/src/components/GitHubAction.astro
- src/website/src/layouts/BaseLayout.astro
- src/website/src/components/DocsContent.astro
- src/website/src/pages/es/changelog.astro
- src/website/src/components/Sdks.astro
- src/website/src/pages/ca/changelog.astro
- tests/website/changelogs/version-consistency.test.ts
- docs/changelogs/cli.md
- docs/CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (1)
- src/website/src/components/HowItWorks.astro
Increase code block scrollbar thickness to 8px with visible track background. Offset fade overlay 10px from bottom to avoid covering the scrollbar. Add safe-area-inset-bottom to footer padding for mobile browsers. Add max-height and overflow-y to mobile nav menu.
Replace duplicated cross-component changelog entries with a clean index table linking to per-component changelogs in docs/changelogs/. Add docs/CHANGELOG.md back to package.json files array so the README link resolves in the npm tarball.
Replace console.log(secrets.get('DB_PASSWORD')) with a presence check
to avoid normalizing unsafe secret-logging patterns in copy-paste docs.
The SDK tab and npm package are Node.js (@envilder/sdk), not TypeScript. Updated all 3 locales (en, ca, es) for consistency.
…port Add controls attribute for WCAG 2.2.2 pause/stop compliance, preload=metadata for lazy loading, and a script to pause the video when the user has prefers-reduced-motion enabled.
AAA markers are now mandatory for all tests, including structural guards. Removes the contradictory exemption from typescript-testing and common-testing-conventions skills.
- Compress Envilder-demo.mp4 from 8.36 MB to 0.59 MB (720p, CRF 28) - Include all changelogs in npm package via docs/changelogs/** glob - Add GHA changelog version-consistency test
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
src/website/src/components/Navbar.astro (1)
233-234: ⚡ Quick winPrefer
100svhover100vhfor the mobile menu cap; also account forsafe-area-inset-bottom.
100vhon iOS Safari (and most mobile browsers) is calculated based on the maximum viewport height — when browser chrome is fully hidden — so it includes space that isn't actually visible on first load. For amax-heightconstraint on a fixed mobile menu,100svh(small viewport height, assuming the address bar is expanded) means the element will always have a fixed, fully-visible height;100dvh(dynamic) also works but resizes the element as the address bar retracts, which can be jarring.Additionally, on notched/home-indicator iPhones, the bottom of the fully-extended menu will be obscured behind the home indicator. Since the PR already adds
env(safe-area-inset-bottom)to the footer, consistency suggests adding it here too.✨ Proposed fix
.nav-open .nav-menu { display: flex; flex-direction: column; gap: var(--space-lg); position: absolute; top: var(--nav-height); left: 0; right: 0; - max-height: calc(100vh - var(--nav-height)); + max-height: calc(100vh - var(--nav-height)); /* fallback */ + max-height: calc(100svh - var(--nav-height)); overflow-y: auto; background: var(--color-nav-mobile); padding: var(--space-lg); + padding-bottom: max(var(--space-lg), env(safe-area-inset-bottom, 0px)); border-bottom: 2px solid var(--color-border); z-index: 99; }🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/website/src/components/Navbar.astro` around lines 233 - 234, Update the mobile menu max-height to use the small viewport unit and account for the bottom safe area: replace the current rule that uses calc(100vh - var(--nav-height)) with a calc that uses 100svh and subtracts both var(--nav-height) and the bottom safe inset (env(safe-area-inset-bottom)); target the same CSS rule that defines max-height and overflow-y in Navbar.astro so the mobile menu uses max-height: calc(100svh - var(--nav-height) - env(safe-area-inset-bottom)) and keeps overflow-y: auto.
🤖 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/website/src/i18n/ca.ts`:
- Around line 167-170: The Catalan translation still uses "TypeScript" in the
features.features[1].description string; update that string to match the change
in howItWorks (use "Node.js" instead of "TypeScript") so
features.features[1].description reads "Python, .NET, Node.js, Go, Java",
ensuring the same wording change you applied in en.ts is mirrored in
src/website/src/i18n/ca.ts.
In `@tests/website/changelogs/version-consistency.test.ts`:
- Around line 13-17: latestChangelogVersion currently falls back to an empty
string when extractVersions(md) returns no entries, causing opaque assertion
errors later; change latestChangelogVersion to check versions.length and throw a
clear Error (including the file name and a short hint that parsing failed or the
markdown header format is unexpected) if no versions were parsed, otherwise
return versions[0].tag; reference the function latestChangelogVersion, the local
variable versions, and the call to extractVersions(md) when making the change.
---
Nitpick comments:
In `@src/website/src/components/Navbar.astro`:
- Around line 233-234: Update the mobile menu max-height to use the small
viewport unit and account for the bottom safe area: replace the current rule
that uses calc(100vh - var(--nav-height)) with a calc that uses 100svh and
subtracts both var(--nav-height) and the bottom safe inset
(env(safe-area-inset-bottom)); target the same CSS rule that defines max-height
and overflow-y in Navbar.astro so the mobile menu uses max-height: calc(100svh -
var(--nav-height) - env(safe-area-inset-bottom)) and keeps overflow-y: auto.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 1ca70327-721b-43aa-825d-fa831d238edc
⛔ Files ignored due to path filters (6)
.github/agents/pr-resolver.agent.mdis excluded by none and included by none.github/skills/common-testing-conventions/reference.mdis excluded by none and included by none.github/skills/typescript-testing/SKILL.mdis excluded by none and included by nonebiome.jsonis excluded by none and included by nonepackage.jsonis excluded by none and included by nonesrc/website/public/Envilder-demo.mp4is excluded by!**/*.mp4and included bysrc/**
📒 Files selected for processing (13)
docs/CHANGELOG.mddocs/changelogs/gha.mde2e/sample/cli-validation.envsrc/sdks/nodejs/README.mdsrc/website/src/components/CodeBlock.astrosrc/website/src/components/DemoVideo.astrosrc/website/src/components/Footer.astrosrc/website/src/components/Navbar.astrosrc/website/src/i18n/ca.tssrc/website/src/i18n/en.tssrc/website/src/i18n/es.tssrc/website/src/styles/global.csstests/website/changelogs/version-consistency.test.ts
✅ Files skipped from review due to trivial changes (4)
- e2e/sample/cli-validation.env
- docs/changelogs/gha.md
- src/sdks/nodejs/README.md
- src/website/src/components/CodeBlock.astro
🚧 Files skipped from review as they are similar to previous changes (2)
- src/website/src/components/DemoVideo.astro
- src/website/src/i18n/es.ts
…t guard - Replace 'TypeScript' with 'Node.js' in feature descriptions (EN, CA, ES) - Add explicit length guard to latestChangelogVersion helper - Add package.json to release-coherence applyTo patterns
4 tasks
4 tasks
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 free
to 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.
Summary
Adds Node.js SDK references across all documentation surfaces (README, website, changelogs) and introduces website validation tests for i18n completeness, changelog integrity, and version consistency. Also fixes multiple mobile responsive issues: code block scrolling, changelog overflow, navbar menu scroll, and scrollbar visibility.
Changes
Documentation
src/sdks/nodejs/README.mdwith full API reference and usage examplesdocs/changelogs/sdk-nodejs.mdwith v0.1.1 changelog entrydocs/CHANGELOG.mdto remove duplicated contentdocs/requirements-installation.mdwith Node.js SDK install instructionsWebsite
Envilder-demo.mp4)min-width: 0on grid item,overflow-wrapon inline code)max-heightandoverflow-y: autoto mobile nav menu for scrollabilitysafe-area-inset-bottomto footer padding for mobile browsersmacalbertGitHub handleastro.config.mjsTests
tests/website/i18n/completeness.test.ts— validates all i18n keys present across localestests/website/changelogs/integrity.test.ts— validates changelog markdown structuretests/website/changelogs/version-consistency.test.ts— validates changelog versions match package sourcesSkills & Instructions
release-coherence.instructions.mdfor version bump workflowsTesting
pnpm buildpasses (website)pnpm lintpassesRelated
N/A
Summary by CodeRabbit
Release Notes
New Features
Bug Fixes
Documentation
Security
Chores