eleventy-plugin-vento 2.4.0 → 2.6.0

package/VentoPlugin.js

@@ -82,8 +82,13 @@ export function VentoPlugin(eleventyConfig, options = {}) {
 	// Add vto as a template format and create a custom template for it
 	eleventyConfig.addTemplateFormats('vto');
 	eleventyConfig.addExtension('vto', {
+		// Set output extension
 		outputFileExtension: 'html',
 
+		// Read vto files into eleventy
+		read: true,
+
+		// Main compile function
 		async compile(inputContent, inputPath) {
 			return async (data) => {
 				if (options.addHelpers) {
@@ -113,11 +118,16 @@ export function VentoPlugin(eleventyConfig, options = {}) {
 
 				const result = await env.runString(inputContent, data, inputPath);
 
+				if (data.page?.rawInput !== inputContent) {
+					env.cache.delete(inputPath);
+				}
+
 				return result.content;
 			};
 		},
 
 		compileOptions: {
+			// Custom permalink compilation
 			permalink(linkContents) {
 				if (typeof linkContents !== 'string') return linkContents;
 				return async (data) => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "eleventy-plugin-vento",
-	"version": "2.4.0",
+	"version": "2.6.0",
 	"description": "Adds support for the Vento templating language to Eleventy.",
 	"type": "module",
 	"packageManager": "pnpm@9.5.0",
@@ -36,7 +36,7 @@
 	},
 	"license": "MIT",
 	"dependencies": {
-		"ventojs": "0.12.8"
+		"ventojs": "0.12.9"
 	},
 	"devDependencies": {
 		"@11ty/eleventy": "3.0.0-alpha.14",
@@ -46,7 +46,7 @@
 		"eslint-config-prettier": "9.1.0",
 		"globals": "15.8.0",
 		"semantic-release": "24.0.0",
-		"vitest": "1.6.0"
+		"vitest": "2.0.2"
 	},
 	"prettier": {
 		"bracketSameLine": true,

package/tests/computed-data/__snapshots__/from-local-key.html

@@ -0,0 +1,4 @@
+
+<h1>Dynamically generated from a custom key</h1>
+
+<p>a custom key</p>

package/tests/computed-data/computed-data.test.js

@@ -0,0 +1,9 @@
+import { expect, test } from 'vitest';
+import { runBuild } from '#test-instance';
+
+const results = await runBuild(import.meta.dirname);
+
+test('renders computed data from local key', async () => {
+	const page = results.find(({ url }) => url === '/from-local-key/');
+	await expect(page.content).toMatchFileSnapshot('./__snapshots__/from-local-key.html');
+});

package/tests/computed-data/from-local-key.vto

@@ -0,0 +1,9 @@
+---
+eleventyComputed:
+  title: "Dynamically generated from {{ customKey }}"
+customKey: "a custom key"
+---
+
+<h1>{{ title }}</h1>
+
+<p>{{ customKey }}</p>

package/tests/engine-overrides/__snapshots__/as-html-engine.html

@@ -0,0 +1,4 @@
+
+<p>2 + 2 = 4</p>
+
+<p>This is a cool page</p>

package/tests/engine-overrides/__snapshots__/as-md-engine.html

@@ -0,0 +1,2 @@
+<p>2 + 2 = 4</p>
+<p>This is a cool page</p>

package/tests/engine-overrides/as-html-engine.html

@@ -0,0 +1,7 @@
+---
+title: This is a cool page
+---
+
+<p>2 + 2 = {{ 2 + 2 }}</p>
+
+<p>{{ title }}</p>

package/tests/engine-overrides/as-md-engine.md

@@ -0,0 +1,7 @@
+---
+title: This is a cool page
+---
+
+2 + 2 = {{ 2 + 2 }}
+
+{{ title }}

package/tests/engine-overrides/eleventy.config.js

@@ -0,0 +1,4 @@
+export const config = {
+	markdownTemplateEngine: 'vto',
+	htmlTemplateEngine: 'vto',
+};

package/tests/engine-overrides/engine-overrides.test.js

@@ -0,0 +1,14 @@
+import { expect, test } from 'vitest';
+import { runBuild } from '#test-instance';
+
+export const results = await runBuild(import.meta.dirname);
+
+test('renders markdown file with Vento', async () => {
+	const page = results.find(({ url }) => url === '/as-md-engine/');
+	await expect(page.content).toMatchFileSnapshot('./__snapshots__/as-md-engine.html');
+});
+
+test('renders html file with Vento', async () => {
+	const page = results.find(({ url }) => url === '/as-html-engine/');
+	await expect(page.content).toMatchFileSnapshot('./__snapshots__/as-html-engine.html');
+});

package/tests/filters/eleventy.config.js

@@ -0,0 +1,13 @@
+export default function (eleventyConfig) {
+	eleventyConfig.addFilter(
+		'uppercase',
+		/** @param {string} content */
+		(content) => content.toUpperCase()
+	);
+
+	eleventyConfig.addFilter('wrapWith', (content, tag) => `<${tag}>${content}</${tag}>`);
+
+	eleventyConfig.addFilter('pageUrlCompare', function (url) {
+		return url === this.page.url;
+	});
+}

package/tests/filters/filters.test.js

@@ -1,21 +1,7 @@
 import { expect, test } from 'vitest';
 import { runBuild } from '#test-instance';
 
-const results = await runBuild(import.meta.dirname, {
-	eleventy(configApi) {
-		configApi.addFilter(
-			'uppercase',
-			/** @param {string} content */
-			(content) => content.toUpperCase()
-		);
-
-		configApi.addFilter('wrapWith', (content, tag) => `<${tag}>${content}</${tag}>`);
-
-		configApi.addFilter('pageUrlCompare', function (url) {
-			return url === this.page.url;
-		});
-	},
-});
+const results = await runBuild(import.meta.dirname);
 
 test('transforms string with built-in method', async () => {
 	const page = results.find(({ url }) => url === '/basic/');

package/tests/get-instance.js

@@ -1,10 +1,13 @@
+import path from 'node:path';
 import { VentoPlugin } from 'eleventy-plugin-vento';
 import Eleventy from '@11ty/eleventy';
 
 /**
+ * @typedef {import('@11ty/eleventy/src/UserConfig.js').default} EleventyUserConfig
+ *
  * @typedef {object} ExtensionsOptions
  * @property {import('eleventy-plugin-vento').VentoPluginOptions} vento
- * @property {import('@11ty/eleventy/src/UserConfig.js')} eleventy
+ * @property {(configApi: EleventyUserConfig) => void} eleventy
  *
  * @typedef {{ url: string, inputPath: string, outputPath: string, rawInput: string, content: string }} PageObject
  * @typedef {PageObject[]} EleventyOutput
@@ -18,13 +21,13 @@ export async function runBuild(fromInput, extensions = {}) {
 	const instance = new Eleventy(fromInput, '_site', {
 		quiet: true,
 
-		/** @param {import('@11ty/eleventy/src/UserConfig.js').default} eleventyConfig */
+		configPath: path.join(fromInput, 'eleventy.config.js'),
+
+		/** @param {EleventyUserConfig} eleventyConfig */
 		config(eleventyConfig) {
 			eleventyConfig.addPlugin(VentoPlugin, extensions.vento || {});
 
 			eleventyConfig.ignores.add('**/__snapshots__/**');
-
-			if (extensions.eleventy) extensions.eleventy.call(this, eleventyConfig);
 		},
 	});
 

package/tests/shortcodes/eleventy.config.js

@@ -0,0 +1,4 @@
+export default function (eleventyConfig) {
+	eleventyConfig.addShortcode('helloWorld', () => 'Hello world!');
+	eleventyConfig.addShortcode('possumPosse', (number = 'the') => `Release ${number} possums!!!`);
+}

package/tests/shortcodes/shortcodes.test.js

@@ -1,12 +1,7 @@
 import { expect, test } from 'vitest';
 import { runBuild } from '#test-instance';
 
-const results = await runBuild(import.meta.dirname, {
-	eleventy(configApi) {
-		configApi.addShortcode('helloWorld', () => 'Hello world!');
-		configApi.addShortcode('possumPosse', (number = 'the') => `Release ${number} possums!!!`);
-	},
-});
+const results = await runBuild(import.meta.dirname);
 
 test('shortcode without argument', () => {
 	const page = results.find(({ url }) => url === '/basic/');