Upgrade Hugo to 0.163.3 and add Playwright E2E tests#731
Draft
rossigee wants to merge 57 commits into
Draft
Conversation
rossigee
force-pushed
the
docs/dockerfile-display
branch
from
f530836 to
1bfd5f4
Compare
Breaking changes fixed: - markdownify on template.HTML: Add string cast in admonition.html - disableKinds: Rename taxonomyTerm to term in config.toml - mediaTypes: Replace delimiter with suffixes array - toCSS: Replace with css.Sass function - Removed unused version.html shortcode New features: - Add Playwright E2E test suite to validate breaking changes are fixed - Tests cover admonition rendering, custom output formats, CSS pipeline - Update Dockerfile and netlify.toml to pin Hugo 0.163.3 - Simplify CSS pipeline and remove unreliable .Site.IsServer usage Signed-off-by: Ross Golder <ross@golder.org>
- autoprefixer: 9.8.5 → 10.5.2 - bulma: 0.8.2 → 1.0.4 - postcss-cli: 7.1.2 → 11.0.1 Verified CSS pipeline still works correctly with new versions. Fixed npm audit vulnerabilities (picomatch ReDoS). Signed-off-by: Ross Golder <ross@golder.org>
- Use docs page with admonitions instead of blog post - Remove toBeVisible() checks on metadata elements (always hidden) - Separate CSS pipeline live test from fingerprinting validation - All 5 tests now pass successfully Signed-off-by: Ross Golder <ross@golder.org>
- Document Playwright E2E tests in README - Add 'make test' and 'make test-ui' targets - Tests validate Hugo breaking changes are fixed Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
The content/cli-docs/ directory is generated at build time by cli-docs.sh, similar to content/docs/. It should not be tracked in git. This reverts the accidental tracking added in PR goharbor#645 by untracking the 109 generated files and adding content/cli-docs/ to .gitignore. Signed-off-by: Ross Golder <ross@golder.org>
Runs on all PRs and pushes to main: - Build validation with Hugo 0.163.3 - Playwright E2E tests with Chromium - YAML and whitespace linting Artifacts: - build-output: public/ directory (5-day retention) - playwright-report: test results (7-day retention) Signed-off-by: Ross Golder <ross@golder.org>
rossigee
force-pushed
the
docs/dockerfile-display
branch
from
1bfd5f4 to
b62e50a
Compare
- .nvmrc: 14.11.0 (EOL) → 20 (LTS until April 2026) - GitHub Actions workflow: 18 (EOL) → 20 Node 14 is 3 years past EOL. Node 20 is stable LTS. Signed-off-by: Ross Golder <ross@golder.org>
v1.2.4 was from 2019. v2.1.2 is the latest stable version with bug fixes and improvements. Signed-off-by: Ross Golder <ross@golder.org>
rossigee
force-pushed
the
docs/dockerfile-display
branch
from
3021477 to
9f2d002
Compare
Keep the conditional logic for dev vs prod CSS generation: - Dev (hugo server): unfingerprinted CSS with source maps - Prod (hugo build): fingerprinted, minified CSS with PostCSS Uses .Site.BuildDrafts to detect dev mode (set by 'hugo server'). Preserves original optimization while using css.Sass function. Signed-off-by: Ross Golder <ross@golder.org>
Resolves merge conflict by using main's site.IsServer detection while keeping the critical toCSS → css.Sass upgrade needed for Hugo 0.163.3 Signed-off-by: Ross Golder <ross@golder.org>
Guard .File access with conditional check to prevent nil dereference on pages without file metadata (e.g., homepage). Signed-off-by: Ross Golder <ross@golder.org>
site.IsServer (lowercase) is not available in template context. .Site.BuildDrafts is reliably set by 'hugo server' for dev detection. Signed-off-by: Ross Golder <ross@golder.org>
Guard .File access with conditional check to prevent nil dereference. Signed-off-by: Ross Golder <ross@golder.org>
Guard all .File accesses with conditional checks to handle pages without file metadata (e.g., section list pages, homepage). Signed-off-by: Ross Golder <ross@golder.org>
- Add 'sass' npm package (Dart Sass) for Bulma 1.0.4 compatibility - Replace deprecated .Site.BuildDrafts with hugo.IsServer - Dart Sass handles modern Sass features that LibSass cannot compile - Hugo automatically uses Dart Sass when sass binary is in PATH Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Ensures sass (Dart Sass) is available in node_modules/.bin for Hugo to use. Without this, Hugo falls back to LibSass which cannot compile Bulma 1.0.x. Signed-off-by: Ross Golder <ross@golder.org>
rossigee
force-pushed
the
docs/dockerfile-display
branch
from
609e6ce to
33dbd5a
Compare
npm install adds node_modules/.bin to PATH temporarily, but it's lost when make commands run in a new shell context. Explicitly set PATH to include node_modules/.bin so Hugo finds the sass binary. Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
The sass binary wrapper needs the full dart-sass directory structure to work correctly. Extract to temp dir and copy everything to node_modules/.bin Signed-off-by: Ross Golder <ross@golder.org>
The npm sass package was interfering with our Dart Sass setup script. Since we're downloading the precompiled Dart Sass binary, we don't need the npm wrapper package. Signed-off-by: Ross Golder <ross@golder.org>
Dart Sass is stricter than LibSass about syntax. Indented Sass syntax requires semicolons at end of statements when using Dart Sass. Signed-off-by: Ross Golder <ross@golder.org>
Revert semicolon addition - indented Sass doesn't allow them. Comment out problematic mergeColorMaps call to get build working. Can revisit color customizations after basic build passes. Signed-off-by: Ross Golder <ross@golder.org>
The Dart Sass binary is in place via setup script. mergeColorMaps uses meta.type-of() which is Dart Sass only. Function is imported globally via 'bulma/sass/utilities/functions' and is now usable. Signed-off-by: Ross Golder <ross@golder.org>
mergeColorMaps with complex nested params doesn't parse in Dart Sass with indented Sass syntax. Bulma 1.0.4 provides sufficient default colors. Removed custom secondary, twitter-blue, slack-green color definitions. Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Dart Sass has issues parsing mixed .sass/.scss imports. The utilities/_all and base/_all imports should provide all needed Bulma styles. Signed-off-by: Ross Golder <ross@golder.org>
Hugo templates cannot run inside Sass files before compilation. Removed dynamic font and color configuration - use Bulma defaults only. Font/color customization should be handled outside the Sass pipeline. Signed-off-by: Ross Golder <ross@golder.org>
Add documentation for the new Dockerfile display feature that allows users to view Docker image Dockerfiles stored in OCI labels within the Harbor UI. Includes: - How to view Dockerfile in the UI - How to enable Dockerfile display in build pipelines - CI/CD integration examples (GitHub Actions, GitLab CI) - Fallback information for images without Dockerfile labels Signed-off-by: Ross Golder <ross@golder.org>
- Rename style.sass → style.scss with @use/with() for variable overrides - Convert admonition.sass → admonition.scss with proper Bulma module namespaces - Convert helpers.sass → helpers.scss using dv.*, iv.*, mx.* namespaces - Convert toc.sass → toc.scss using iv.* namespace - Update css.html to reference style.scss - Replace @import with @use for full Dart Sass compatibility - Use map.merge() instead of mergeColorMaps for custom colors - Hugo templates ({{ }}) still work via resources.ExecuteAsTemplate Signed-off-by: Ross Golder <ross@golder.org>
…a 1.0.4 - Use indented .sass syntax with @use/@use...with for Bulma 1.0.4 compatibility - Add node_modules/.bin to PATH in Makefile so Hugo can find Dart Sass binary - Convert admonition/helpers/toc to @use with proper namespaces - Keep Hugo templates for dynamic font/FontAwesome loading via ExecuteAsTemplate - Dart Sass auto-detected from PATH when available Signed-off-by: Ross Golder <ross@golder.org>
In indented Sass syntax, the with() clause must be on a single line. Backslash line continuations don't work in indented syntax. Signed-off-by: Ross Golder <ross@golder.org>
map.merge() has parsing issues in indented Sass. Keep primary/secondary overrides via @use...with() which is sufficient for main branding. Signed-off-by: Ross Golder <ross@golder.org>
.Site.LanguageCode was deprecated in Hugo v0.158.0. .Site.Language.Lang provides the language code for the html lang attribute. Signed-off-by: Ross Golder <ross@golder.org>
Dart Sass with compression already produces optimized CSS. Skip postCSS/autoprefixer to avoid Node.js --permission flag issues on Netlify. Bulma 1.0.4 output is already vendor-prefixed where needed. Signed-off-by: Ross Golder <ross@golder.org>
- Set PATH with node_modules/.bin in netlify.toml for Netlify builds - Use 'export' at top of Makefile for all local targets - Ensures Dart Sass binary is available consistently across all build contexts Signed-off-by: Ross Golder <ross@golder.org>
…ss structure - Add 'transpiler' 'dartsass' to css.html so Hugo uses Dart Sass - Simplify style.sass to @use 'bulma/bulma' directly - Remove custom admonition/helpers/toc modules (causing namespace issues) - Keep Hugo templates for dynamic fonts/FontAwesome - make serve now works locally with Dart Sass + Bulma 1.0.4 Local development with Dart Sass + Bulma 1.0.4 now functional ✅ Signed-off-by: Ross Golder <ross@golder.org>
- Removed 'transpiler' 'dartsass' option from css.html - Hugo extended has Sass/SCSS support built-in - make serve now works locally with Bulma 1.0.4 - Simplified style.sass to @use 'bulma/bulma' directly Root cause: We had Hugo *standard*, not *extended*. Only extended has Sass support. Netlify provides extended by default. Local install needed 'hugo_extended' package. Signed-off-by: Ross Golder <ross@golder.org>
With Hugo extended installed, 'transpiler' 'dartsass' option now works. make serve compiles Bulma 1.0.4 successfully in 94ms. Root cause discovery: Hugo standard ≠ Hugo extended. - Standard Hugo: no Sass support - Extended Hugo: has Dart Sass + LibSass available Solution: Use extended Hugo locally + transpiler dartsass in css.html Signed-off-by: Ross Golder <ross@golder.org>
Bulma 1.0.4 requires nested @use modules that Hugo's Dart Sass doesn't support. Solution: use Bulma's precompiled CDN CSS + compile only custom SCSS. - style.scss now contains only site-specific styles - No dependency on Bulma Sass compilation - Faster builds (430ms) - make serve works locally ✅ - Customization via CSS variables Bulma colors hardcoded in custom styles (primary #4495d7, secondary #60b932) Signed-off-by: Ross Golder <ross@golder.org>
Bulma 1.0.4 derives all colors from HSL CSS custom properties. Override --bulma-primary-h/s/l, --bulma-link-h/s/l, --bulma-info-h/s/l in :root to restore harbor blue (#4495d7) and green (#60b932). No Sass compilation of Bulma needed - precompiled CSS + CSS variable overrides is the correct approach for Bulma 1.0.4. Signed-off-by: Ross Golder <ross@golder.org>
- Add theme toggle button to navbar (Alpine.js x-data) - Add inline theme init script to baseof.html to avoid FOUC - Add complete [data-theme=dark] CSS rules matching live site - Add .theme-toggle button styles Signed-off-by: Ross Golder <ross@golder.org>
- has-text-secondary (#60b932 harbor green) - has-text-twitter-blue, button.is-twitter-blue (#1da1f2) - has-text-slack-green, button.is-slack-green (#2EB67D) - Dark mode overrides for these classes Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Signed-off-by: Ross Golder <ross@golder.org>
Addressed 8 critical and cleanup issues from code review:
Correctness fixes:
- CI test job now downloads build artifact before running E2E tests
(tests check public/ directory which was never populated)
- CSS test now targets local stylesheet, not CDN Bulma link
- Dockerfile installs Node 20 from NodeSource (was Debian bookworm's Node 18)
- Dockerfile uses npm ci instead of npm install for reproducible builds
- Restored postCSS autoprefixer to production CSS pipeline
Operational fixes:
- YAML lint now outputs stderr for actionable error diagnostics
- Playwright webServer setup now runs setup-dart-sass.sh to ensure Dart Sass
- Dart Sass install script now idempotent (skips re-install if present)
Cleanup:
- Removed 8 dead files never compiled or served:
- assets/css/overrides.css (never linked)
- assets/sass/{admonition,helpers,toc,style}.{sass,scss}
(style.scss now entry point, inlines content directly)
Tested: Hugo builds 1877 pages, CSS fingerprints correctly, _redirects generated
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
4 participants
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
Test plan
✅ All 5 Playwright E2E tests passing
✅ Production build succeeds
✅ _redirects file generated correctly
✅ CSS pipeline works with updated packages
✅ No npm audit vulnerabilities
✅ All commits signed-off (DCO)
Files changed