From ed3b09963fe75a8eb55e0be926c598202d668ec7 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 08:48:22 +0100 Subject: [PATCH 1/6] move element-internals-polyfill to app element --- src/Umbraco.Web.UI.Client/src/app.ts | 1 + src/Umbraco.Web.UI.Client/src/index.ts | 2 -- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/app.ts b/src/Umbraco.Web.UI.Client/src/app.ts index a01f109232..1b27d65c39 100644 --- a/src/Umbraco.Web.UI.Client/src/app.ts +++ b/src/Umbraco.Web.UI.Client/src/app.ts @@ -4,6 +4,7 @@ import '@umbraco-ui/uui-modal-container'; import '@umbraco-ui/uui-modal-dialog'; import '@umbraco-ui/uui-modal-sidebar'; import 'router-slot'; +import 'element-internals-polyfill'; // TODO: remove these imports when they are part of UUI import type { Guard, IRoute } from 'router-slot/model'; diff --git a/src/Umbraco.Web.UI.Client/src/index.ts b/src/Umbraco.Web.UI.Client/src/index.ts index 2e5dad9fa4..351d0bb2cb 100644 --- a/src/Umbraco.Web.UI.Client/src/index.ts +++ b/src/Umbraco.Web.UI.Client/src/index.ts @@ -1,5 +1,3 @@ -import 'element-internals-polyfill'; - import { startMockServiceWorker } from './core/mocks/browser'; if (import.meta.env.VITE_UMBRACO_USE_MSW === 'on') { From d2bab01f0d975a3136f52bac76c9f8df10a76dc2 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 08:49:12 +0100 Subject: [PATCH 2/6] mark package as a module --- src/Umbraco.Web.UI.Client/package.json | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json index 0ad7532aa4..08fb8bdf30 100644 --- a/src/Umbraco.Web.UI.Client/package.json +++ b/src/Umbraco.Web.UI.Client/package.json @@ -3,6 +3,16 @@ "license": "MIT", "private": true, "version": "0.0.0", + "type": "module", + "main": "dist/main.js", + "exports": { + ".": "./dist/main.js" + }, + "types": "types/src/app.d.ts", + "files": [ + "dist", + "types" + ], "repository": { "url": "https://github.com/umbraco/Umbraco.CMS.Backoffice", "type": "git" From 585d7071645b54d9058fb71a2c3819aed0b77023 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 08:49:35 +0100 Subject: [PATCH 3/6] set target to esnext --- src/Umbraco.Web.UI.Client/tsconfig.json | 83 +++++++++++-------------- 1 file changed, 38 insertions(+), 45 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/tsconfig.json b/src/Umbraco.Web.UI.Client/tsconfig.json index 26285c6e00..82404b3db5 100644 --- a/src/Umbraco.Web.UI.Client/tsconfig.json +++ b/src/Umbraco.Web.UI.Client/tsconfig.json @@ -1,47 +1,40 @@ { - "compilerOptions": { - "target": "es2017", - "module": "esnext", - "lib": [ - "es2017", - "dom", - "dom.iterable" - ], - "declaration": true, - "emitDeclarationOnly": true, - "noEmitOnError": true, - "outDir": "./types", - "strict": true, - "noImplicitReturns": true, - "noFallthroughCasesInSwitch": true, - "moduleResolution": "node", - "isolatedModules": true, - "allowSyntheticDefaultImports": true, - "experimentalDecorators": true, - "forceConsistentCasingInFileNames": true, - "useDefineForClassFields": false, - "skipLibCheck": true, - "resolveJsonModule": true, - "baseUrl": ".", - "paths": { - "@umbraco-cms/models": ["src/core/models"], - "@umbraco-cms/backend-api": ["src/core/backend-api"], - "@umbraco-cms/context-api": ["src/core/context-api"], - "@umbraco-cms/extensions-api": ["src/core/extensions-api"], - "@umbraco-cms/extensions-registry": ["src/core/extensions-registry"], - "@umbraco-cms/observable-api": ["src/core/observable-api"], - "@umbraco-cms/utils": ["src/core/utils"], - "@umbraco-cms/test-utils": ["src/core/test-utils"], - "@umbraco-cms/services": ["src/core/services"] - }, - }, - "include": [ - "src/**/*.ts", - "e2e/**/*.ts", - ], - "references": [ - { - "path": "./tsconfig.node.json" - } - ] + "compilerOptions": { + "module": "esnext", + "target": "esnext", + "lib": ["es2020", "dom", "dom.iterable"], + "declaration": true, + "emitDeclarationOnly": true, + "noEmitOnError": true, + "outDir": "./types", + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + "moduleResolution": "node", + "isolatedModules": true, + "allowSyntheticDefaultImports": true, + "experimentalDecorators": true, + "forceConsistentCasingInFileNames": true, + "useDefineForClassFields": false, + "skipLibCheck": true, + "resolveJsonModule": true, + "baseUrl": ".", + "paths": { + "@umbraco-cms/models": ["src/core/models"], + "@umbraco-cms/backend-api": ["src/core/backend-api"], + "@umbraco-cms/context-api": ["src/core/context-api"], + "@umbraco-cms/extensions-api": ["src/core/extensions-api"], + "@umbraco-cms/extensions-registry": ["src/core/extensions-registry"], + "@umbraco-cms/observable-api": ["src/core/observable-api"], + "@umbraco-cms/utils": ["src/core/utils"], + "@umbraco-cms/test-utils": ["src/core/test-utils"], + "@umbraco-cms/services": ["src/core/services"] + } + }, + "include": ["src/**/*.ts", "e2e/**/*.ts"], + "references": [ + { + "path": "./tsconfig.node.json" + } + ] } From f17291778c6563c96d9a3cbd4284b3bd3b707b18 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 08:49:48 +0100 Subject: [PATCH 4/6] update tsconfig.node based on newest vite config --- src/Umbraco.Web.UI.Client/tsconfig.node.json | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/tsconfig.node.json b/src/Umbraco.Web.UI.Client/tsconfig.node.json index e993792cb1..b8b8971494 100644 --- a/src/Umbraco.Web.UI.Client/tsconfig.node.json +++ b/src/Umbraco.Web.UI.Client/tsconfig.node.json @@ -1,8 +1,9 @@ { - "compilerOptions": { - "composite": true, - "module": "esnext", - "moduleResolution": "node" - }, - "include": ["vite.config.ts"] + "compilerOptions": { + "composite": true, + "module": "esnext", + "moduleResolution": "node", + "allowSyntheticDefaultImports": true + }, + "include": ["vite.config.ts"] } From 625b8f2847b8d82d228dbb81330b8220876d9e5f Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 08:59:33 +0100 Subject: [PATCH 5/6] add new vite config to build in element mode --- src/Umbraco.Web.UI.Client/package.json | 3 ++- src/Umbraco.Web.UI.Client/vite.element.config.ts | 15 +++++++++++++++ 2 files changed, 17 insertions(+), 1 deletion(-) create mode 100644 src/Umbraco.Web.UI.Client/vite.element.config.ts diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json index 08fb8bdf30..2b527b2043 100644 --- a/src/Umbraco.Web.UI.Client/package.json +++ b/src/Umbraco.Web.UI.Client/package.json @@ -28,7 +28,8 @@ "scripts": { "dev": "vite", "build": "tsc && vite build --mode staging", - "build:production": "tsc && vite build", + "build:for:static": "tsc && vite build", + "build:for:backoffice": "tsc && vite build -c vite.element.config.ts", "preview": "vite preview --open", "test": "web-test-runner --coverage", "test:watch": "web-test-runner --watch", diff --git a/src/Umbraco.Web.UI.Client/vite.element.config.ts b/src/Umbraco.Web.UI.Client/vite.element.config.ts new file mode 100644 index 0000000000..d56da56f36 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/vite.element.config.ts @@ -0,0 +1,15 @@ +import { defineConfig } from 'vite'; + +import config from './vite.config'; + +export default defineConfig({ + ...config, + build: { + lib: { + entry: 'src/app.ts', + formats: ['es'], + fileName: 'main', + }, + sourcemap: true, + }, +}); From 3f5cca3cea652e2a0fca866fb2a9962851ece6ba Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 24 Nov 2022 09:45:51 +0100 Subject: [PATCH 6/6] move e2e tests to a commonjs project as they dont work in esmodule context --- src/Umbraco.Web.UI.Client/e2e/installer.spec.ts | 2 +- src/Umbraco.Web.UI.Client/e2e/login.spec.ts | 2 +- src/Umbraco.Web.UI.Client/e2e/package.json | 4 ++++ src/Umbraco.Web.UI.Client/{ => e2e}/test.ts | 2 +- src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts | 2 +- 5 files changed, 8 insertions(+), 4 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/e2e/package.json rename src/Umbraco.Web.UI.Client/{ => e2e}/test.ts (90%) diff --git a/src/Umbraco.Web.UI.Client/e2e/installer.spec.ts b/src/Umbraco.Web.UI.Client/e2e/installer.spec.ts index 93f78bda78..80340063f2 100644 --- a/src/Umbraco.Web.UI.Client/e2e/installer.spec.ts +++ b/src/Umbraco.Web.UI.Client/e2e/installer.spec.ts @@ -1,8 +1,8 @@ import { rest } from 'msw'; -import { expect, test } from '../test'; import { umbracoPath } from '@umbraco-cms/utils'; import { ProblemDetails, RuntimeLevel, ServerStatus } from '@umbraco-cms/backend-api'; +import { expect, test } from './test'; test.describe('installer tests', () => { test.beforeEach(async ({ page, worker }) => { diff --git a/src/Umbraco.Web.UI.Client/e2e/login.spec.ts b/src/Umbraco.Web.UI.Client/e2e/login.spec.ts index 7bfff100a5..2b0598fa92 100644 --- a/src/Umbraco.Web.UI.Client/e2e/login.spec.ts +++ b/src/Umbraco.Web.UI.Client/e2e/login.spec.ts @@ -1,4 +1,4 @@ -import { expect, test } from '../test'; +import { expect, test } from './test'; test('login', async ({ page }) => { // Go to /login diff --git a/src/Umbraco.Web.UI.Client/e2e/package.json b/src/Umbraco.Web.UI.Client/e2e/package.json new file mode 100644 index 0000000000..959170ed46 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/e2e/package.json @@ -0,0 +1,4 @@ +{ + "name": "backoffice-e2e", + "type": "commonjs" +} diff --git a/src/Umbraco.Web.UI.Client/test.ts b/src/Umbraco.Web.UI.Client/e2e/test.ts similarity index 90% rename from src/Umbraco.Web.UI.Client/test.ts rename to src/Umbraco.Web.UI.Client/e2e/test.ts index 9908815d0f..ac1d6ea703 100644 --- a/src/Umbraco.Web.UI.Client/test.ts +++ b/src/Umbraco.Web.UI.Client/e2e/test.ts @@ -2,7 +2,7 @@ import { expect, test as base } from '@playwright/test'; import { createWorkerFixture } from 'playwright-msw'; import type { MockServiceWorker } from 'playwright-msw'; -import { handlers } from './src/core/mocks/e2e-handlers'; +import { handlers } from '../src/core/mocks/e2e-handlers'; const test = base.extend<{ worker: MockServiceWorker; diff --git a/src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts b/src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts index 8af19dab8c..878cb92509 100644 --- a/src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts +++ b/src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts @@ -1,7 +1,7 @@ import { rest } from 'msw'; -import { expect, test } from '../test'; import { umbracoPath } from '@umbraco-cms/utils'; import { ProblemDetails, RuntimeLevel, ServerStatus } from '@umbraco-cms/backend-api'; +import { expect, test } from './test'; test.describe('upgrader tests', () => { test.beforeEach(async ({ page, worker }) => {