Skip to content

Enhance code editor typing experience (bracket matching, auto-close, resize) #8266

Description

@enkr1

Problem

The code editor in programming assessments lacks basic IDE typing features and has a fixed, non-resizable height.

Changes

IDE typing features (EditorField.tsx)

  • Auto-close brackets/quotes (behavioursEnabled)
  • Wrap selection with brackets/quotes (wrapBehavioursEnabled)
  • Multi-cursor via Cmd+D / Ctrl+D (enableMultiselect)
  • Active line + selected word highlighting
  • Remove print margin line

Autocomplete explicitly OFF — exam fairness preserved.

Resizable editor (Editor.jsx)

  • Replace fixed 25-line height with CSS resize: vertical drag handle
  • ResizeObserver keeps Ace in sync with container size
  • Default 400px, min 200px

Tests

  • Verify IDE options enabled
  • Verify autocomplete options are false

Not in scope

  • Autocomplete (exam integrity)
  • Editor library swap (future — CodeMirror 6 or Monaco)

Related: #6400, #307

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions