@ckeditor/ckeditor5-dev-manual-server 59.0.0 → 60.0.0

package/README.md

@@ -8,6 +8,21 @@ Used to extend Vite to create a manual test server for CKEditor 5.
 
 More information about development tools packages can be found at the following URL: <https://github.com/ckeditor/ckeditor5-dev>.
 
+## Loading translations
+
+Pass a language code to `manualTestsPlugin()` to load and combine that language's TypeScript translation files from the configured
+package paths. The selected language becomes the default UI and content language for editors and contexts created by manual tests.
+An explicit language in an editor or context configuration still takes precedence.
+
+```ts
+manualTestsPlugin( {
+	paths: [ 'packages/*' ],
+	language: process.env.CK_LANGUAGE || 'en'
+} )
+```
+
+For example, start the manual test server in Polish using `CK_LANGUAGE=pl pnpm manual`.
+
 ## Changelog
 
 See the [`CHANGELOG.md`](https://github.com/ckeditor/ckeditor5-dev/blob/master/packages/ckeditor5-dev-manual-server/CHANGELOG.md) file.

package/dist/index.js

@@ -88,6 +88,47 @@ function toManualPageEntry(relativeFilePath, workspaceRoot) {
 	};
 }
 //#endregion
+//#region src/manual-test-plugin/translations.ts
+/**
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md.
+*/
+const MANUAL_TRANSLATIONS_VIRTUAL_ID = "virtual:ckeditor5-manual-translations";
+const RESOLVED_MANUAL_TRANSLATIONS_VIRTUAL_ID = `\0${MANUAL_TRANSLATIONS_VIRTUAL_ID}`;
+/**
+* Generates the virtual module that loads translations from every configured package root.
+*/
+function createManualTranslationsModule(paths, language) {
+	const translationPatterns = paths.map((packagePath) => {
+		return posix.join("/", toPosixPath(packagePath), `lang/translations/${language}.ts`);
+	});
+	return `
+import { add } from '@ckeditor/ckeditor5-utils';
+import { Context, Editor } from '@ckeditor/ckeditor5-core';
+
+const translationModules = import.meta.glob(
+	${JSON.stringify(translationPatterns)},
+	{ eager: true, import: 'default' }
+);
+const language = ${JSON.stringify(language)};
+const translations = Object.values( translationModules ).map( module => module[ language ] );
+
+if ( !translations.length ) {
+	throw new Error( \`No CKEditor 5 translations found for "\${ language }".\` );
+}
+
+if ( !translations.some( translation => translation.getPluralForm ) ) {
+	throw new Error( \`The ckeditor5-core translations for "\${ language }" were not loaded.\` );
+}
+
+for ( const translation of translations ) {
+	add( language, translation.dictionary, translation.getPluralForm );
+}
+
+Editor.defaultConfig = { ...Editor.defaultConfig, language: ${JSON.stringify(language)} };
+Context.defaultConfig = { ...Context.defaultConfig, language: ${JSON.stringify(language)} };`;
+}
+//#endregion
 //#region src/manual-test-plugin/plugin.ts
 /**
 * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
@@ -137,33 +178,35 @@ function manualTestsPlugin(options) {
 		slug: entry.slug
 	}));
 	const getManualEntriesJson = () => JSON.stringify(getClientEntries(), null, 2);
+	const translationsModuleCode = options.language ? createManualTranslationsModule(options.paths, options.language) : null;
 	return {
 		name: "ckeditor5-manual-tests",
-		config() {
-			return { build: { rolldownOptions: { input: getManualBuildInputs() } } };
+		config(config = {}) {
+			workspaceRoot = resolve(config.root || process.cwd());
+			return { input: getManualBuildInputs() };
 		},
 		configResolved(config) {
 			workspaceRoot = config.root;
 			base = config.base || "/";
 			manualPagesCache.invalidate();
 			packageThemeEntryCache.clear();
-			config.build.rolldownOptions.input = getManualBuildInputs();
 		},
 		configureServer(server) {
 			server.middlewares.use((request, _response, next) => {
 				rewriteCatalogRequest(request, getManualCatalogPublicPath());
 				next();
 			});
-			const clientEnvironment = server.environments.client;
-			keepManualHtmlSourceFresh(clientEnvironment.bundledDev?.memoryFiles, getManualPages, workspaceRoot);
+			keepManualHtmlSourceFresh(server.environments.client.bundledDev?.memoryFiles, getManualPages, workspaceRoot);
 		},
 		resolveId(source) {
 			if (source == MANUAL_ENTRIES_VIRTUAL_ID) return resolvedVirtualModuleId;
+			if (source == "virtual:ckeditor5-manual-translations" && translationsModuleCode) return RESOLVED_MANUAL_TRANSLATIONS_VIRTUAL_ID;
 			if (isManualCatalogBuildInputSpecifier(source, getManualCatalogBuildInputFilePath(), workspaceRoot)) return getManualCatalogBuildInputFilePath();
 			return null;
 		},
 		load(id) {
 			if (id == resolvedVirtualModuleId) return `export const manualTestEntries = ${getManualEntriesJson()};`;
+			if (id == RESOLVED_MANUAL_TRANSLATIONS_VIRTUAL_ID) return translationsModuleCode;
 			if (toPosixPath(id) == toPosixPath(getManualCatalogBuildInputFilePath())) return readFileSync(MANUAL_CATALOG_FILE_PATH, "utf8");
 			return null;
 		},
@@ -174,12 +217,13 @@ function manualTestsPlugin(options) {
 				const entry = getManualPageEntryForScriptSpecifier(scriptSpecifier);
 				if (!entry) return;
 				const packageRootSpecifier = entry.htmlFilePath.slice(0, entry.htmlFilePath.indexOf(MANUAL_TESTS_DIRECTORY));
-				const themeEntries = getPackageThemeEntries(packageRootSpecifier);
-				if (!themeEntries.length) return;
+				const imports = getPackageThemeEntries(packageRootSpecifier).map((themeEntryFilePath) => {
+					return `import '${posix.relative(posix.dirname(scriptSpecifier), `${packageRootSpecifier}/${themeEntryFilePath}`)}';`;
+				});
+				if (options.language) imports.push(`import '${MANUAL_TRANSLATIONS_VIRTUAL_ID}';`);
+				if (!imports.length) return;
 				return {
-					code: `${code}\n${themeEntries.map((themeEntryFilePath) => {
-						return `import '${posix.relative(posix.dirname(scriptSpecifier), `${packageRootSpecifier}/${themeEntryFilePath}`)}';`;
-					}).join("\n")}\n`,
+					code: `${code}\n${imports.join("\n")}\n`,
 					map: null
 				};
 			}
@@ -207,7 +251,7 @@ function manualTestsPlugin(options) {
 * produced by the rolldown dev engine. That engine emits the HTML output only during the initial
 * build and never regenerates it when the source `.html` changes: its bundle state reports no
 * stale output for HTML entries, `devEngine.invalidate()` throws on a non-JS module, and even a
-* forced full build leaves the HTML memory file untouched (verified against Vite 8.1.0). A `.html`
+* forced full build leaves the HTML memory file untouched (verified against Vite 8.2.1). A `.html`
 * edit still triggers a full page reload, so without this the browser reloads into the same stale
 * HTML until the server is restarted.
 *
@@ -368,39 +412,40 @@ function getDebugFlags(debugOption = "") {
 * For licensing, see LICENSE.md.
 */
 const MANUAL_REFRESH_EVENT_NAME = "ckeditor5-manual:refresh-available";
