LPD-33712 Increase z-index for maximized editor

modules/apps/frontend-editor/frontend-editor-ckeditor-sample-web/src/main/java/com/liferay/frontend/editor/ckeditor/sample/web/internal/editor/configuration/ClassicEditorConfigContributor.java

@@ -37,12 +37,16 @@ public void populateConfigJSONObject(
 		RequestBackedPortletURLFactory requestBackedPortletURLFactory) {
 
 		jsonObject.put(
+			"extraPlugins", "maximize, stylescombo"
+		).put(
 			"toolbar_liferay",
 			JSONUtil.putAll(
 				toJSONArray("['Undo', 'Redo']"),
 				toJSONArray("['Styles', 'Bold', 'Italic', 'Underline']"),
 				toJSONArray("['NumberedList', 'BulletedList']"),
-				toJSONArray("['Link', Unlink]"), toJSONArray("['Table']")));
+				toJSONArray("['Maximize']"), toJSONArray("['Link', Unlink]"),
+				toJSONArray("['Table']"))
+		);
 	}
 
 }

modules/apps/frontend-editor/frontend-editor-ckeditor-web/src/main/resources/META-INF/resources/css/main.scss

@@ -263,6 +263,10 @@
 	z-index: 100 !important;
 }
 
+.cke_combopanel.lfr-maximized {
+	z-index: 10000 !important;
+}
+
 .cke_panel_block {
 	.cke_panel_grouptitle {
 		font-size: 20px;

modules/apps/frontend-editor/frontend-editor-ckeditor-sample-web/test.properties → modules/apps/frontend-editor/frontend-editor-ckeditor-web/test.properties

@@ -2,7 +2,7 @@
 ## Playwright
 ##
 
-    playwright.test.project[playwright-js-tomcat90-mysql57-jdk8][relevant][frontend-editor-rule]=frontend-editor-ckeditor-sample-web
+    playwright.test.project[playwright-js-tomcat90-mysql57-jdk8][relevant][frontend-editor-rule]=frontend-editor-ckeditor-web
 
 ##
 ## Relevant

modules/test/playwright/playwright.config.ts

@@ -29,7 +29,7 @@ import {config as featureFlagWebConfig} from './tests/feature-flag-web/config';
 import {config as fragmentWebConfig} from './tests/fragment-web/config';
 import {config as frontendDataSetAdminWebConfig} from './tests/frontend-data-set-admin-web/config';
 import {config as frontendDataSetWebConfig} from './tests/frontend-data-set-web/config';
-import {config as frontendEditorCKEditorSampleWebConfig} from './tests/frontend-editor-ckeditor-sample-web/config';
+import {config as frontendEditorCKEditorWebConfig} from './tests/frontend-editor-ckeditor-web/config';
 import {config as frontendJsSpaWebConfig} from './tests/frontend-js-spa-web/config';
 import {config as frontendTaglibClayConfig} from './tests/frontend-taglib-clay/config';
 import {config as frontendTaglibConfig} from './tests/frontend-taglib/config';
@@ -121,7 +121,7 @@ export default defineConfig({
 		fragmentWebConfig,
 		frontendDataSetAdminWebConfig,
 		frontendDataSetWebConfig,
-		frontendEditorCKEditorSampleWebConfig,
+		frontendEditorCKEditorWebConfig,
 		frontendJsSpaWebConfig,
 		frontendTaglibClayConfig,
 		frontendTaglibConfig,

modules/test/playwright/tests/frontend-editor-ckeditor-web/classic.spec.ts

@@ -0,0 +1,83 @@
+/**
+ * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
+ * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
+ */
+
+import {expect, mergeTests} from '@playwright/test';
+
+import {apiHelpersTest} from '../../fixtures/apiHelpersTest';
+import {featureFlagsTest} from '../../fixtures/featureFlagsTest';
+import {isolatedSiteTest} from '../../fixtures/isolatedSiteTest';
+import {loginTest} from '../../fixtures/loginTest';
+import {liferayConfig} from '../../liferay.config';
+import getRandomString from '../../utils/getRandomString';
+import getPageDefinition from '../layout-content-page-editor-web/utils/getPageDefinition';
+import getWidgetDefinition from '../layout-content-page-editor-web/utils/getWidgetDefinition';
+
+export const test = mergeTests(
+	apiHelpersTest,
+	featureFlagsTest({
+		'LPS-178052': true,
+	}),
+	isolatedSiteTest,
+	loginTest()
+);
+
+test(
+	'Dropdown menus are visible when maximized',
+	{tag: '@LPD-33712'},
+	async ({apiHelpers, page, site}) => {
+		let layout: Layout;
+
+		await test.step('Create a content site and the ckeditor sample widget', async () => {
+			const widgetDefinition = getWidgetDefinition({
+				id: getRandomString(),
+				widgetName:
+					'com_liferay_editor_ckeditor_sample_web_internal_portlet_CKEditorSamplePortlet',
+			});
+
+			layout = await apiHelpers.headlessDelivery.createSitePage({
+				pageDefinition: getPageDefinition([widgetDefinition]),
+				siteId: site.id,
+				title: getRandomString(),
+			});
+		});
+
+		await test.step('Select Maximized button and check stylesCombo dropdown', async () => {
+			await page.goto(
+				`${liferayConfig.environment.baseUrl}/web${site.friendlyUrlPath}${layout.friendlyUrlPath}`
+			);
+
+			const ckeditorSampleWidgetClassicTab = page.getByRole('tab', {
+				name: 'Classic',
+			});
+
+			await ckeditorSampleWidgetClassicTab.waitFor({state: 'visible'});
+			await ckeditorSampleWidgetClassicTab.click();
+
+			const maximizedButton = page.getByLabel('Maximize');
+
+			await maximizedButton.waitFor({state: 'visible'});
+			await maximizedButton.click();
+
+			const stylesComboButton = page
+				.getByLabel('Classic', {exact: true})
+				.getByLabel('Styles');
+
+			await stylesComboButton.click();
+
+			const stylesComboZIndex = await page.evaluate(() => {
+				const stylesComboElement = document.querySelector(
+					'.cke_combopanel.lfr-maximized'
+				);
+
+				const stylesComboElementStyles =
+					window.getComputedStyle(stylesComboElement);
+
+				return stylesComboElementStyles.getPropertyValue('z-index');
+			});
+
+			expect(stylesComboZIndex).toEqual('10000');
+		});
+	}
+);

modules/test/playwright/tests/frontend-editor-ckeditor-sample-web/config.ts → modules/test/playwright/tests/frontend-editor-ckeditor-web/config.ts

@@ -4,6 +4,6 @@
  */
 
 export const config = {
-	name: 'frontend-editor-ckeditor-sample-web',
-	testDir: 'tests/frontend-editor-ckeditor-sample-web',
+	name: 'frontend-editor-ckeditor-web',
+	testDir: 'tests/frontend-editor-ckeditor-web',
 };

modules/test/playwright/tests/frontend-editor-ckeditor-web/env/osgi-modules.list

@@ -0,0 +1 @@
+frontend-editor-ckeditor-sample-web

modules/test/playwright/tests/frontend-editor-ckeditor-sample-web/test.properties → modules/test/playwright/tests/frontend-editor-ckeditor-web/test.properties

@@ -2,7 +2,7 @@
 ## Playwright
 ##
 
-    playwright.test.project[playwright-js-tomcat90-mysql57-jdk8][relevant][frontend-editor-rule]=frontend-editor-ckeditor-sample-web
+    playwright.test.project[playwright-js-tomcat90-mysql57-jdk8][relevant][frontend-editor-rule]=frontend-editor-ckeditor-web
 
 ##
 ## Test Suites