From eadaaa1aa07cdb4d7150862e559432125e61794a Mon Sep 17 00:00:00 2001 From: JzoNg Date: Fri, 8 May 2026 16:53:12 +0800 Subject: [PATCH] fix(web): z-index of shortcut popup --- .../plugins/hitl-input-block/input-field.tsx | 2 -- .../plugins/hitl-input-block/pre-populate.tsx | 2 -- .../shortcuts-popup-plugin/__tests__/index.spec.tsx | 2 ++ .../plugins/shortcuts-popup-plugin/index.tsx | 4 ++-- .../__tests__/test-email-sender.spec.tsx | 13 ++++++++----- 5 files changed, 12 insertions(+), 11 deletions(-) diff --git a/web/app/components/base/prompt-editor/plugins/hitl-input-block/input-field.tsx b/web/app/components/base/prompt-editor/plugins/hitl-input-block/input-field.tsx index 7ceb2dcc80..12a15fa46c 100644 --- a/web/app/components/base/prompt-editor/plugins/hitl-input-block/input-field.tsx +++ b/web/app/components/base/prompt-editor/plugins/hitl-input-block/input-field.tsx @@ -203,7 +203,6 @@ const InputField: React.FC = ({ @@ -260,7 +259,6 @@ const InputField: React.FC = ({ onChange={handleSelectOptionSourceSelectorChange} readonly={false} isJustShowValue - zIndex={1000000} filterVar={varPayload => varPayload.type === VarType.arrayString} /> void readonly: boolean - zIndex: number filterVar: (varPayload: Var) => boolean isJustShowValue?: boolean } @@ -85,7 +84,6 @@ const PrePopulate: FC = ({ value: valueSelector || [], onChange: onValueSelectorChange!, readonly: false, - zIndex: 1000000, // bigger than shortcut plugin popup filterVar: (varPayload: Var) => { return [VarType.string, VarType.number, VarType.secret].includes(varPayload.type) }, diff --git a/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/__tests__/index.spec.tsx b/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/__tests__/index.spec.tsx index c282706706..40a8ee13ec 100644 --- a/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/__tests__/index.spec.tsx +++ b/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/__tests__/index.spec.tsx @@ -186,7 +186,9 @@ describe('ShortcutsPopupPlugin', () => { render() focusAndTriggerHotkey('/') const portalContent = await screen.findByText(SHORTCUTS_EMPTY_CONTENT) + const floatingDiv = portalContent.closest('div') expect(document.body).toContainElement(portalContent) + expect(floatingDiv).toHaveClass('z-1002') }) // ─── matchHotkey: string hotkey ─── diff --git a/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/index.tsx b/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/index.tsx index e3bee154d8..6731d31d06 100644 --- a/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/index.tsx +++ b/web/app/components/base/prompt-editor/plugins/shortcuts-popup-plugin/index.tsx @@ -236,7 +236,7 @@ export default function ShortcutsPopupPlugin({ setOpen(true) onOpen?.() - }, [onOpen]) + }, [editor, onOpen, refs]) const closePortal = useCallback(() => { setOpen(false) @@ -298,7 +298,7 @@ export default function ShortcutsPopupPlugin({ refs.setFloating(node) }} className={cn( - useContainer ? '' : 'z-999999', + useContainer ? '' : 'z-1002', 'absolute rounded-xl bg-components-panel-bg-blur shadow-lg', className, )} diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/__tests__/test-email-sender.spec.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/__tests__/test-email-sender.spec.tsx index 87f5fe2701..1001fbff9f 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/__tests__/test-email-sender.spec.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/__tests__/test-email-sender.spec.tsx @@ -1,5 +1,7 @@ +/* eslint-disable react/no-context-provider -- use-context-selector contexts require .Provider in tests. */ import type { ReactNode } from 'react' -import type { EmailConfig, FormInputItem } from '../../../types' +import type { EmailConfig, FormInputItem, ParagraphFormInput, SelectFormInput } from '../../../types' +import type { CodeNodeType } from '@/app/components/workflow/nodes/code/types' import type { App, AppSSO } from '@/types/app' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { fireEvent, render, screen, waitFor } from '@testing-library/react' @@ -7,6 +9,7 @@ import userEvent from '@testing-library/user-event' import { useStore as useAppStore } from '@/app/components/app/store' import { HooksStoreContext } from '@/app/components/workflow/hooks-store/provider' import { createHooksStore } from '@/app/components/workflow/hooks-store/store' +import { CodeLanguage } from '@/app/components/workflow/nodes/code/types' import { BlockEnum, InputVarType, VarType } from '@/app/components/workflow/types' import { AppContext, initialLangGeniusVersionInfo, initialWorkspaceInfo, userProfilePlaceholder } from '@/context/app-context' import EmailSenderModal from '../test-email-sender' @@ -145,7 +148,7 @@ const createConfig = (overrides: Partial = {}): EmailConfig => ({ ...overrides, }) -const createFormInput = (overrides: Partial = {}): FormInputItem => ({ +const createFormInput = (overrides: Partial = {}): FormInputItem => ({ type: InputVarType.paragraph, output_variable_name: 'user_name', default: { @@ -156,7 +159,7 @@ const createFormInput = (overrides: Partial = {}): FormInputItem ...overrides, }) -const createDynamicSelectInput = (): FormInputItem => ({ +const createDynamicSelectInput = (): SelectFormInput => ({ type: InputVarType.select, output_variable_name: 'decision', option_source: { @@ -278,7 +281,7 @@ describe('human-input/delivery-method/test-email-sender', () => { desc: '', type: BlockEnum.Code, variables: [], - code_language: 'python3', + code_language: CodeLanguage.python3, code: '', outputs: { result: { @@ -286,7 +289,7 @@ describe('human-input/delivery-method/test-email-sender', () => { children: null, }, }, - }, + } as CodeNodeType, }, ]} nodesOutputVars={[