diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/seo/components/dot-edit-page-view-as-controller-seo/dot-edit-page-view-as-controller-seo.component.spec.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/seo/components/dot-edit-page-view-as-controller-seo/dot-edit-page-view-as-controller-seo.component.spec.ts index d9a407d1b027..da0cbfc918f1 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/seo/components/dot-edit-page-view-as-controller-seo/dot-edit-page-view-as-controller-seo.component.spec.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/seo/components/dot-edit-page-view-as-controller-seo/dot-edit-page-view-as-controller-seo.component.spec.ts @@ -195,6 +195,8 @@ describe('DotEditPageViewAsControllerSeoComponent', () => { componentHost.pageState = new DotPageRenderState(mockUser(), mockDotRenderedPage()); + + fixtureHost.detectChanges(); languageSelector = de.query(By.css('dot-language-selector')).componentInstance; @@ -205,11 +207,10 @@ describe('DotEditPageViewAsControllerSeoComponent', () => { expect(personaSelector).not.toBeNull(); }); - xit('should persona selector be enabled', () => { - expect(personaSelector.disabled).toBe(false); - }); + fit('should persona selector be disabled after haveContent is set to false', () => { + + console.log('componentHost.pageState', componentHost.pageState.page.identifier); - it('should persona selector be disabled after haveContent is set to false', () => { const dotPageStateService: DotPageStateService = de.injector.get(DotPageStateService); dotPageStateService.haveContent$.next(false); diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/form/Dropdown.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/form/Dropdown.stories.ts index 3a8b1142cc4d..e5314089fdf4 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/form/Dropdown.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/form/Dropdown.stories.ts @@ -66,7 +66,7 @@ export default meta; type Story = StoryObj; -export const Primary: Story = { +export const Default: Story = { parameters: { docs: { source: { @@ -76,3 +76,19 @@ export const Primary: Story = { } } }; + +export const CustomTemplate: Story = { + render: (args) => ({ + props: args, + template: ` + + + --{{ selected.label }}-- + + + **{{ item.label }}** + + ` + }) +}; + diff --git a/core-web/libs/portlets/dot-experiments/portlet/src/lib/dot-experiments-configuration/store/dot-experiments-configuration-store.spec.ts b/core-web/libs/portlets/dot-experiments/portlet/src/lib/dot-experiments-configuration/store/dot-experiments-configuration-store.spec.ts index a132d57f3b8b..098af35597cd 100644 --- a/core-web/libs/portlets/dot-experiments/portlet/src/lib/dot-experiments-configuration/store/dot-experiments-configuration-store.spec.ts +++ b/core-web/libs/portlets/dot-experiments/portlet/src/lib/dot-experiments-configuration/store/dot-experiments-configuration-store.spec.ts @@ -1,3 +1,4 @@ +import { createFakeEvent } from '@ngneat/spectator'; import { createServiceFactory, mockProvider, @@ -255,18 +256,24 @@ describe('DotExperimentsConfigurationStore', () => { store.vm$.pipe(take(1)).subscribe(({ menuItems }) => { // Start Experiment - menuItems[MENU_ITEMS_START_INDEX].command(); + menuItems[MENU_ITEMS_START_INDEX].command({ + originalEvent: createFakeEvent('click') + }); expect(dotExperimentsService.start).toHaveBeenCalledWith(EXPERIMENT_MOCK.id); // Push Publish - menuItems[MENU_ITEMS_PUSH_PUBLISH_INDEX].command(); + menuItems[MENU_ITEMS_PUSH_PUBLISH_INDEX].command({ + originalEvent: createFakeEvent('click') + }); expect(dotPushPublishDialogService.open).toHaveBeenCalledWith({ assetIdentifier: EXPERIMENT_MOCK.id, title: 'Push Publish' }); // Add to Bundle - menuItems[MENU_ITEMS_ADD_T0_BUNDLE_INDEX].command(); + menuItems[MENU_ITEMS_ADD_T0_BUNDLE_INDEX].command({ + originalEvent: createFakeEvent('click') + }); expect(store.showAddToBundle).toHaveBeenCalledWith(EXPERIMENT_MOCK.id); // test the ones with confirm dialog in the DotExperimentsConfigurationComponent. diff --git a/core-web/libs/portlets/edit-ema/portlet/src/test-setup.ts b/core-web/libs/portlets/edit-ema/portlet/src/test-setup.ts index ef84ee02978e..32c17d6888ff 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/test-setup.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/test-setup.ts @@ -1,12 +1,11 @@ import 'jest-preset-angular/setup-jest'; -import { SplitButtonMockComponent, SplitButtonMockModule } from '@dotcms/utils-testing'; - -/* - * This is a workaround for the following PrimeNg issue: https://github.com/primefaces/primeng/issues/12945 - * They already fixed it, but it's not in the latest v15 LTS yet: https://github.com/primefaces/primeng/pull/13597 - */ -jest.mock('primeng/splitbutton', () => ({ - SplitButtonModule: SplitButtonMockModule, - SplitButton: SplitButtonMockComponent -})); +// Workaround for the following issue: +// https://github.com/jsdom/jsdom/issues/2177#issuecomment-1724971596 +const originalConsoleError = console.error; +const jsDomCssError = 'Error: Could not parse CSS stylesheet'; +console.error = (...params) => { + if (!params.find((p) => p.toString().includes(jsDomCssError))) { + originalConsoleError(...params); + } +}; \ No newline at end of file diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.spec.ts b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.spec.ts index 1dad59c7fde9..be3f1cc18d59 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.spec.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.spec.ts @@ -1,11 +1,13 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ +import { createFakeEvent } from '@ngneat/spectator'; import { of } from 'rxjs'; import { Component, DebugElement, EventEmitter, Input, Output } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { ButtonModule } from 'primeng/button'; import { Dropdown, DropdownModule } from 'primeng/dropdown'; @@ -15,7 +17,7 @@ import { TableModule } from 'primeng/table'; import { DotMessageService, DotFormatDateService } from '@dotcms/data-access'; import { DotcmsConfigService, LoginService } from '@dotcms/dotcms-js'; import { DotDiffPipe, DotMessagePipe, DotRelativeDatePipe } from '@dotcms/ui'; -import { MockDotMessageService } from '@dotcms/utils-testing'; +import { MockDotMessageService, mockMatchMedia } from '@dotcms/utils-testing'; import { DotContentCompareTableComponent } from './dot-content-compare-table.component'; @@ -296,7 +298,8 @@ describe('DotContentCompareTableComponent', () => { DotMessagePipe, FormsModule, DotRelativeDatePipe, - ButtonModule + ButtonModule, + BrowserAnimationsModule ], providers: [ { provide: DotMessageService, useValue: messageServiceMock }, @@ -324,6 +327,7 @@ describe('DotContentCompareTableComponent', () => { de = hostFixture.debugElement; hostComponent.data = dotContentCompareTableDataMock; hostFixture.detectChanges(); + mockMatchMedia(); }); describe('header', () => { @@ -347,11 +351,20 @@ describe('DotContentCompareTableComponent', () => { { label: 'Plain', value: false } ]); }); - it('should show versions selectButton with transformed label', () => { - const dropdown = de.query(By.css('[data-testId="versions-dropdown"]')).nativeElement; - expect(dropdown.innerHTML.replace(/^\s+|\s+$/gm, '')).toContain( - `${dotContentCompareTableDataMock.versions[0].modDate} by ${dotContentCompareTableDataMock.versions[0].modUserName}` - ); + it('should show versions selectButton with transformed label', async () => { + const dropdown = de.query(By.css('p-dropdown')); + + + dropdown.componentInstance.show(); + hostFixture.detectChanges(); + + const versions = hostComponent.data.versions; + + dropdown.queryAll(By.css('.p-dropdown-item')).forEach((item, index) => { + const textContent = item.nativeElement.textContent; + const text = `${versions[index].modDate} by ${versions[index].modUserName}` + expect(textContent).toContain(text); + }); }); }); @@ -469,7 +482,7 @@ describe('DotContentCompareTableComponent', () => { it('should emit changeVersion', () => { jest.spyOn(hostComponent.changeVersion, 'emit'); const dropdown: Dropdown = de.query(By.css('p-dropdown')).componentInstance; - dropdown.onChange.emit({ value: 'test' }); + dropdown.onChange.emit({ value: 'test', originalEvent: createFakeEvent('click') }); expect(hostComponent.changeVersion.emit).toHaveBeenCalledWith('test'); }); diff --git a/core-web/libs/portlets/edit-ema/ui/src/test-setup.ts b/core-web/libs/portlets/edit-ema/ui/src/test-setup.ts index a904102a06ba..1eb9d47d6c3c 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/test-setup.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/test-setup.ts @@ -1,18 +1,13 @@ -globalThis.ngJest = { - testEnvironmentOptions: { - errorOnUnknownElements: true, - errorOnUnknownProperties: true +import 'jest-preset-angular/setup-jest'; + +// Workaround for the following issue: +// https://github.com/jsdom/jsdom/issues/2177#issuecomment-1724971596 +const originalConsoleError = console.error; +const jsDomCssError = 'Error: Could not parse CSS stylesheet'; +console.error = (...params) => { + if (!params.find((p) => p.toString().includes(jsDomCssError))) { + originalConsoleError(...params); } }; -import 'jest-preset-angular/setup-jest'; -import { SplitButtonMockComponent, SplitButtonMockModule } from '@dotcms/utils-testing'; -/* - * This is a workaround for the following PrimeNg issue: https://github.com/primefaces/primeng/issues/12945 - * They already fixed it, but it's not in the latest v15 LTS yet: https://github.com/primefaces/primeng/pull/13597 - */ -jest.mock('primeng/splitbutton', () => ({ - SplitButtonModule: SplitButtonMockModule, - SplitButton: SplitButtonMockComponent -})); diff --git a/core-web/libs/template-builder/src/lib/components/template-builder/components/add-style-classes-dialog/add-style-classes-dialog.component.html b/core-web/libs/template-builder/src/lib/components/template-builder/components/add-style-classes-dialog/add-style-classes-dialog.component.html index 0a4e281b6d65..105fa0abaef8 100644 --- a/core-web/libs/template-builder/src/lib/components/template-builder/components/add-style-classes-dialog/add-style-classes-dialog.component.html +++ b/core-web/libs/template-builder/src/lib/components/template-builder/components/add-style-classes-dialog/add-style-classes-dialog.component.html @@ -12,7 +12,7 @@ dotSelectItem data-testId="autocomplete" inputId="auto-complete-input" - appendTo="body"> + appendTo="body" />