yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

start fixing

Browse Source
This commit is contained in:
Mads Rasmussen
2023-11-19 11:37:07 +01:00
committed by Jacob Overgaard
parent d65935323f
commit 1ba235cade
16 changed files with 67 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/Umbraco.Web.UI.Client/src/libs/context-api/consume/context-consumer.test.ts
View File

@@ -2,7 +2,7 @@ import { expect, oneEvent } from '@open-wc/testing';
import { UmbContextProvider } from '../provide/context-provider.js';
import { UmbContextToken } from '../token/context-token.js';
import { UmbContextConsumer } from './context-consumer.js';
import { UmbContextRequestEventImplementation, umbContextRequestEventType } from './context-request.event.js';
import { UmbContextRequestEventImplementation, UMB_ContextRequestEventType } from './context-request.event.js';
const testContextAlias = 'my-test-context';
@@ -32,13 +32,13 @@ describe('UmbContextConsumer', () => {
describe('events', () => {
it('dispatches context request event when constructed', async () => {
const listener = oneEvent(window, umbContextRequestEventType);
const listener = oneEvent(window, UMB_ContextRequestEventType);
consumer.hostConnected();
const event = (await listener) as unknown as UmbContextRequestEventImplementation;
expect(event).to.exist;
expect(event.type).to.eq(umbContextRequestEventType);
expect(event.type).to.eq(UMB_ContextRequestEventType);
expect(event.contextAlias).to.eq(testContextAlias);
consumer.hostDisconnected();
});
@@ -62,7 +62,7 @@ describe('UmbContextConsumer', () => {
localConsumer.hostDisconnected();
provider.hostDisconnected();
}
}
},
);
localConsumer.hostConnected();
});
@@ -99,7 +99,6 @@ describe('UmbContextConsumer', () => {
});
describe('UmbContextConsumer with discriminator test', () => {
type A = { prop: string };
function discriminator(instance: unknown): instance is A {
@@ -111,16 +110,17 @@ describe('UmbContextConsumer with discriminator test', () => {
}
it('discriminator determines the instance type', async () => {
const localConsumer = new UmbContextConsumer(
document.body,
new UmbContextToken(testContextAlias, discriminator),
(instance: A) => { console.log(instance)}
(instance: A) => {
console.log(instance);
},
);
localConsumer.hostConnected();
// This bit of code is not really a test but it serves as a TypeScript type test, making sure the given type is matches the one given from the Discriminator method.
type TestType = Exclude<(typeof localConsumer.instance), undefined> extends A ? true : never;
type TestType = Exclude<typeof localConsumer.instance, undefined> extends A ? true : never;
const test: TestType = true;
expect(test).to.be.true;
@@ -142,7 +142,7 @@ describe('UmbContextConsumer with discriminator test', () => {
done();
localConsumer.hostDisconnected();
provider.hostDisconnected();
}
},
);
localConsumer.hostConnected();
});
@@ -159,7 +159,7 @@ describe('UmbContextConsumer with discriminator test', () => {
new UmbContextToken(testContextAlias, badDiscriminator),
(_instance) => {
expect(_instance.prop).to.eq('this must not happen!');
}
},
);
localConsumer.hostConnected();
@@ -169,6 +169,4 @@ describe('UmbContextConsumer with discriminator test', () => {
provider.hostDisconnected();
});
});
});

15
src/Umbraco.Web.UI.Client/src/libs/context-api/consume/context-request.event.ts
View File

