fix(editor): Fix read-only mode in inline expression editor (#9232)

This commit is contained in:
Elias Meire 2024-04-26 15:12:06 +02:00 committed by GitHub
parent 0b52320635
commit 99f384e2cf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 20 additions and 3 deletions

View file

@ -25,14 +25,14 @@ type Props = {
modelValue: string;
path: string;
rows?: number;
isReadonly?: boolean;
isReadOnly?: boolean;
additionalData?: IDataObject;
eventBus?: EventBus;
};
const props = withDefaults(defineProps<Props>(), {
rows: 5,
isReadonly: false,
isReadOnly: false,
additionalData: () => ({}),
eventBus: () => createEventBus(),
});
@ -70,7 +70,7 @@ const {
editorRef: root,
editorValue,
extensions,
isReadOnly: props.isReadonly,
isReadOnly: props.isReadOnly,
autocompleteTelemetry: { enabled: true, parameterPath: props.path },
additionalData: props.additionalData,
});

View file

@ -203,6 +203,7 @@ export default defineComponent({
<style lang="scss" module>
.container {
display: flex;
min-height: 22px;
}
.loader {

View file

@ -47,4 +47,20 @@ describe('ExpressionParameterInput', () => {
await userEvent.click(baseElement);
expect(emitted('blur')).toHaveLength(1);
});
describe('in read-only mode', () => {
test('it should render a read-only expression input', async () => {
const { container } = renderComponent({
props: {
modelValue: '={{$json.foo}}',
isReadOnly: true,
},
});
const editor = container.querySelector('.cm-content') as HTMLDivElement;
expect(editor).toBeInTheDocument();
expect(editor.getAttribute('contenteditable')).toEqual('false');
expect(editor.getAttribute('aria-readonly')).toEqual('true');
});
});
});