jcubic / jquery.terminal

jQuery Terminal Emulator - JavaScript library for creating web-based terminals with custom commands
https://terminal.jcubic.pl
MIT License
3.13k stars 570 forks source link

Wrong history when using hot reload #978

Open jcubic opened 1 month ago

jcubic commented 1 month ago

Issue summary

Each time when hot reload, update the page that have the terminal new history is created.

Expected behavior

When a terminal is destroyed and created again, it should create the exact same terminal with the same history.

Steps to reproduce

  1. Clone repo https://github.com/jcubic/jquery.terminal-docs
  2. run in terminal cd docs && npm install && npm start
  3. When browser open up type few commands
  4. Modify something in the source code
  5. Press up arrow
  6. No history

Browser and OS

N/A

Additional notes

The terminal_id needs to be updated when a terminal is destroyed.

jcubic commented 1 month ago

The problem is with Cycle::length, it returned array length and not how many items were in the array, removing the item is using delete data[index]. So after each hot reload, the terminal_id is the next value.

Changing the behavior of Cycle breaks half of unit tests.

jcubic commented 1 month ago

This is only required by hot reload, so the fix was to add id option that replace old terminal with the same data in Cycle data structure.

With a single terminal on the page, you can use:

$('...').terminal(commands, {
   id: 0
});

And history will be preserved between reloads.