src/Umbraco.Web.UI.Client/web-test-runner.config.mjs

import { esbuildPlugin } from '@web/dev-server-esbuild';
import { playwrightLauncher } from '@web/test-runner-playwright';
import { importMapsPlugin } from '@web/dev-server-import-maps';
import { createImportMap } from './devops/importmap/index.js';

const mode = process.env.MODE || 'dev';
if (!['dev', 'prod'].includes(mode)) {
	throw new Error(`MODE must be "dev" or "prod", was "${mode}"`);
}

const silencedLogs = [
	'Lit is in dev mode.',
	'Multiple versions of Lit loaded.',
	'-- Extension of alias "',
	'Error: Failed to create extension api from alias',
	'Documentation: ',
	'Found an issue? https://github.com/mswjs/msw/issues',
	'Worker script URL:',
	'Worker scope:',
];

/** @type {import('@web/dev-server').DevServerConfig} */
export default {
	rootDir: '.',
	files: ['./src/**/*.test.ts', '!**/node_modules/**'],
	nodeResolve: { exportConditions: mode === 'dev' ? ['development'] : [], preferBuiltins: false, browser: false },
	browsers: [playwrightLauncher({ product: 'chromium' })],
	/* TODO: fix coverage report
	coverageConfig: {
		reporters: ['lcovonly', 'text-summary'],
	},
	*/
	plugins: [
		importMapsPlugin({
			inject: {
				importMap: createImportMap({
					rootDir: './src',
					additionalImports: {
						'@umbraco-cms/internal/test-utils': './utils/test-utils.ts',
					},
					replaceModuleExtensions: true,
				}),
			},
		}),
		esbuildPlugin({ ts: true, tsconfig: './tsconfig.json', target: 'auto', json: true }),
	],
	filterBrowserLogs(log) {
		for (const arg of log.args) {
			if (typeof arg === 'string' && silencedLogs.some((l) => arg.includes(l))) {
				return false;
			}
		}
		return true;
	},
	testRunnerHtml: (testFramework, devMode) =>
		`<html lang="en-us">
			<head>
				<meta charset="UTF-8" />
				<meta name="viewport" content="width=device-width, initial-scale=1.0" />
				<link rel="icon" type="image/svg+xml" href="src/assets/favicon.svg" />
				<title>Umbraco</title>
				<base href="/" />
				<script>
					window.__UMBRACO_TEST_RUN_A11Y_TEST = ${(!devMode).toString()};
				</script>
				<script src="/node_modules/msw/lib/iife/index.js"></script>
				<script type="module" src="/web-test-runner.index.ts"></script>
				<link rel="stylesheet" href="node_modules/@umbraco-ui/uui-css/dist/uui-css.css">
				<link rel="stylesheet" href="src/css/umb-css.css">
				<script type="module">
					import '@umbraco-cms/backoffice/components';
				</script>
			</head>
      <body>
        <script type="module" src="${testFramework}"></script>
        <script type="module">
					import 'element-internals-polyfill';
					import '@umbraco-ui/uui';
        </script>
      </body>
    </html>`,
};
added packages and basic setup 2022-05-24 16:14:15 +02:00			`import { esbuildPlugin } from '@web/dev-server-esbuild';`
			`import { playwrightLauncher } from '@web/test-runner-playwright';`
set up import maps aliases in tests 2022-10-18 14:03:42 +02:00			`import { importMapsPlugin } from '@web/dev-server-import-maps';`
use create function in web test runner 2024-02-10 23:05:05 +01:00			`import { createImportMap } from './devops/importmap/index.js';`
add rollup/commonjs plugin to web-test-runner to treat externals the same as we do on the production build (this helps with tinymce) 2023-11-08 12:03:50 +01:00
cleanup after vite hacks in wtr and remove deprecated packages 2023-08-02 16:54:48 +02:00			`const mode = process.env.MODE \|\| 'dev';`
			`if (!['dev', 'prod'].includes(mode)) {`
			throw new Error(`MODE must be "dev" or "prod", was "${mode}"`);
			`}`