-const isManualRefreshWrappedClient = Symbol("isManualRefreshWrappedClient");
+const wrappedClients = /* @__PURE__ */ new WeakSet();
 function refreshPlugin() {
 	return {
 		name: "ckeditor5-manual-refresh",
 		apply: "serve",
 		configureServer(server) {
-			const bundledDev = server.environments.client.bundledDev;
-			if (!bundledDev) return;
-			wrapBundledDevClientSend(bundledDev.clients);
+			const { bundledDev } = server.environments.client;
+			wrapBundledDevClientSend(bundledDev);
 			wrapBundledDevFullReloads(bundledDev, server.config.root);
+		},
+		hotUpdate({ file, modules }) {
+			if (file.endsWith(".manual.html")) return modules;
 		}
 	};
 }
-function wrapBundledDevClientSend(clients) {
-	if (!clients || typeof clients.setupIfNeeded != "function") return;
+function wrapBundledDevClientSend(bundledDev) {
+	const clients = bundledDev.clients;
 	const setupIfNeeded = clients.setupIfNeeded.bind(clients);
 	clients.setupIfNeeded = (client, clientId) => {
-		if (!client[isManualRefreshWrappedClient]) {
+		if (!wrappedClients.has(client)) {
 			const send = client.send.bind(client);
 			client.send = (payload) => {
-				sendManualRefreshPayload(payload, send);
+				sendManualRefreshPayload(bundledDev, payload, send);
 			};
-			client[isManualRefreshWrappedClient] = true;
+			wrappedClients.add(client);
 		}
 		return setupIfNeeded(client, clientId);
 	};
 }
 function wrapBundledDevFullReloads(bundledDev, workspaceRoot) {
-	if (typeof bundledDev.handleHmrOutput != "function") return;
 	const handleHmrOutput = bundledDev.handleHmrOutput.bind(bundledDev);
-	bundledDev.handleHmrOutput = (client, files, hmrOutput, invalidateInformation) => {
-		if (hmrOutput.type != "FullReload") return handleHmrOutput(client, files, hmrOutput, invalidateInformation);
-		if (!shouldShowManualRefreshPromptForFiles(files)) {
+	bundledDev.handleHmrOutput = (client, files, hmrOutput) => {
+		if (hmrOutput.type != "FullReload") return handleHmrOutput(client, files, hmrOutput);
+		if (!shouldShowManualRefreshPrompt(files)) {
 			reloadClientAfterLatestBuildOutput(bundledDev, client, files, workspaceRoot);
 			return;
 		}
@@ -413,25 +458,26 @@ function wrapBundledDevFullReloads(bundledDev, workspaceRoot) {
 }
 async function reloadClientAfterLatestBuildOutput(bundledDev, client, files, workspaceRoot) {
 	try {
-		await bundledDev.devEngine?.ensureLatestBuildOutput();
+		await bundledDev.devEngine.ensureLatestBuildOutput();
 	} catch {}
+	const htmlFile = files.find((file) => isHtmlFile(file));
 	client.send({
 		type: "full-reload",
-		path: getChangedHtmlPublicPath(files, workspaceRoot)
+		path: htmlFile ? toPublicFilePath(htmlFile, workspaceRoot) : void 0
 	});
 }
-function getChangedHtmlPublicPath(files, workspaceRoot) {
-	const htmlFile = files.find((file) => file.endsWith(".html"));
-	return htmlFile ? toPublicFilePath(htmlFile, workspaceRoot) : void 0;
-}
 function ensureLatestBuildOutput(bundledDev) {
 	try {
-		bundledDev.devEngine?.ensureLatestBuildOutput().catch(() => {});
+		bundledDev.devEngine.ensureLatestBuildOutput().catch(() => {});
 	} catch {}
 }
-function sendManualRefreshPayload(payload, send) {
-	if (payload.type == "update" && !payload.updates.length) return;
-	if (shouldShowManualRefreshPrompt(payload)) {
+function sendManualRefreshPayload(bundledDev, payload, send) {
+	if (payload.type == "bundled-dev-update" && shouldShowManualRefreshPrompt(payload.changedIds)) {
+		ensureLatestBuildOutput(bundledDev);
+		send({
+			...payload,
+			changedIds: []
+		});
 		send({
 			type: "custom",
 			event: MANUAL_REFRESH_EVENT_NAME
@@ -440,17 +486,14 @@ function sendManualRefreshPayload(payload, send) {
 	}
 	send(payload);
 }
-function shouldShowManualRefreshPrompt(payload) {
-	if (payload.type == "update") return !isCssUpdatePayload(payload);
-	return false;
+function shouldShowManualRefreshPrompt(filePaths) {
+	return filePaths.some((filePath) => !isCssFile(filePath) && !isHtmlFile(filePath));
 }
-function isCssUpdatePayload(payload) {
-	return payload.type == "update" && payload.updates.length > 0 && payload.updates.every((update) => {
-		return update.type == "css-update" || update.type == "js-update" && update.acceptedPath.endsWith(".css");
-	});
+function isCssFile(filePath) {
+	return filePath.split("?", 1)[0].endsWith(".css");
 }
-function shouldShowManualRefreshPromptForFiles(files) {
-	return files.some((file) => !file.endsWith(".css") && !file.endsWith(".html"));
+function isHtmlFile(filePath) {
+	return filePath.split("?", 1)[0].endsWith(".html");
 }
 //#endregion
 //#region src/svg-plugin/plugin.ts

package/dist/manual-test-plugin/plugin.d.ts

@@ -6,5 +6,6 @@ import type { Plugin } from "vite";
 export interface ManualTestsPluginOptions {
 	paths: Array<string>;
 	include?: Array<string>;
+	language?: string;
 }
 export declare function manualTestsPlugin(options: ManualTestsPluginOptions): Plugin;

package/dist/manual-test-plugin/translations.d.ts

@@ -0,0 +1,10 @@
+/**
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md.
+*/
+export declare const MANUAL_TRANSLATIONS_VIRTUAL_ID: string;
+export declare const RESOLVED_MANUAL_TRANSLATIONS_VIRTUAL_ID: string;
+/**
+* Generates the virtual module that loads translations from every configured package root.
+*/
+export declare function createManualTranslationsModule(paths: Array<string>, language: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-dev-manual-server",
-  "version": "59.0.0",
+  "version": "60.0.0",
   "description": "Used to extend Vite to create a manual test server for CKEditor 5.",
   "keywords": [],
   "author": "CKSource (http://cksource.com/)",
@@ -25,6 +25,6 @@
   ],
   "dependencies": {
     "@ckeditor/ckeditor5-inspector": "^5.0.1",
-    "vite": "^8.1.0"
+    "vite": "^8.2.1"
   }
 }

package/theme/catalog.css

@@ -143,10 +143,6 @@ a {
 	color: var(--text-muted);
 }
 
-.app__search:has(.app__search-input:placeholder-shown) .app__search-clear {
-	visibility: hidden;
-}
-
 .app__search-clear {
 	margin-inline-end: 10px;
 	padding: 6px;
@@ -162,6 +158,10 @@ a {
 	background: var(--surface-hover);
 }
 
+.app__search:has(.app__search-input:placeholder-shown) .app__search-clear {
+	visibility: hidden;
+}
+
 /* Catalog content. */
 .app__list {
 	display: grid;