Skip to content

Phase 2: Add step-by-step opcode execution trace #2

@polydeuces32

Description

@polydeuces32

Goal

Add a step-through execution mode that shows exactly how each opcode changes the stack.

Why

This is the most valuable upgrade for learning. It turns the playground from a simple runner into an actual teaching tool.

Requirements

  • Add executionTrace output from the engine
  • Each trace item should include:
    • token index
    • token name
    • stack before
    • stack after
    • error state if any
  • Add UI buttons:
    • Run All
    • Step Forward
    • Reset Trace
  • Highlight the currently executing opcode
  • Show stack before/after for each step

Acceptance Criteria

  • User can run a script one opcode at a time
  • Unknown tokens fail clearly
  • UI never uses unsafe innerHTML for user-provided values
  • Existing run behavior still works

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions