diff --git a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/create.action.ts b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/create.action.ts index ee2dbb7f52..834d6933d0 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/create.action.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/create.action.ts @@ -2,6 +2,7 @@ import { UMB_STYLESHEET_CREATE_OPTIONS_MODAL } from './options-modal/stylesheet- import { UmbEntityActionBase } from '@umbraco-cms/backoffice/entity-action'; import { umbOpenModal } from '@umbraco-cms/backoffice/modal'; +/** @deprecated No longer used internally. This will be removed in Umbraco 18. [LK] */ export class UmbStylesheetCreateOptionsEntityAction extends UmbEntityActionBase { override async execute() { await umbOpenModal(this, UMB_STYLESHEET_CREATE_OPTIONS_MODAL, { diff --git a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/manifests.ts index c5a933f817..1b13642c84 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/manifests.ts @@ -1,24 +1,55 @@ import { UMB_STYLESHEET_FOLDER_ENTITY_TYPE, UMB_STYLESHEET_ROOT_ENTITY_TYPE } from '../../entity.js'; +import { UMB_STYLESHEET_FOLDER_REPOSITORY_ALIAS } from '../../tree/folder/repository/index.js'; -export const manifests: Array = [ +/** @deprecated No longer used internally. This will be removed in Umbraco 18. [LK] */ +const modal: UmbExtensionManifest = { + type: 'modal', + alias: 'Umb.Modal.Stylesheet.CreateOptions', + name: 'Stylesheet Create Options Modal', + element: () => import('./options-modal/stylesheet-create-options-modal.element.js'), +}; + +const entityAction: UmbExtensionManifest = { + type: 'entityAction', + kind: 'create', + alias: 'Umb.EntityAction.Stylesheet.Create', + name: 'Create Stylesheet Entity Action', + weight: 1200, + forEntityTypes: [UMB_STYLESHEET_ROOT_ENTITY_TYPE, UMB_STYLESHEET_FOLDER_ENTITY_TYPE], + meta: { + icon: 'icon-add', + label: '#actions_create', + additionalOptions: true, + headline: '#create_createUnder #treeHeaders_documentTypes', + }, +}; + +const entityCreateOptionActions: Array = [ { - type: 'entityAction', - kind: 'default', - alias: 'Umb.EntityAction.Stylesheet.CreateOptions', - name: 'Stylesheet Create Options Entity Action', - weight: 1200, - api: () => import('./create.action.js'), + type: 'entityCreateOptionAction', + alias: 'Umb.EntityCreateOptionAction.Stylesheet.Default', + name: 'Default Stylesheet Entity Create Option Action', + weight: 100, + api: () => import('./stylesheet-create-option-action.js'), forEntityTypes: [UMB_STYLESHEET_ROOT_ENTITY_TYPE, UMB_STYLESHEET_FOLDER_ENTITY_TYPE], meta: { - icon: 'icon-add', - label: '#actions_create', - additionalOptions: true, + icon: 'icon-palette', + label: '#create_newStyleSheetFile', }, }, { - type: 'modal', - alias: 'Umb.Modal.Stylesheet.CreateOptions', - name: 'Stylesheet Create Options Modal', - element: () => import('./options-modal/stylesheet-create-options-modal.element.js'), + type: 'entityCreateOptionAction', + kind: 'folder', + alias: 'Umb.EntityCreateOptionAction.Stylesheet.Folder', + name: 'Stylesheet Folder Entity Create Option Action', + forEntityTypes: [UMB_STYLESHEET_ROOT_ENTITY_TYPE, UMB_STYLESHEET_FOLDER_ENTITY_TYPE], + meta: { + icon: 'icon-folder', + label: '#create_folder', + description: '#create_folderDescription', + folderRepositoryAlias: UMB_STYLESHEET_FOLDER_REPOSITORY_ALIAS, + }, }, ]; + +export const manifests: Array = [modal, entityAction, ...entityCreateOptionActions]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options-modal.element.ts index 88f1f8392b..48dde13853 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options-modal.element.ts @@ -4,6 +4,7 @@ import { html, customElement } from '@umbraco-cms/backoffice/external/lit'; import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; import { UmbCreateFolderEntityAction } from '@umbraco-cms/backoffice/tree'; +/** @deprecated No longer used internally. This will be removed in Umbraco 18. [LK] */ @customElement('umb-stylesheet-create-options-modal') export class UmbStylesheetCreateOptionsModalElement extends UmbModalBaseElement< UmbStylesheetCreateOptionsModalData, diff --git a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options.modal-token.ts b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options.modal-token.ts index a44683ac81..8e735fc4d5 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options.modal-token.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/options-modal/stylesheet-create-options.modal-token.ts @@ -1,10 +1,12 @@ import type { UmbEntityModel } from '@umbraco-cms/backoffice/entity'; import { UmbModalToken } from '@umbraco-cms/backoffice/modal'; +/** @deprecated No longer used internally. This will be removed in Umbraco 18. [LK] */ export interface UmbStylesheetCreateOptionsModalData { parent: UmbEntityModel; } +/** @deprecated No longer used internally. This will be removed in Umbraco 18. [LK] */ export const UMB_STYLESHEET_CREATE_OPTIONS_MODAL = new UmbModalToken( 'Umb.Modal.Stylesheet.CreateOptions', { diff --git a/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/stylesheet-create-option-action.ts b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/stylesheet-create-option-action.ts new file mode 100644 index 0000000000..6fbf941f49 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/templating/stylesheets/entity-actions/create/stylesheet-create-option-action.ts @@ -0,0 +1,11 @@ +import { UmbEntityCreateOptionActionBase } from '@umbraco-cms/backoffice/entity-create-option-action'; +import type { MetaEntityCreateOptionAction } from '@umbraco-cms/backoffice/entity-create-option-action'; + +export class UmbStylesheetCreateOptionAction extends UmbEntityCreateOptionActionBase { + override async getHref() { + const href = `section/settings/workspace/stylesheet/create/parent/${this.args.entityType}/${this.args.unique || 'null'}`; + return `${href}/view/code`; + } +} + +export { UmbStylesheetCreateOptionAction as api }; diff --git a/tests/Umbraco.Tests.AcceptanceTest/package-lock.json b/tests/Umbraco.Tests.AcceptanceTest/package-lock.json index fddf89e58a..f524f9a62e 100644 --- a/tests/Umbraco.Tests.AcceptanceTest/package-lock.json +++ b/tests/Umbraco.Tests.AcceptanceTest/package-lock.json @@ -8,7 +8,7 @@ "hasInstallScript": true, "dependencies": { "@umbraco/json-models-builders": "^2.0.31", - "@umbraco/playwright-testhelpers": "^15.0.41", + "@umbraco/playwright-testhelpers": "^16.0.1", "camelize": "^1.0.0", "dotenv": "^16.3.1", "node-fetch": "^2.6.7" @@ -67,9 +67,10 @@ } }, "node_modules/@umbraco/playwright-testhelpers": { - "version": "15.0.41", - "resolved": "https://registry.npmjs.org/@umbraco/playwright-testhelpers/-/playwright-testhelpers-15.0.41.tgz", - "integrity": "sha512-yZEhC3iSqT+O/2TBz0QGGEZyKleZ+qIW4YHTpm2nxPSdBAUaKqE4lb6UwylcQZtYnZVssXdi62jbzRPbG8XBlw==", + "version": "16.0.1", + "resolved": "https://registry.npmjs.org/@umbraco/playwright-testhelpers/-/playwright-testhelpers-16.0.1.tgz", + "integrity": "sha512-c3+Z0l8p2nBgrtkaiXdYJONT16h0N/jSd9pC/E6IhXVloUH0qlUFVUVffxzofHVSfIsyrPKQC3T4iLzjRb/HIw==", + "license": "MIT", "dependencies": { "@umbraco/json-models-builders": "2.0.31", "node-fetch": "^2.6.7" diff --git a/tests/Umbraco.Tests.AcceptanceTest/package.json b/tests/Umbraco.Tests.AcceptanceTest/package.json index 38315b91a4..4a8f733bc7 100644 --- a/tests/Umbraco.Tests.AcceptanceTest/package.json +++ b/tests/Umbraco.Tests.AcceptanceTest/package.json @@ -21,7 +21,7 @@ }, "dependencies": { "@umbraco/json-models-builders": "^2.0.31", - "@umbraco/playwright-testhelpers": "^15.0.41", + "@umbraco/playwright-testhelpers": "^16.0.1", "camelize": "^1.0.0", "dotenv": "^16.3.1", "node-fetch": "^2.6.7" diff --git a/tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Settings/Stylesheet/Stylesheet.spec.ts b/tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Settings/Stylesheet/Stylesheet.spec.ts index 84b6174e89..4067e00d1e 100644 --- a/tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Settings/Stylesheet/Stylesheet.spec.ts +++ b/tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/Settings/Stylesheet/Stylesheet.spec.ts @@ -1,4 +1,4 @@ -import {ConstantHelper, NotificationConstantHelper, test} from '@umbraco/playwright-testhelpers'; +import {ConstantHelper, NotificationConstantHelper, test} from '@umbraco/playwright-testhelpers'; import {expect} from '@playwright/test'; const stylesheetName = 'TestStyleSheetFile.css'; @@ -53,27 +53,6 @@ test('can create a stylesheet with content', async ({umbracoApi, umbracoUi}) => await umbracoUi.stylesheet.isStylesheetRootTreeItemVisible(stylesheetName); }); -test.skip('can create a new Rich Text Editor stylesheet file', {tag: '@smoke'}, async ({umbracoApi, umbracoUi}) => { - // Arrange - const stylesheetContent = '/**umb_name:' + styleName + '*/\n' + styleSelector + ' {\n\t' + styleStyles + '\n}'; - await umbracoUi.stylesheet.goToSection(ConstantHelper.sections.settings); - - //Act - await umbracoUi.stylesheet.clickActionsMenuAtRoot(); - await umbracoUi.stylesheet.clickCreateButton(); - await umbracoUi.stylesheet.clickNewRichTextEditorStylesheetButton(); - await umbracoUi.stylesheet.enterStylesheetName(stylesheetName); - await umbracoUi.stylesheet.addRTEStyle(styleName, styleSelector, styleStyles); - await umbracoUi.stylesheet.clickSaveButton(); - - // Assert - await umbracoUi.stylesheet.doesSuccessNotificationHaveText(NotificationConstantHelper.success.created); - expect(await umbracoApi.stylesheet.doesExist(stylesheetName)).toBeTruthy(); - const stylesheetData = await umbracoApi.stylesheet.getByName(stylesheetName); - expect(stylesheetData.content).toEqual(stylesheetContent); - await umbracoUi.stylesheet.isStylesheetRootTreeItemVisible(stylesheetName); -}); - test.skip('can update a stylesheet', {tag: '@smoke'}, async ({umbracoApi, umbracoUi}) => { // Arrange const stylesheetContent = '/**umb_name:' + styleName + '*/\n' + styleSelector + ' {\n\t' + styleStyles + '\n}'; @@ -83,7 +62,6 @@ test.skip('can update a stylesheet', {tag: '@smoke'}, async ({umbracoApi, umbrac //Act await umbracoUi.stylesheet.openStylesheetByNameAtRoot(stylesheetName); - await umbracoUi.stylesheet.addRTEStyle(styleName, styleSelector, styleStyles); await umbracoUi.stylesheet.clickSaveButton(); // Assert @@ -126,46 +104,6 @@ test('can rename a stylesheet', {tag: '@smoke'}, async ({umbracoApi, umbracoUi}) expect(await umbracoApi.stylesheet.doesNameExist(wrongStylesheetName)).toBeFalsy(); }); -test('can edit rich text editor styles', async ({umbracoApi, umbracoUi}) => { - // Arrange - const newStyleName = 'TestNewStyleName'; - const newStyleSelector = 'h2'; - const newStyleStyles = 'color: white'; - const newStylesheetContent = '/**umb_name:' + newStyleName + '*/\n' + newStyleSelector + ' {\n\t' + newStyleStyles + '\n}'; - const stylesheetContent = '/**umb_name:' + styleName + '*/\n' + styleSelector + ' {\n\t' + styleStyles + '\n}'; - await umbracoApi.stylesheet.create(stylesheetName, stylesheetContent); - expect(await umbracoApi.stylesheet.doesExist(stylesheetName)).toBeTruthy(); - await umbracoUi.stylesheet.goToSection(ConstantHelper.sections.settings); - - //Act - await umbracoUi.stylesheet.openStylesheetByNameAtRoot(stylesheetName); - await umbracoUi.stylesheet.editRTEStyle(styleName, newStyleName, newStyleSelector, newStyleStyles); - await umbracoUi.stylesheet.clickSaveButton(); - - // Assert - await umbracoUi.stylesheet.doesSuccessNotificationHaveText(NotificationConstantHelper.success.saved); - const stylesheetData = await umbracoApi.stylesheet.getByName(stylesheetName); - expect(stylesheetData.content).toEqual(newStylesheetContent); -}); - -test('can remove rich text editor styles', async ({umbracoApi, umbracoUi}) => { - // Arrange - const stylesheetContent = '/**umb_name:' + styleName + '*/\n' + styleSelector + ' {\n\t' + styleStyles + '\n}'; - await umbracoApi.stylesheet.create(stylesheetName, stylesheetContent); - expect(await umbracoApi.stylesheet.doesExist(stylesheetName)).toBeTruthy(); - await umbracoUi.stylesheet.goToSection(ConstantHelper.sections.settings); - - //Act - await umbracoUi.stylesheet.openStylesheetByNameAtRoot(stylesheetName); - await umbracoUi.stylesheet.removeRTEStyle(styleName); - await umbracoUi.stylesheet.clickSaveButton(); - - // Assert - await umbracoUi.stylesheet.doesSuccessNotificationHaveText(NotificationConstantHelper.success.saved); - const stylesheetData = await umbracoApi.stylesheet.getByName(stylesheetName); - expect(stylesheetData.content).toEqual(''); -}); - test('cannot create a stylesheet with an empty name', async ({umbracoApi, umbracoUi}) => { // Arrange await umbracoUi.stylesheet.goToSection(ConstantHelper.sections.settings);