add logic to handle image imports in web-test-runner 2023-02-10 09:33:32 +01:00
Chore: Enable MSW in web/test-runner + add tests for state manager + isCurrentUser util (#17584) * add tests for UmbEntityWorkspaceDataManager * add tests for umbObjectToPropertyValueArray * remove unused * split into individual files * get from window * fix import * setup msw * temp removal of different mock states * add service worker * add tests for isCurrentUser util * Update package.json * silence more text logs * fix race condition --------- Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Co-authored-by: Niels Lyngsø <niels.lyngso@gmail.com> Co-authored-by: Niels Lyngsø <nsl@umbraco.dk> 2024-11-29 13:21:00 +01:00			`const silencedLogs = [`
			`'Lit is in dev mode.',`
			`'Multiple versions of Lit loaded.',`
			`'-- Extension of alias "',`
			`'Error: Failed to create extension api from alias',`
			`'Documentation: ',`
			`'Found an issue? https://github.com/mswjs/msw/issues',`
			`'Worker script URL:',`
			`'Worker scope:',`
			`];`
fix test runner log filter 2024-07-03 11:57:13 +02:00
add logic to handle image imports in web-test-runner 2023-02-10 09:33:32 +01:00			`/** @type {import('@web/dev-server').DevServerConfig} */`
added packages and basic setup 2022-05-24 16:14:15 +02:00			`export default {`
cleanup after vite hacks in wtr and remove deprecated packages 2023-08-02 16:54:48 +02:00			`rootDir: '.',`
V16: Retry requests after timeout (#19495) * feat: fix a small-ish nitpick where extensions would reload after login this could potentially try to re-register all private extensions after each auth signal, which is being prevented anyway because of duplicate aliases, but still nice to remove and not have to listen to * feat: align login UI extension load with backoffice, i.e. wait for external load before registering core extensions * build(deps): bump @hey-api to newest and re-generate client * chore: adds extra error logging * feat: adds retry logic to the api interceptor * feat: warn about incomplete actions * fix: the body was already plain text, but we need to ensure the headers say so as well * feat: warns the user when actions could not be completed * build(deps): update @hey-api/client-fetch * chore: generate new api * feat: simplify error handling to just UmbApiError and UmbCancelError * feat: moves error notifications from interceptors into tryExecute, so you more easily can opt out of it and everything is gathered in one place * feat: recreate responses with correct 'status' and 'statusText' * build: stop dotnet processes after debug session * feat: extrapolate common logic into helper method to create responses * feat: returns a UmbProblemDetails like object on interceptors to be handled by tryExecute * chore: deprecates duplicate, outdated UmbProblemDetails interface and type guard * feat: uses the 'title' of the problem details object to convey the main message * chore: 401 and 403 uses their own interceptors * feat: show no notification if 401 * feat: uses the real request method and url (instead of the template placeholders) to tell the user what did not succeed * feat: retry requests with no timeout/race * feat: throttle and delay signals and disallow them from being updated from the outside * chore: adds more logging to timeouts * chore: optimise imports * test: ignores any test files left in node_modules folder * feat: uses auditTime to wait a bit before showing the timeout screen * feat: adds 404 handling to error interceptor * chore: cleans up after response modification * feat: preserve only a few headers this mimicks the v15 behavior * feat: lets the UI handle 404 errors instead of notifying directly * test: uses create action menu option instead to find the correct locator, and skips a seemingly unnecessary timeout 2025-06-12 13:24:11 +02:00			`files: ['./src/*/.test.ts', '!/node_modules/'],`
fix: instruct web-test-runner NOT to use the browser field in modules, since it messes with packages that also export an esm version 2024-05-22 11:56:19 +02:00			`nodeResolve: { exportConditions: mode === 'dev' ? ['development'] : [], preferBuiltins: false, browser: false },`
Feature: Clipboard (#17820) * wip clipboard context + tests * clean up property action module + register copy action * split manifests * add clipboard module * import type * export type * mark all methods async * scaffold copy + paste property actions * scaffold workspace, collection, repo + data sources * remove references to language * register detail manifests * call repo when creating * load clipboard collection data * remove debugger * register clipboard item picker modal * return value from picker * accept native error * clean up data source * add tests for error states * make clipboard local storage manager * add clip entry entity type * create unique in scaffold * add clipboard entry item data * align naming * move around * name alignment * fix imports * fix missing entityType * clean up * use picker input context * remove unused context * Update clipboard.context.ts * map to item model * poc paste property action * register copy/paste as kinds * lint fix * add tests * rename test * add repository tests * register delete clipboard action + enable action dropdown outside of context menu * remove notifcation * export entity type * temp use repo instead of context * delete unused copy property action * make data source non breaking * Update vite.config.ts * add icons for clipboard copy, paste + entry * remove unused * return if there is no property value * add kind interfaces * pass entry type for copy and paste * register clipboard for block list * implement filter on entry type * delete unused context * remove references * rename data to value and don't force an array * make icons and single value * allow to add create and update dates for clipboard entries * use clipboard icon * add create and update dates * export constants * don't set as an array * reload picker content * add copy to clipboard button to block list entry * make picker element * allow to pick multiple * remove generic block list clipboard actions * Revert "remove generic block list clipboard actions" This reverts commit 6ea65a02ce6315a781b80d0ccf0da288df602a7d. * add get methods * wip construct block clipboard entry value * add method to get exposes + add jsdocs * add expose * remove todo + add jsdocs * move clipboard out of core package * add package files * load package again * render entry icon * render correct icon * remove clipboard from core vite.config * Update package-lock.json * wip copy/paste resolvers * allow multiple accepted entry types * move logic to resolvers * transforming clipboard block value to fit block list * wip copy/paste resolvers * clean up * remove unused * fix missing exports * fix tests * return clipboard entry unique from modal * Update block-list-entries.context.ts * clipboard feature: clipboard property value cloner (#17824) * restructure of property package * content data merge controller tests * deprecate meta from propertyValueResolver * temp work * temp * poc * rename to cloner * stached block value cloner work * block list implementation * correct property value implementation * RTE Block Property Value Cloner * Block Grid Value Cloner * update with comments * try out cloner * wip translators * Revert "delete unused context" This reverts commit ec31ae55aaa9e958b64c44019398e9af7cd61df4. * move translator + cloner logic to context * clean up * implement read from clipboard in block list property editor * remove debugger * values array * handle paste * Update types.ts * move files * Update clipboard-local-storage.manager.ts * set both create and update date when creating a clipboard entry * align naming * handle paste * clean up + wip block grid translators * updates types * add grid block copy translator * only allow paste translator to handle a single value * align copy and paste translators * remove debugger * move to folders * add block const * rename * add tests * Update index.ts * use correct type * add tests for UmbBlockListToBlockClipboardCopyTranslator * fix tests * add translator tests * add tests * organize * organize * clean up translator tests * align naming * remove unused button * only render copy property action if property has a value * use constants * copy single grid block * get block grid property value from clipboard entry * add clear method to extension registry + add js docs * Update index.ts * add tests for copy value resolver * add icon for clipboard * use clipboard icon in modal * add tests * remove unused setting * fix log * only create array once * filter for supported paste translators * use write method instead of duplicating the code * add condition config type * use config type * Update manifests.ts * add support for multi picker * move multiple look up logic to context * add js docs * add js docs * remove unused * remove unused * remove unused * implement paste translator filtering for block catalogue modal * temp color translator * adding a UmbPropertyValueDataPotentiallyWithEditorAlias * simplify observer * append user unique to local storage key * remove temp color picker clipboard implementations * more explicit extension type name * more renaming * type specifications * fix test and missing type * more types for test * renaming of paste translators * rename folder * rename value resolvers * correct variable name * wip tests for clipboard context * clean up tests correctly * add more tests for clipboard context * Update clipboard.context.test.ts * use after each for clean up * fix test that times out * correct name * optimize * remove webkit * newest first when picking * use fingerprint local storage key to obfuscate user id * rename method * use const * set content max length * return object including the selection uniques * show confirm dialog before pasting value * only show confirm dialog if there is a value * Feature: clipboard block insert (#17935) * insert methods * fix originData * move logic to base class * progress on Grid and RTE * correct for Block Grid paste implementation * update async across * remove expose from block clipboard entry model * remove expose from grid block clipboard entry * remove todo * wip move value expand responsibility * wip split clipboard context * experiment with an extendable property context * create propertyContexts + proxy events * rename methods * move proxy to context + update grid copy logic * split tests * remove unused * add property context extension type * fix tests * fix tests * reorganize * Update clipboard.property-context.ts * use context * register property context clipboard kind * register for block grid * remove redundant code * rename to replace * Revert "rename to replace" This reverts commit eb0535edcfaa9f68d0fc4c431c93739a43c7b29c. * rename prop * rename label * improve block clean-up abilities * Update rte-base.element.ts * make local get of clipboard context * add asyncFilter option to the type * add is compatible method to the interface * support asyncFilter in picker * add compatability check for block list * more explicit name * wip implementation of filter * add compatability checks * add temp types * add clipboard filtering for grid and list * lint corrections --------- Co-authored-by: Niels Lyngsø <nsl@umbraco.dk> Co-authored-by: Niels Lyngsø <niels.lyngso@gmail.com> 2025-01-16 15:50:09 +01:00			`browsers: [playwrightLauncher({ product: 'chromium' })],`
Update web-test-runner.config.mjs 2024-07-04 13:28:37 +02:00			`/* TODO: fix coverage report`
sort config of test runner 2023-12-08 12:36:46 +01:00			`coverageConfig: {`
			`reporters: ['lcovonly', 'text-summary'],`
			`},`
Update web-test-runner.config.mjs 2024-07-04 13:28:37 +02:00			`*/`
set up import maps aliases in tests 2022-10-18 14:03:42 +02:00			`plugins: [`
			`importMapsPlugin({`
			`inject: {`
use create function in web test runner 2024-02-10 23:05:05 +01:00			`importMap: createImportMap({`
reuse import util for both tsconfig and test runner 2024-02-11 22:16:03 +01:00			`rootDir: './src',`
			`additionalImports: {`
add import alias's 2023-04-12 17:05:14 +02:00			`'@umbraco-cms/internal/test-utils': './utils/test-utils.ts',`
set up import maps aliases in tests 2022-10-18 14:03:42 +02:00			`},`
generate an umbraco-package.json file containing the general importmap of the backoffice 2024-02-13 11:57:03 +01:00			`replaceModuleExtensions: true,`
use create function in web test runner 2024-02-10 23:05:05 +01:00			`}),`
set up import maps aliases in tests 2022-10-18 14:03:42 +02:00			`},`
			`}),`
revamp web/test-runner config so that commonjs() is being run before esbuild but only on the modules that are actually only exported as CJS 2024-04-09 17:16:52 +02:00			`esbuildPlugin({ ts: true, tsconfig: './tsconfig.json', target: 'auto', json: true }),`
set up import maps aliases in tests 2022-10-18 14:03:42 +02:00			`],`
fix test runner log filter 2024-07-03 11:57:13 +02:00			`filterBrowserLogs(log) {`
			`for (const arg of log.args) {`
			`if (typeof arg === 'string' && silencedLogs.some((l) => arg.includes(l))) {`
			`return false;`
			`}`
			`}`
			`return true;`
			`},`
dev mode for testing 2023-12-07 13:23:33 +01:00			`testRunnerHtml: (testFramework, devMode) =>`
replace localization context with localize controller 2023-07-31 17:27:49 +02:00			`<html lang="en-us">
add css to test environment 2022-08-10 12:03:01 +02:00			`<head>`
import uui-css directly in app.ts, preview.js and web-test-runner.mjs to avoid 404 on the web-test-runner 2023-01-18 11:19:51 +01:00			`<meta charset="UTF-8" />`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0" />`
update import map in test runner 2023-05-25 10:55:09 +02:00			`<link rel="icon" type="image/svg+xml" href="src/assets/favicon.svg" />`
import uui-css directly in app.ts, preview.js and web-test-runner.mjs to avoid 404 on the web-test-runner 2023-01-18 11:19:51 +01:00			`<title>Umbraco</title>`
			`<base href="/" />`
dev mode for testing 2023-12-07 13:23:33 +01:00			`<script>`
tests 2023-12-07 14:03:13 +01:00			`window.__UMBRACO_TEST_RUN_A11Y_TEST = ${(!devMode).toString()};`
dev mode for testing 2023-12-07 13:23:33 +01:00			`</script>`
load msw in test runner and allow requests to the management api 2023-05-15 11:49:17 +02:00			`<script src="/node_modules/msw/lib/iife/index.js"></script>`
Chore: Enable MSW in web/test-runner + add tests for state manager + isCurrentUser util (#17584) * add tests for UmbEntityWorkspaceDataManager * add tests for umbObjectToPropertyValueArray * remove unused * split into individual files * get from window * fix import * setup msw * temp removal of different mock states * add service worker * add tests for isCurrentUser util * Update package.json * silence more text logs * fix race condition --------- Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Co-authored-by: Niels Lyngsø <niels.lyngso@gmail.com> Co-authored-by: Niels Lyngsø <nsl@umbraco.dk> 2024-11-29 13:21:00 +01:00			`<script type="module" src="/web-test-runner.index.ts"></script>`
import uui-css directly in app.ts, preview.js and web-test-runner.mjs to avoid 404 on the web-test-runner 2023-01-18 11:19:51 +01:00			`<link rel="stylesheet" href="node_modules/@umbraco-ui/uui-css/dist/uui-css.css">`
update import map in test runner 2023-05-25 10:55:09 +02:00			`<link rel="stylesheet" href="src/css/umb-css.css">`
load global components in tests 2024-05-29 20:07:33 +02:00			`<script type="module">`
			`import '@umbraco-cms/backoffice/components';`
			`</script>`
add css to test environment 2022-08-10 12:03:01 +02:00			`</head>`
added packages and basic setup 2022-05-24 16:14:15 +02:00			`<body>`
			`<script type="module" src="${testFramework}"></script>`
add import for @umbraco-ui/uui and router-slot to test runner config to correctly register implicit uui components 2022-08-09 15:38:53 +02:00			`<script type="module">`
			`import 'element-internals-polyfill';`
			`import '@umbraco-ui/uui';`
added polyfills 2022-05-25 13:11:54 +02:00			`</script>`
added packages and basic setup 2022-05-24 16:14:15 +02:00			`</body>`
			</html>`,
			`};`