@@ -1,7 +1,7 @@
import { UmbContextToken } from '../token/context-token.js';
export const umbContextRequestEventType = 'umb:context-request';
export const umbDebugContextEventType = 'umb:debug-contexts';
export const UMB_ContextRequestEventType = 'umb:context-request';
export const UMB_umbDebugContextEventType = 'umb:debug-contexts';
export type UmbContextCallback<T> = (instance: T) => void;
@@ -20,17 +20,20 @@ export interface UmbContextRequestEvent<ResultType = unknown> extends Event {
* @extends {Event}
* @implements {UmbContextRequestEvent}
*/
export class UmbContextRequestEventImplementation<ResultType = unknown> extends Event implements UmbContextRequestEvent<ResultType> {
export class UmbContextRequestEventImplementation<ResultType = unknown>
extends Event
implements UmbContextRequestEvent<ResultType>
{
public constructor(
public readonly contextAlias: string | UmbContextToken<any, ResultType>,
public readonly callback: (context: ResultType) => boolean
public readonly callback: (context: ResultType) => boolean,
) {
super(umbContextRequestEventType, { bubbles: true, composed: true, cancelable: true });
super(UMB_ContextRequestEventType, { bubbles: true, composed: true, cancelable: true });
}
}
export class UmbContextDebugRequest extends Event {
public constructor(public readonly callback: any) {
super(umbDebugContextEventType, { bubbles: true, composed: true, cancelable: false });
super(UMB_umbDebugContextEventType, { bubbles: true, composed: true, cancelable: false });
}
}

7
src/Umbraco.Web.UI.Client/src/libs/context-api/provide/context-provide.event.ts
View File

@@ -1,6 +1,6 @@
import { UmbContextToken } from '../token/context-token.js';
export const umbContextProvideEventType = 'umb:context-provide';
export const UMB_ContextProvideEventType = 'umb:context-provide';
/**
* @export
@@ -44,7 +44,10 @@ export interface UmbContextUnprovidedEvent extends Event {
* @implements {UmbContextUnprovidedEvent}
*/
export class UmbContextUnprovidedEventImplementation extends Event implements UmbContextUnprovidedEvent {
public constructor(public readonly contextAlias: string | UmbContextToken, public readonly instance: unknown) {
public constructor(
public readonly contextAlias: string | UmbContextToken,
public readonly instance: unknown,
) {
super(umbContextUnprovidedEventType, { bubbles: true, composed: true });
}
}

20
src/Umbraco.Web.UI.Client/src/libs/context-api/provide/context-provider.ts
View File

@@ -1,7 +1,7 @@
import {
UmbContextRequestEvent,
umbContextRequestEventType,
umbDebugContextEventType,
UMB_ContextRequestEventType,
UMB_umbDebugContextEventType,
} from '../consume/context-request.event.js';
import { UmbContextToken } from '../token/context-token.js';
import {
@@ -35,7 +35,11 @@ export class UmbContextProvider<BaseType = unknown, ResultType extends BaseType
* @param {*} instance
* @memberof UmbContextProvider
*/
constructor(hostElement: EventTarget, contextAlias: string | UmbContextToken<BaseType, ResultType>, instance: ResultType) {
constructor(
hostElement: EventTarget,
contextAlias: string | UmbContextToken<BaseType, ResultType>,
instance: ResultType,
) {
this.hostElement = hostElement;
this._contextAlias = contextAlias.toString();
this.#instance = instance;
@@ -52,7 +56,7 @@ export class UmbContextProvider<BaseType = unknown, ResultType extends BaseType
// Since the alias matches, we will stop it from bubbling further up. But we still allow it to ask the other Contexts of the element. Hence not calling `event.stopImmediatePropagation();`
event.stopPropagation();
if(event.callback(this.#instance)) {
if (event.callback(this.#instance)) {
// Make sure the event not hits any more Contexts as we have found a match.
event.stopImmediatePropagation();
}
@@ -62,23 +66,23 @@ export class UmbContextProvider<BaseType = unknown, ResultType extends BaseType
* @memberof UmbContextProvider
*/
public hostConnected() {
this.hostElement.addEventListener(umbContextRequestEventType, this.#handleContextRequest);
this.hostElement.addEventListener(UMB_ContextRequestEventType, this.#handleContextRequest);
this.hostElement.dispatchEvent(new UmbContextProvideEventImplementation(this._contextAlias));
// Listen to our debug event 'umb:debug-contexts'
this.hostElement.addEventListener(umbDebugContextEventType, this._handleDebugContextRequest);
this.hostElement.addEventListener(UMB_umbDebugContextEventType, this._handleDebugContextRequest);
}
/**
* @memberof UmbContextProvider
*/
public hostDisconnected() {
this.hostElement.removeEventListener(umbContextRequestEventType, this.#handleContextRequest);
this.hostElement.removeEventListener(UMB_ContextRequestEventType, this.#handleContextRequest);
// Out-commented for now, but kept if we like to reintroduce this:
//window.dispatchEvent(new UmbContextUnprovidedEventImplementation(this._contextAlias, this.#instance));
// Stop listen to our debug event 'umb:debug-contexts'
this.hostElement.removeEventListener(umbDebugContextEventType, this._handleDebugContextRequest);
this.hostElement.removeEventListener(UMB_umbDebugContextEventType, this._handleDebugContextRequest);
}
private _handleDebugContextRequest = (event: any) => {

4
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/copy.handlers.ts
View File

@@ -1,10 +1,10 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const copyHandlers = [
rest.post(umbracoPath(`${slug}/:id/copy`), async (req, res, ctx) => {
rest.post(umbracoPath(`${UMB_slug}/:id/copy`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;

10
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/detail.handlers.ts
View File

@@ -1,10 +1,10 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const detailHandlers = [
rest.post(umbracoPath(`${slug}`), async (req, res, ctx) => {
rest.post(umbracoPath(`${UMB_slug}`), async (req, res, ctx) => {
const data = await req.json();
if (!data) return;
@@ -13,7 +13,7 @@ export const detailHandlers = [
return res(ctx.status(200));
}),
rest.get(umbracoPath(`${slug}/:id`), (req, res, ctx) => {
rest.get(umbracoPath(`${UMB_slug}/:id`), (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;
@@ -22,7 +22,7 @@ export const detailHandlers = [
return res(ctx.status(200), ctx.json(dataType));
}),
rest.put(umbracoPath(`${slug}/:id`), async (req, res, ctx) => {
rest.put(umbracoPath(`${UMB_slug}/:id`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;
const data = await req.json();
@@ -33,7 +33,7 @@ export const detailHandlers = [
return res(ctx.status(200), ctx.json(saved));
}),
rest.delete<string>(umbracoPath(`${slug}/:id`), async (req, res, ctx) => {
rest.delete<string>(umbracoPath(`${UMB_slug}/:id`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;

12
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/folder.handlers.ts
View File

@@ -1,11 +1,11 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
import { ProblemDetails } from '@umbraco-cms/backoffice/backend-api';
export const folderHandlers = [
rest.post(umbracoPath(`${slug}/folder`), async (req, res, ctx) => {
rest.post(umbracoPath(`${UMB_slug}/folder`), async (req, res, ctx) => {
const data = await req.json();
if (!data) return;
@@ -14,7 +14,7 @@ export const folderHandlers = [
return res(ctx.status(200));
}),
rest.get(umbracoPath(`${slug}/folder/:id`), (req, res, ctx) => {
rest.get(umbracoPath(`${UMB_slug}/folder/:id`), (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;
@@ -23,7 +23,7 @@ export const folderHandlers = [
return res(ctx.status(200), ctx.json(dataType));
}),
rest.put(umbracoPath(`${slug}/folder/:id`), async (req, res, ctx) => {
rest.put(umbracoPath(`${UMB_slug}/folder/:id`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;
const data = await req.json();
@@ -34,7 +34,7 @@ export const folderHandlers = [
return res(ctx.status(200));
}),
rest.delete(umbracoPath(`${slug}/folder/:id`), async (req, res, ctx) => {
rest.delete(umbracoPath(`${UMB_slug}/folder/:id`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;
@@ -48,7 +48,7 @@ export const folderHandlers = [
status: 404,
type: 'error',
detail: 'Not Found',
})
}),
);
}
}),

4
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/item.handlers.ts
View File

@@ -1,10 +1,10 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const itemHandlers = [
rest.get(umbracoPath(`${slug}/item`), (req, res, ctx) => {
rest.get(umbracoPath(`${UMB_slug}/item`), (req, res, ctx) => {
const ids = req.url.searchParams.getAll('id');
if (!ids) return;
const items = umbDataTypeData.getItems(ids);

4
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/move.handlers.ts
View File

@@ -1,10 +1,10 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const moveHandlers = [
rest.post(umbracoPath(`${slug}/:id/move`), async (req, res, ctx) => {
rest.post(umbracoPath(`${UMB_slug}/:id/move`), async (req, res, ctx) => {
const id = req.params.id as string;
if (!id) return;

2
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/slug.ts
View File

@@ -1 +1 @@
export const slug = '/data-type';
export const UMB_slug = '/data-type';

6
src/Umbraco.Web.UI.Client/src/mocks/handlers/data-type/tree.handlers.ts
View File

@@ -1,10 +1,10 @@
const { rest } = window.MockServiceWorker;
import { umbDataTypeData } from '../../data/data-type.data.js';
import { slug } from './slug.js';
import { UMB_slug } from './slug.js';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const treeHandlers = [
rest.get(umbracoPath(`/tree${slug}/root`), (req, res, ctx) => {
rest.get(umbracoPath(`/tree${UMB_slug}/root`), (req, res, ctx) => {
const rootItems = umbDataTypeData.getTreeRoot();
const response = {
total: rootItems.length,
@@ -13,7 +13,7 @@ export const treeHandlers = [
return res(ctx.status(200), ctx.json(response));
}),
rest.get(umbracoPath(`/tree${slug}/children`), (req, res, ctx) => {
rest.get(umbracoPath(`/tree${UMB_slug}/children`), (req, res, ctx) => {
const parentId = req.url.searchParams.get('parentId');
if (!parentId) return;

2
src/Umbraco.Web.UI.Client/src/mocks/handlers/document-type/slug.ts
View File

@@ -1 +1 @@
export const slug = '/document-type';
export const UMB_slug = '/document-type';

2
src/Umbraco.Web.UI.Client/src/mocks/handlers/document/slug.ts
View File

@@ -1 +1 @@
export const slug = '/document';
export const UMB_slug = '/document';

2
src/Umbraco.Web.UI.Client/src/mocks/handlers/user-group/slug.ts
View File

@@ -1 +1 @@
export const slug = '/user-group';
export const UMB_slug = '/user-group';

2
src/Umbraco.Web.UI.Client/src/mocks/handlers/user/slug.ts
View File

@@ -1 +1 @@
export const slug = '/user';
export const UMB_slug = '/user';

9
src/Umbraco.Web.UI.Client/src/packages/core/debug/context-debug.controller.ts
View File

@@ -1,4 +1,4 @@
import { contextData, umbDebugContextEventType } from '@umbraco-cms/backoffice/context-api';
import { contextData, UMB_umbDebugContextEventType } from '@umbraco-cms/backoffice/context-api';
import { UmbBaseController, UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
// Temp controller to get the code away from the app.element.ts
@@ -11,7 +11,10 @@ export class UmbContextDebugController extends UmbBaseController {
super.hostConnected();
// Maybe this could be part of the context-api? When we create a new root, we could attach the debugger to it?
// Listen for the debug event from the <umb-debug> component
this.getHostElement().addEventListener(umbDebugContextEventType, this.#onContextDebug as unknown as EventListener);
this.getHostElement().addEventListener(
UMB_umbDebugContextEventType,
this.#onContextDebug as unknown as EventListener,
);
}
#onContextDebug = (event: any) => {
@@ -38,7 +41,7 @@ export class UmbContextDebugController extends UmbBaseController {
hostDisconnected(): void {
super.hostDisconnected();
this.getHostElement().removeEventListener(
umbDebugContextEventType,
UMB_umbDebugContextEventType,
this.#onContextDebug as unknown as EventListener,
);
}