scavold 0.2.0-rc.7 → 0.2.0-rc.9

package/CHANGELOG.md

@@ -9,6 +9,37 @@ changes may occur in any release.
 
 ## [Unreleased]
 
+## [0.2.0-rc.9] — 2026-10-01
+
+### Fixed
+
+- An image wider than the largest of `image_widths` named that width twice in its
+  `srcset`, and had its widest variant written twice at the same time.
+
+## [0.2.0-rc.8] — 2026-10-01
+
+### Added
+
+- `SECURITY.md` says how to report a vulnerability and which versions receive fixes,
+  beside the [cratly security policy](https://cratly.io/security) it belongs to.
+  Every release's tag pipeline keeps a CycloneDX SBOM of what a site installs along
+  with scavold, and checks those packages for known vulnerabilities; `bun run sbom`
+  and `bun run audit:runtime` do the same locally.
+
+### Fixed
+
+- A photo whose camera stored it turned, saying in its EXIF data how to show it, came
+  out upside down or lying on its side on the site, and a portrait got the variant
+  widths of a landscape. The variants are now turned the way the photo says, and
+  measured by the width it is shown at. Every image gets new variant names once, so
+  variants kept between builds are written again rather than served as they were.
+
+### Security
+
+- `sharp` 0.35, whose bundled libvips and libheif fix vulnerabilities reported against
+  0.34 (GHSA-f88m-g3jw-g9cj, GHSA-rgj7-g3m4-5g8c). It needs Node 20.9 or newer, and so
+  does scavold now.
+
 ## [0.2.0-rc.7] — 2026-09-29
 
 ### Fixed
@@ -258,7 +289,9 @@ First published release. Version `0.1.0` existed in-tree only.
 - Only images are processed out of `media_folder`; other file types (video, documents)
   are never copied into the build output and have to live in the static folder.
 
-[Unreleased]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.7...main
+[Unreleased]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.9...main
+[0.2.0-rc.9]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.8...v0.2.0-rc.9
+[0.2.0-rc.8]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.7...v0.2.0-rc.8
 [0.2.0-rc.7]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.6...v0.2.0-rc.7
 [0.2.0-rc.6]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.5...v0.2.0-rc.6
 [0.2.0-rc.5]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0-rc.4...v0.2.0-rc.5

package/README.md

@@ -18,9 +18,14 @@ bun add vitepress vue scavold@^0.2.0-rc.3
 
 Responsive image generation uses [sharp](https://sharp.pixelplumbing.com/), which
 installs a platform-specific native binary — build environments therefore need to
-be able to fetch it (Node 20 or newer).
+be able to fetch it (Node 20.9 or newer).
 
 Full documentation, including a quick-start guide, component and front matter
 references, and deployment instructions, is available at
 
 **[https://scavold.io](https://scavold.io)**.
+
+## Security
+
+To report a security vulnerability, contact **security@cepharum.de**. How reports are
+handled, and where to find the SBOM of every release, is in [SECURITY.md](SECURITY.md).

package/SECURITY.md

@@ -0,0 +1,38 @@
+# Security
+
+scavold is part of cratly, for which cepharum GmbH acts as open-source software steward
+under the EU Cyber Resilience Act. The [cratly security policy](https://cratly.io/security)
+covers how vulnerabilities are reported, handled and disclosed; this page adds what is
+specific to scavold.
+
+## Reporting a vulnerability
+
+Please report it privately, not in a public issue:
+
+- open a [confidential issue](https://gitlab.com/cratly/scavold/-/issues/new?issue[confidential]=true)
+  in the scavold project, or
+- write to [security@cepharum.de](mailto:security@cepharum.de).
+
+Useful to include: the affected version, what an attacker can achieve, and the steps
+or a minimal site that shows it. A vulnerability in one of scavold's dependencies is
+welcome too, when scavold is how it reaches a site.
+
+## Supported versions
+
+Until 1.0.0, only the latest published release receives security fixes; there are no
+backports to earlier pre-releases. Update to the latest release before reporting, if
+you can.
+
+## What scavold brings into a site
+
+scavold runs while a site is built, not when it is visited. Its runtime dependencies
+are few — `sharp` for image processing among them — and `vitepress` and `vue` are
+peer dependencies the site chooses itself.
+
+- **SBOM.** Every release comes with a CycloneDX software bill of materials, kept as
+  the `sbom` job's artifact of the release's tag pipeline in GitLab, from 0.2.0-rc.8
+  onwards. `bun run sbom` writes the same for the working tree.
+- **Known vulnerabilities.** The runtime dependencies are checked against the npm
+  advisory database in every tag pipeline and in a weekly scheduled pipeline;
+  `bun run audit:runtime` runs the same check locally. A finding is fixed by a release
+  of its own.

package/lib/media.js

@@ -6,6 +6,13 @@ import sharp from "sharp";
 
 const DEFAULT_WIDTHS = [ 320, 640, 960, 1280, 1920 ];
 
+/**
+ * Enters every variant's name along with the source content. Raise it whenever the
+ * pipeline would write different pixels for the same source, or variants a site keeps
+ * between builds are taken for correct and never written again.
+ */
+const PIPELINE_REVISION = "2";
+
 /**
  * File types the image pipeline can scale. Everything else in the media folder is
  * published by copying it verbatim — authors upload PDFs, videos and other downloads
@@ -41,7 +48,7 @@ function variantsPublicDir( root, staticDir ) {
  * @returns {string}
  */
 function contentHash( filePath ) {
-	return createHash( "sha1" ).update( readFileSync( filePath ) ).digest( "hex" ).slice( 0, 8 );
+	return createHash( "sha1" ).update( PIPELINE_REVISION ).update( readFileSync( filePath ) ).digest( "hex" ).slice( 0, 8 );
 }
 
 /**
@@ -73,14 +80,21 @@ async function generateVariants( srcPath, outDir, widths ) {
 	const hash = contentHash( srcPath );
 	const ext = extname( srcPath ).toLowerCase().replace( ".", "" ) || "jpg";
 	const base = toKebabCase( basename( srcPath, extname( srcPath ) ) );
-	const image = sharp( srcPath );
+	// A camera stores pixels as the sensor saw them and an EXIF tag saying how to turn
+	// them. The variants carry no metadata, so the turn has to go into their pixels —
+	// and the width that counts is the one the photo is shown at.
+	const image = sharp( srcPath ).autoOrient();
 	const meta = await image.metadata();
-	const sourceWidth = meta.width ?? Infinity;
+	const sourceWidth = meta.autoOrient?.width ?? meta.width ?? Infinity;
 
 	const targets = widths.filter( w => w <= sourceWidth );
 
-	if ( targets.length === 0 || targets[targets.length - 1] < sourceWidth ) {
-		targets.push( Math.min( sourceWidth, widths[widths.length - 1] ) );
+	// A source between two steps of the ladder caps it at its own width; one wider
+	// than the ladder already ends on its last step.
+	const widest = Math.min( sourceWidth, widths[widths.length - 1] );
+
+	if ( targets.length === 0 || targets[targets.length - 1] < widest ) {
+		targets.push( widest );
 	}
 
 	const srcsetParts = [];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "scavold",
-	"version": "0.2.0-rc.7",
+	"version": "0.2.0-rc.9",
 	"type": "module",
 	"description": "VitePress theme framework — a scaffold for building custom VitePress themes with Vue at the core",
 	"keywords": [
@@ -23,7 +23,7 @@
 	"homepage": "https://scavold.io",
 	"bugs": "https://gitlab.com/cratly/scavold/-/issues",
 	"engines": {
-		"node": ">=20"
+		"node": ">=20.9.0"
 	},
 	"types": "./index.d.ts",
 	"exports": {
@@ -53,7 +53,9 @@
 		"COMPONENTS.md",
 		"FRONTMATTER.md",
 		"README.md",
-		"!**/*.test.js"
+		"SECURITY.md",
+		"!**/*.test.js",
+		"!scripts/supply-chain.js"
 	],
 	"scripts": {
 		"check-csp": "node scripts/check-csp.js",
@@ -65,7 +67,9 @@
 		"test:fixture": "bun scripts/check-fixture.js",
 		"test:unit:dev": "bun test --watch",
 		"lint": "eslint .",
-		"lint:fix": "eslint . --fix"
+		"lint:fix": "eslint . --fix",
+		"sbom": "node scripts/supply-chain.js sbom",
+		"audit:runtime": "node scripts/supply-chain.js audit"
 	},
 	"peerDependencies": {
 		"vitepress": ">=1.0.0",
@@ -74,7 +78,7 @@
 	"dependencies": {
 		"@cepharum/vue3-i18n": "^2.0.0",
 		"markdown-it-container": "^4.0.0",
-		"sharp": "^0.34.5",
+		"sharp": "^0.35.5",
 		"yaml": "^2.8.3"
 	},
 	"devDependencies": {

package/scripts/check-fixture.js

@@ -74,6 +74,22 @@ async function writeMedia() {
 	// its variants exist only if the front matter pass reached the media pipeline.
 	await sharp( gradient( 1200, 800 ) ).jpeg( { quality: 70 } ).toFile( join( media, "teaser.jpg" ) );
 
+	// Photos the way a phone camera writes them: pixels as the sensor saw them, plus an
+	// EXIF tag saying how to turn them. Red marks the edge that has to end up on top.
+	const halves = ( w, h, red ) => Buffer.from(
+		`<svg xmlns="http://www.w3.org/2000/svg" width="${w}" height="${h}">` +
+		`<rect width="${w}" height="${h}" fill="#0000ff"/>` +
+		`<rect ${red === "bottom" ? `y="${h / 2}"` : ""} width="${red === "left" ? w / 2 : w}" ` +
+		`height="${red === "left" ? h : h / 2}" fill="#ff0000"/></svg>`
+	);
+
+	// Stored upside down, to be turned by 180°.
+	await sharp( halves( 1200, 800, "bottom" ) ).jpeg( { quality: 70 } ).withMetadata( { orientation: 3 } )
+		.toFile( join( media, "upside-down.jpg" ) );
+	// Stored lying on its side, 1600 × 1200, to be turned by 90° into a 1200px wide portrait.
+	await sharp( halves( 1600, 1200, "left" ) ).jpeg( { quality: 70 } ).withMetadata( { orientation: 6 } )
+		.toFile( join( media, "portrait.jpg" ) );
+
 	writeFileSync( join( media, "doc.pdf" ), "%PDF-1.4\n% fixture placeholder\n" );
 	writeFileSync( join( media, "clip.mp4" ), "fixture placeholder\n" );
 	// An extension VitePress does not know, so its link rules take the file for a page.
@@ -184,11 +200,59 @@ expect( published.some( f => /^narrow--800w-[0-9a-f]+\.jpg$/.test( f ) ),
 	"caps the widest variant at the source width" );
 expect( !published.some( f => /^narrow--(960|1280|1920)w-/.test( f ) ),
 	"does not upscale a narrow source" );
+
+const wideSrcset = ( media.match( /srcset="([^"]*wide--[^"]*\.jpg[^"]*)"/ ) ?? [ "", "" ] )[1];
+const wideWidths = wideSrcset.split( "," ).map( entry => entry.trim().split( " " )[1] );
+
+expect( wideWidths.join( " " ) === "320w 640w 960w 1280w 1920w",
+	"names each width once in the srcset of a source wider than the ladder",
+	`found ${wideWidths.join( " " ) || "nothing"}` );
 expect( media.includes( 'sizes="(min-width: 40rem) 32rem, 100vw"' ),
 	"applies the sizes value from the site configuration" );
 expect( media.includes( 'sizes="100vw"' ), "lets a single image override sizes through its title" );
 expect( media.includes( 'src="https://example.com/absent.png"' ), "leaves a remote image untouched" );
 
+/**
+ * Tells which edge of a published variant is red, the colour marking the top.
+ *
+ * @param {string} file name of the variant in the published media folder
+ * @returns {Promise<{width: number, height: number, top: string}>}
+ */
+async function orientationOf( file ) {
+	const { data, info } = await sharp( join( MEDIA_OUT, file ) ).raw().toBuffer( { resolveWithObject: true } );
+	const red = offset => data[offset] > data[offset + 2];
+	const middle = x => ( Math.floor( info.height / 2 ) * info.width + x ) * info.channels;
+	const top = red( Math.floor( info.width / 2 ) * info.channels ) ? "top"
+		: red( ( ( info.height - 1 ) * info.width + Math.floor( info.width / 2 ) ) * info.channels ) ? "bottom"
+			: red( middle( 0 ) ) ? "left" : red( middle( info.width - 1 ) ) ? "right" : "none";
+
+	return { width: info.width, height: info.height, top };
+}
+
+// Browsers honour the EXIF tag only on the file they are given. The variants carry
+// no metadata, so the turn has to be in their pixels already.
+const turned = await Promise.all( published
+	.filter( f => /^(upside-down|portrait)--/.test( f ) )
+	.map( async f => ( { f, ...await orientationOf( f ) } ) ) );
+
+for ( const name of [ "upside-down", "portrait" ] ) {
+	const found = turned.filter( v => v.f.startsWith( `${name}--` ) );
+	const wrong = found.filter( v => v.top !== "top" );
+
+	expect( found.length > 0 && wrong.length === 0, `turns the variants of ${name}.jpg the way its EXIF tag says`,
+		wrong.map( v => `${v.f} has red on the ${v.top}` ).join( ", " ) );
+}
+
+const portraits = turned.filter( v => v.f.startsWith( "portrait--" ) );
+const named = v => Number( v.f.match( /--(\d+)w-/ )[1] );
+const misshapen = portraits.filter( v => v.width !== named( v ) || v.height <= v.width );
+
+expect( portraits.some( v => named( v ) === 1200 ) && !portraits.some( v => named( v ) > 1200 ),
+	"measures a turned photo by the width it is shown at, not the width it is stored at",
+	`found ${[ ...new Set( portraits.map( named ) ) ].sort( ( a, b ) => a - b ).join( ", " )}` );
+expect( portraits.length > 0 && misshapen.length === 0, "writes a turned photo's variants upright, at the width they are named for",
+	misshapen.map( v => `${v.f} is ${v.width} × ${v.height}` ).join( ", " ) );
+
 // ── published media that is not an image ─────────────────────────────────────
 
 console.log( "\nmedia that is not an image" );