diff --git a/packages/core/client/src/modules/popup/__e2e__/templatesOfBug.ts b/packages/core/client/src/modules/popup/__e2e__/templatesOfBug.ts index df02d6b908..2d71859186 100644 --- a/packages/core/client/src/modules/popup/__e2e__/templatesOfBug.ts +++ b/packages/core/client/src/modules/popup/__e2e__/templatesOfBug.ts @@ -4695,3 +4695,432 @@ export const shouldBackAfterClickBackButton = { 'x-index': 1, }, }; +export const zIndexOfSubpage = { + pageSchema: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Page', + properties: { + '54q3u7i1u4k': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'page:addBlock', + properties: { + '3gn9anq7t4e': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid.Row', + 'x-app-version': '1.3.25-beta', + properties: { + '0gxjlcll8gp': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid.Col', + 'x-app-version': '1.3.25-beta', + properties: { + '7i3uif7wk62': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-decorator': 'TableBlockProvider', + 'x-acl-action': 'users:list', + 'x-use-decorator-props': 'useTableBlockDecoratorProps', + 'x-decorator-props': { + collection: 'users', + dataSource: 'main', + action: 'list', + params: { + pageSize: 20, + }, + rowKey: 'id', + showIndex: true, + dragSort: false, + }, + 'x-toolbar': 'BlockSchemaToolbar', + 'x-settings': 'blockSettings:table', + 'x-component': 'CardItem', + 'x-filter-targets': [], + 'x-app-version': '1.3.25-beta', + properties: { + actions: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-initializer': 'table:configureActions', + 'x-component': 'ActionBar', + 'x-component-props': { + style: { + marginBottom: 'var(--nb-spacing)', + }, + }, + 'x-app-version': '1.3.25-beta', + 'x-uid': 'afsi4hnbyuj', + 'x-async': false, + 'x-index': 1, + }, + zpgpevopc1c: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'array', + 'x-initializer': 'table:configureColumns', + 'x-component': 'TableV2', + 'x-use-component-props': 'useTableBlockProps', + 'x-component-props': { + rowKey: 'id', + rowSelection: { + type: 'checkbox', + }, + }, + 'x-app-version': '1.3.25-beta', + properties: { + actions: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{ t("Actions") }}', + 'x-action-column': 'actions', + 'x-decorator': 'TableV2.Column.ActionBar', + 'x-component': 'TableV2.Column', + 'x-toolbar': 'TableColumnSchemaToolbar', + 'x-initializer': 'table:configureItemActions', + 'x-settings': 'fieldSettings:TableColumn', + 'x-toolbar-props': { + initializer: 'table:configureItemActions', + }, + 'x-app-version': '1.3.25-beta', + properties: { + '8u7j0st5wgs': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-decorator': 'DndContext', + 'x-component': 'Space', + 'x-component-props': { + split: '|', + }, + 'x-app-version': '1.3.25-beta', + properties: { + s2vaxfg91i2: { + 'x-uid': 'qh2sc6ljtem', + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: 'open subpage level1', + 'x-action': 'view', + 'x-toolbar': 'ActionSchemaToolbar', + 'x-settings': 'actionSettings:view', + 'x-component': 'Action.Link', + 'x-component-props': { + openMode: 'page', + iconColor: '#1677FF', + danger: false, + }, + 'x-action-context': { + dataSource: 'main', + collection: 'users', + }, + 'x-decorator': 'ACLActionProvider', + 'x-designer-props': { + linkageAction: true, + }, + properties: { + drawer: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{ t("View record") }}', + 'x-component': 'Action.Container', + 'x-component-props': { + className: 'nb-action-popup', + }, + properties: { + tabs: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Tabs', + 'x-component-props': {}, + 'x-initializer': 'popup:addTab', + properties: { + tab1: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{t("Details")}}', + 'x-component': 'Tabs.TabPane', + 'x-designer': 'Tabs.Designer', + 'x-component-props': {}, + properties: { + grid: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'popup:common:addBlock', + properties: { + '4qymqz8hwn4': { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid.Row', + 'x-app-version': '1.3.25-beta', + properties: { + ihbvd00t4q6: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid.Col', + 'x-app-version': '1.3.25-beta', + properties: { + hxrps0ye253: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-acl-action-props': { + skipScopeCheck: false, + }, + 'x-acl-action': 'users:update', + 'x-decorator': 'FormBlockProvider', + 'x-use-decorator-props': + 'useEditFormBlockDecoratorProps', + 'x-decorator-props': { + action: 'get', + dataSource: 'main', + collection: 'users', + }, + 'x-toolbar': 'BlockSchemaToolbar', + 'x-settings': 'blockSettings:editForm', + 'x-component': 'CardItem', + 'x-app-version': '1.3.25-beta', + properties: { + ql4garzgr8x: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'FormV2', + 'x-use-component-props': 'useEditFormBlockProps', + 'x-app-version': '1.3.25-beta', + properties: { + grid: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'form:configureFields', + 'x-app-version': '1.3.25-beta', + 'x-uid': 'mabh2ibgait', + 'x-async': false, + 'x-index': 1, + }, + ajprlhs22up: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-initializer': 'editForm:configureActions', + 'x-component': 'ActionBar', + 'x-component-props': { + layout: 'one-column', + }, + 'x-app-version': '1.3.25-beta', + properties: { + b9cne10fcgs: { + 'x-uid': 'xl8j6o0nh9y', + _isJSONSchemaObject: true, + version: '2.0', + title: '{{ t("Submit") }}', + 'x-action': 'submit', + 'x-component': 'Action', + 'x-use-component-props': + 'useUpdateActionProps', + 'x-toolbar': 'ActionSchemaToolbar', + 'x-settings': 'actionSettings:updateSubmit', + 'x-component-props': { + type: 'primary', + htmlType: 'submit', + }, + 'x-action-settings': { + triggerWorkflows: [], + schemaUid: '1bxeyl4dr8h', + }, + type: 'void', + 'x-app-version': '1.3.25-beta', + 'x-async': false, + 'x-index': 1, + }, + tqyracw6eb6: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{ t("Popup") }}', + 'x-action': 'customize:popup', + 'x-toolbar': 'ActionSchemaToolbar', + 'x-settings': 'actionSettings:popup', + 'x-component': 'Action', + 'x-component-props': { + openMode: 'drawer', + refreshDataBlockRequest: true, + }, + 'x-action-context': { + dataSource: 'main', + collection: 'users', + }, + 'x-app-version': '1.3.25-beta', + properties: { + drawer: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{ t("Popup") }}', + 'x-component': 'Action.Container', + 'x-component-props': { + className: 'nb-action-popup', + }, + 'x-app-version': '1.3.25-beta', + properties: { + tabs: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Tabs', + 'x-component-props': {}, + 'x-initializer': 'popup:addTab', + 'x-app-version': '1.3.25-beta', + properties: { + tab1: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + title: '{{t("Details")}}', + 'x-component': 'Tabs.TabPane', + 'x-designer': 'Tabs.Designer', + 'x-component-props': {}, + 'x-app-version': '1.3.25-beta', + properties: { + grid: { + _isJSONSchemaObject: true, + version: '2.0', + type: 'void', + 'x-component': 'Grid', + 'x-initializer': + 'popup:common:addBlock', + 'x-app-version': + '1.3.25-beta', + 'x-uid': 'zwuqnls6u3c', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': '55kyuw5ttyx', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'ky6g3f2n28w', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'vp4s1dwnd8z', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'jo22w4l8an4', + 'x-async': false, + 'x-index': 2, + }, + }, + 'x-uid': '84yctndy38l', + 'x-async': false, + 'x-index': 2, + }, + }, + 'x-uid': 'g6b2c8f2ovk', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'l3o4h95xmdl', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'heydlbpp6my', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'bulxu6j236w', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': '72yx2p3t3la', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'uj053epotun', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'cehviykewuu', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'lnnbghowqab', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'nbvrk0k8yff', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'j5hb8ndh6ga', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'jkn0ynmjn3m', + 'x-async': false, + 'x-index': 2, + }, + }, + 'x-uid': 'glwchpg5y33', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'fnefg28f6n0', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'ct8jzsn4eip', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': '8c4x82h3quo', + 'x-async': false, + 'x-index': 1, + }, + }, + 'x-uid': 'iha0m2ozo2a', + 'x-async': true, + 'x-index': 1, + }, +}; diff --git a/packages/core/client/src/modules/popup/__e2e__/zIndex.test.ts b/packages/core/client/src/modules/popup/__e2e__/zIndex.test.ts index 0add00003e..00c6eac6c1 100644 --- a/packages/core/client/src/modules/popup/__e2e__/zIndex.test.ts +++ b/packages/core/client/src/modules/popup/__e2e__/zIndex.test.ts @@ -8,10 +8,9 @@ */ import { expect, test } from '@nocobase/test/e2e'; -import { T2797, T2838 } from './templatesOfBug'; +import { T2797, T2838, zIndexOfSubpage } from './templatesOfBug'; test.describe('z-index of dialog', () => { - // https://nocobase.height.app/T-2797 test('edit block title', async ({ page, mockPage }) => { await mockPage(T2797).goto(); @@ -26,7 +25,6 @@ test.describe('z-index of dialog', () => { await expect(page.getByLabel('block-item-Input-users-Block')).not.toBeVisible(); }); - // https://nocobase.height.app/T-2838 test('multilevel modal', async ({ page, mockPage, mockRecord }) => { const nocoPage = await mockPage(T2838).waitForInit(); await mockRecord('general'); @@ -39,4 +37,18 @@ test.describe('z-index of dialog', () => { await page.getByLabel('action-Action-Submit-submit-').click(); await expect(page.getByLabel('block-item-CollectionField-')).not.toBeVisible(); }); + + test('z-index of subpage', async ({ page, mockPage }) => { + await mockPage(zIndexOfSubpage).goto(); + + // 1. Open the "Assign field values" popup in the subpage, it should be displayed on the top layer + await page.getByText('open subpage level1').click(); + await page.getByLabel('action-Action-Submit-submit-').hover(); + await page.getByLabel('designer-schema-settings-Action-actionSettings:updateSubmit-users').hover(); + await page.getByRole('menuitem', { name: 'Assign field values' }).click(); + await expect(page.getByRole('dialog').getByText('Assign field values')).toBeVisible(); + // If the click is ineffective, it means the popup is not displayed on the top layer + await page.getByRole('button', { name: 'Cancel' }).click({ timeout: 1000 }); + await expect(page.getByRole('dialog').getByText('Assign field values')).not.toBeVisible(); + }); }); diff --git a/packages/core/client/src/schema-component/antd/action/utils.ts b/packages/core/client/src/schema-component/antd/action/utils.ts index ced47ff832..574d92c69e 100644 --- a/packages/core/client/src/schema-component/antd/action/utils.ts +++ b/packages/core/client/src/schema-component/antd/action/utils.ts @@ -155,4 +155,4 @@ export const setInitialActionState = (field) => { field.componentProps['disabled'] = false; }; -export const antdDrawerZIndex = 1000; +export const antdDrawerZIndex = 100;